/* _content/Rgclouds.Web/Components/Layout/AppLayout.razor.rz.scp.css */
/* ============================================================
   🏗️ AppLayout.razor.css — Layout con Sidebar Claro Elegante
   🎯 Sidebar blanco con iconos de colores + Header cristal
   📱 Responsive: drawer lateral en movil, fijo en desktop
   ============================================================ */

/* ============================================================
   📐 LAYOUT GRID
   ============================================================ */

.app-layout[b-uutl8o7wqp] {
    display: grid;
    grid-template-columns: 310px 1fr;
    grid-template-rows: 1fr;
    min-height: 100vh;
    width: 100%;
    transition: grid-template-columns 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.app-layout.sidebar-collapsed[b-uutl8o7wqp] {
    grid-template-columns: 72px 1fr;
}

/* ============================================================
   🗂️ SIDEBAR — Fondo claro, limpio y elegante
   ============================================================ */

.app-sidebar[b-uutl8o7wqp] {
    grid-column: 1;
    display: flex;
    flex-direction: column;
    height: 100vh;
    position: sticky;
    top: 0;
    overflow: hidden;
    z-index: 100;
    background: var(--rg-bg-sidebar, #ffffff);
    border-right: 1px solid var(--rg-border, #eef0f4);
    box-shadow: var(--rg-shadow-sidebar, 2px 0 12px rgba(0,0,0,0.04));
}

/* ============================================================
   🏢 SIDEBAR HEADER — Logo premium
   ============================================================ */

.sidebar-header[b-uutl8o7wqp] {
    flex-shrink: 0;
    padding: 1.125rem 1rem;
    border-bottom: 1px solid var(--rg-border, #eef0f4);
}

.sidebar-brand[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Sidebar brand clickeable → dashboard */
.sidebar-brand-clickable[b-uutl8o7wqp] {
    cursor: pointer;
    padding: 0.25rem;
    margin: -0.25rem;
    border-radius: 10px;
    transition: background-color 0.18s ease, transform 0.18s ease;
}

.sidebar-brand-clickable:hover[b-uutl8o7wqp] {
    background-color: rgba(255, 255, 255, 0.06);
    transform: translateY(-1px);
}

.sidebar-brand-clickable:active[b-uutl8o7wqp] {
    transform: translateY(0);
}

/* Sidebar user info clickeable → dashboard */
.sidebar-user-info-clickable[b-uutl8o7wqp] {
    cursor: pointer;
    transition: background-color 0.18s ease, transform 0.18s ease;
}

.sidebar-user-info-clickable:hover[b-uutl8o7wqp] {
    background-color: rgba(255, 255, 255, 0.06);
    transform: translateY(-1px);
}

.sidebar-user-info-clickable:active[b-uutl8o7wqp] {
    transform: translateY(0);
}

.brand-icon[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    flex-shrink: 0;
}

[b-uutl8o7wqp] .brand-logo-img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.brand-text[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.brand-name[b-uutl8o7wqp] {
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.brand-edition[b-uutl8o7wqp] {
    font-size: 0.625rem;
    color: var(--rg-text-faint, #94a3b8);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* ============================================================
   📋 SIDEBAR NAV — Area scrollable
   ============================================================ */

.sidebar-nav[b-uutl8o7wqp] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.75rem 0.625rem;
    scrollbar-width: thin;
    scrollbar-color: var(--rg-border, #e2e8f0) transparent;
}

.sidebar-nav[b-uutl8o7wqp]::-webkit-scrollbar {
    width: 3px;
}

.sidebar-nav[b-uutl8o7wqp]::-webkit-scrollbar-thumb {
    background: var(--rg-border, #e2e8f0);
    border-radius: 3px;
}

/* 📭 Estado vacio */
.nav-empty[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-faint, #94a3b8);
    text-align: center;
}

.nav-empty i[b-uutl8o7wqp] { font-size: 2.5rem; opacity: 0.4; }
.nav-empty span[b-uutl8o7wqp] { font-size: 0.8125rem; }

/* 🔄 Esqueletos de carga */
.nav-loading[b-uutl8o7wqp] {
    padding: 1rem 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.nav-loading-pulse[b-uutl8o7wqp] {
    height: 40px;
    background: var(--rg-bg-subtle, #f1f5f9);
    border-radius: 10px;
    animation: sidebarPulse-b-uutl8o7wqp 1.5s ease-in-out infinite;
}

.nav-loading-pulse.short[b-uutl8o7wqp] {
    width: 70%;
    height: 30px;
    margin-left: 1rem;
}

@keyframes sidebarPulse-b-uutl8o7wqp {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}

/* ============================================================
   🎨 COLORES DE MODULOS — 8 colores rotativos para iconos
   ============================================================ */

.nav-icon-box[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 0.9375rem;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

/* 🖼️ Imagen de aplicacion dentro del icon-box */
.nav-module-img[b-uutl8o7wqp] {
    width: 22px;
    height: 22px;
    object-fit: contain;
    border-radius: 4px;
}

/* 🔵 Azul */
.nav-icon-box.mc-0[b-uutl8o7wqp] { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }
/* 🟢 Verde */
.nav-icon-box.mc-1[b-uutl8o7wqp] { background: rgba(16, 185, 129, 0.1); color: #10b981; }
/* 🟣 Violeta */
.nav-icon-box.mc-2[b-uutl8o7wqp] { background: rgba(139, 92, 246, 0.1); color: #8b5cf6; }
/* 🟠 Naranja */
.nav-icon-box.mc-3[b-uutl8o7wqp] { background: rgba(249, 115, 22, 0.1); color: #f97316; }
/* 🔴 Rosa */
.nav-icon-box.mc-4[b-uutl8o7wqp] { background: rgba(244, 63, 94, 0.1); color: #f43f5e; }
/* 🟡 Ambar */
.nav-icon-box.mc-5[b-uutl8o7wqp] { background: rgba(245, 158, 11, 0.1); color: #f59e0b; }
/* 🩵 Cyan */
.nav-icon-box.mc-6[b-uutl8o7wqp] { background: rgba(6, 182, 212, 0.1); color: #06b6d4; }
/* 🟤 Indigo */
.nav-icon-box.mc-7[b-uutl8o7wqp] { background: rgba(99, 102, 241, 0.1); color: #6366f1; }

/* ============================================================
   📂 MODULOS — Items raiz
   ============================================================ */

.nav-module[b-uutl8o7wqp] {
    margin-bottom: 2px;
}

.nav-module-btn[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.5rem 0.625rem;
    border: none;
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    border-radius: 10px;
    position: relative;
}

.nav-module-btn:hover[b-uutl8o7wqp] {
    background: var(--rg-bg-hover, #f8fafc);
    color: var(--rg-text-primary, #1e293b);
}

/* 🟢 Modulo expandido */
.nav-module-btn.expanded[b-uutl8o7wqp] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-subtle, #f1f5f9);
}

.nav-module-btn.expanded .nav-icon-box[b-uutl8o7wqp] {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.nav-label[b-uutl8o7wqp] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 🔽 Chevron */
.nav-chevron[b-uutl8o7wqp] {
    font-size: 0.6rem;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0.3;
    flex-shrink: 0;
    color: var(--rg-text-faint, #94a3b8);
}

.nav-module-btn.expanded .nav-chevron[b-uutl8o7wqp],
.nav-group-btn.expanded .nav-chevron[b-uutl8o7wqp] {
    transform: rotate(90deg);
    opacity: 0.6;
}

/* ============================================================
   📁 SUBMENU — Items hijos
   ============================================================ */

.nav-submenu[b-uutl8o7wqp] {
    overflow: hidden;
    animation: submenuOpen-b-uutl8o7wqp 0.2s ease-out;
    margin-left: 0.25rem;
    padding-left: 0.5rem;
    border-left: 2px solid var(--rg-border, #eef0f4);
    margin-top: 2px;
    margin-bottom: 6px;
}

@keyframes submenuOpen-b-uutl8o7wqp {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

.nav-item[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
    padding: 0.4375rem 0.5rem;
    padding-right: 0.375rem;
    border: none;
    background: transparent;
    color: var(--rg-text-muted, #64748b);
    font-size: 0.7875rem;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    border-radius: 8px;
    margin: 1px 0;
}

.nav-item:hover[b-uutl8o7wqp] {
    background: var(--rg-bg-hover, #f8fafc);
    color: var(--rg-primary, #3b82f6);
}

.nav-item i:first-child[b-uutl8o7wqp] {
    width: 1rem;
    text-align: center;
    flex-shrink: 0;
    font-size: 0.8rem;
}

.nav-item span[b-uutl8o7wqp] {
    white-space: normal;
    word-break: break-word;
    line-height: 1.3;
}

.nav-group-btn[b-uutl8o7wqp] {
    font-weight: 500;
    color: var(--rg-text-secondary, #475569);
}

.nav-group-btn.expanded[b-uutl8o7wqp] {
    color: var(--rg-text-primary, #1e293b);
}

/* 🎯 Hoja navegable */
.nav-leaf:hover[b-uutl8o7wqp] {
    color: var(--rg-primary, #3b82f6);
    background: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.06);
}

.nav-leaf:hover .nav-leaf-dot[b-uutl8o7wqp] {
    background: var(--rg-primary, #3b82f6);
    box-shadow: 0 0 6px rgba(var(--rg-primary-rgb, 59, 130, 246), 0.4);
}

.nav-leaf-dot[b-uutl8o7wqp] {
    display: inline-block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--rg-text-faint, #d1d5db);
    flex-shrink: 0;
    transition: all 0.2s ease;
}

/* ============================================================
   👤 SIDEBAR FOOTER — Perfil usuario
   ============================================================ */

.sidebar-footer[b-uutl8o7wqp] {
    flex-shrink: 0;
    border-top: 1px solid var(--rg-border, #eef0f4);
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background: var(--rg-bg-footer, #fafbfc);
}

.sidebar-user-info[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.5rem;
    border-radius: 10px;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #eef0f4);
}

.sidebar-user-avatar[b-uutl8o7wqp],
.sidebar-user-avatar-sm[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--rg-gradient, linear-gradient(135deg, #1e3a8a, #3b82f6));
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0.05em;
}

.sidebar-user-avatar-sm[b-uutl8o7wqp] {
    margin: 0 auto;
}

.sidebar-user-details[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sidebar-user-name[b-uutl8o7wqp] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}

.sidebar-user-role[b-uutl8o7wqp] {
    font-size: 0.675rem;
    color: var(--rg-text-faint, #94a3b8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

/* 🔧 Boton colapsar */
.sidebar-toggle[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.4375rem;
    border: none;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-faint, #94a3b8);
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 8px;
    width: 100%;
}

.sidebar-toggle:hover[b-uutl8o7wqp] {
    background: var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
}

.sidebar-toggle i[b-uutl8o7wqp] {
    font-size: 0.8rem;
}

/* 🔄 Botón refresh — variante del sidebar-toggle con acento de color */
.sidebar-refresh-btn[b-uutl8o7wqp] {
    color: var(--rg-accent, #2563eb);
    background: rgba(37,99,235,0.07);
}
.sidebar-refresh-btn:hover:not(:disabled)[b-uutl8o7wqp] {
    background: rgba(37,99,235,0.14);
    color: var(--rg-accent, #2563eb);
}
.sidebar-refresh-btn:disabled[b-uutl8o7wqp] {
    opacity: 0.55;
    cursor: not-allowed;
}
.sidebar-refresh-btn.refreshing[b-uutl8o7wqp] {
    background: rgba(37,99,235,0.1);
}
/* Animación spin reutiliza la clase .spin definida en app.css */
@keyframes spin-b-uutl8o7wqp { to { transform: rotate(360deg); } }
.spin[b-uutl8o7wqp] { display: inline-block; animation: spin-b-uutl8o7wqp 0.7s linear infinite; }

[data-mode="dark"] .sidebar-refresh-btn[b-uutl8o7wqp] {
    color: #93c5fd;
    background: rgba(147,197,253,0.1);
}
[data-mode="dark"] .sidebar-refresh-btn:hover:not(:disabled)[b-uutl8o7wqp] {
    background: rgba(147,197,253,0.18);
}

/* ============================================================
   📦 CONTENIDO PRINCIPAL
   ============================================================ */

.app-main[b-uutl8o7wqp] {
    grid-column: 2;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--rg-bg-page, #f4f6fa);
    overflow: hidden;
}

/* ============================================================
   🔝 HEADER — Barra superior cristal
   ============================================================ */

.app-header[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0 1.5rem;
    height: 60px;
    min-height: 60px;
    background: var(--rg-bg-header, rgba(255, 255, 255, 0.92));
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--rg-border, #eef0f4);
    z-index: 50;
    flex-shrink: 0;
}

.header-menu-btn[b-uutl8o7wqp] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: none;
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    font-size: 1.3rem;
    cursor: pointer;
    border-radius: 10px;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.header-menu-btn:hover[b-uutl8o7wqp] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-primary, #3b82f6);
}

/* 🏢 Info empresa */
.header-company-info[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
    position: relative;
}

.header-company-info.switchable[b-uutl8o7wqp] {
    cursor: pointer;
    padding: 0.35rem 0.5rem;
    border-radius: 0.5rem;
    transition: all 0.15s;
}

.header-company-info.switchable:hover[b-uutl8o7wqp] {
    background: var(--rg-bg-hover, #f1f5f9);
}

.header-company-chevron[b-uutl8o7wqp] {
    font-size: 0.6rem;
    color: var(--rg-text-muted, #94a3b8);
    transition: transform 0.2s;
    margin-left: 0.25rem;
}

.header-company-chevron.open[b-uutl8o7wqp] {
    transform: rotate(180deg);
}

.header-company-icon[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--rg-gradient-soft, linear-gradient(135deg, #eff6ff, #dbeafe));
    color: var(--rg-primary, #3b82f6);
    font-size: 0.9375rem;
    flex-shrink: 0;
}

.header-company-text[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.header-company-name[b-uutl8o7wqp] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}

.header-company-branch[b-uutl8o7wqp] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 0.25rem;
    line-height: 1.3;
}

.header-company-branch i[b-uutl8o7wqp] {
    font-size: 0.6rem;
    color: var(--rg-primary, #3b82f6);
}

.header-spacer[b-uutl8o7wqp] { flex: 1; }

/* 📅 Chips de Fecha Proceso y Mes Cerrado en el header */
.header-param-chip[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    background: rgba(26, 58, 92, 0.08);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    color: var(--rg-text-secondary);
    white-space: nowrap;
    margin-right: 0.4rem;
}

.header-param-chip i[b-uutl8o7wqp] {
    font-size: 0.7rem;
    color: var(--rg-primary);
}

.header-param-label[b-uutl8o7wqp] {
    color: var(--rg-text-muted);
    font-weight: 500;
}

.header-param-value[b-uutl8o7wqp] {
    font-weight: 700;
    color: var(--rg-text-primary);
}

.header-param-chip-warn[b-uutl8o7wqp] {
    background: rgba(234, 88, 12, 0.08);
    border-color: rgba(234, 88, 12, 0.25);
}

.header-param-chip-warn i[b-uutl8o7wqp] {
    color: #ea580c;
}

.header-param-chip-warn .header-param-value[b-uutl8o7wqp] {
    color: #ea580c;
}

/* 🧾 Chip e-CF: empresa emisora de factura electrónica → borde verde oscuro */
.header-param-chip-encf[b-uutl8o7wqp] {
    background: rgba(21, 128, 61, 0.08);
    border-color: rgba(21, 128, 61, 0.45);
}

.header-param-chip-encf i[b-uutl8o7wqp] {
    color: #15803d;
}

.header-param-chip-encf .header-param-label[b-uutl8o7wqp] {
    color: #166534;
}

.header-param-chip-encf .header-param-value[b-uutl8o7wqp] {
    color: #14532d;
}

[data-mode="dark"] .header-param-chip-encf[b-uutl8o7wqp] {
    background: rgba(21, 128, 61, 0.12);
    border-color: rgba(74, 222, 128, 0.35);
}

[data-mode="dark"] .header-param-chip-encf i[b-uutl8o7wqp],
[data-mode="dark"] .header-param-chip-encf .header-param-label[b-uutl8o7wqp],
[data-mode="dark"] .header-param-chip-encf .header-param-value[b-uutl8o7wqp] {
    color: #86efac;
}

[data-mode="dark"] .header-param-chip[b-uutl8o7wqp] {
    background: rgba(255, 255, 255, 0.06);
}

[data-mode="dark"] .header-param-chip-warn[b-uutl8o7wqp] {
    background: rgba(234, 88, 12, 0.12);
}

/* 📱 Móvil: ocultar chip de Mes Cerrado, conservar solo Fecha Proceso */
@media (max-width: 768px) {
    .header-param-chip-warn[b-uutl8o7wqp] {
        display: none;
    }
}

/* 📱 Boton WhatsApp en header */
.header-wa-btn[b-uutl8o7wqp] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: rgba(37, 211, 102, 0.1);
    color: #25d366;
    font-size: 1.15rem;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-left: 0.5rem;
}

.header-wa-btn:hover[b-uutl8o7wqp] {
    background: rgba(37, 211, 102, 0.2);
    transform: scale(1.08);
}

.header-wa-btn.online[b-uutl8o7wqp] {
    background: #25d366;
    color: #fff;
    box-shadow: 0 2px 8px rgba(37, 211, 102, 0.35);
}

.header-wa-btn.online:hover[b-uutl8o7wqp] {
    background: #1fb855;
    box-shadow: 0 3px 12px rgba(37, 211, 102, 0.45);
}

.header-wa-dot[b-uutl8o7wqp] {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #25d366;
    border: 2px solid var(--rg-bg-header, #fff);
    animation: waPulse-b-uutl8o7wqp 2s ease-in-out infinite;
}

.header-wa-btn.online .header-wa-dot[b-uutl8o7wqp] {
    background: #fff;
    border-color: #25d366;
}

@keyframes waPulse-b-uutl8o7wqp {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* 📦 Secciones header */
.header-section[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    padding: 0 0.625rem;
    position: relative;
}

.header-section + .header-section[b-uutl8o7wqp]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 22px;
    background: var(--rg-border, #e2e8f0);
}

/* 🎨 Temas — Gota expandible (acordeón) */
.theme-picker[b-uutl8o7wqp] {
    position: relative;
    display: flex;
    align-items: center;
}

/* Botón gota — siempre visible, color del tema actual */
.theme-drop-btn[b-uutl8o7wqp] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid transparent;
    background: var(--dot-color, var(--rg-primary, #0B8AD9));
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.18);
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .2s;
    position: relative;
    z-index: 2;
}
.theme-drop-btn:hover[b-uutl8o7wqp] {
    transform: scale(1.10);
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.theme-drop-icon[b-uutl8o7wqp] {
    font-size: .92rem;
    line-height: 1;
    transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.theme-picker.open .theme-drop-btn[b-uutl8o7wqp] { transform: scale(1.08); }
.theme-picker.open .theme-drop-icon[b-uutl8o7wqp] { transform: rotate(-180deg); }

/* Panel — acordeón horizontal */
.theme-drop-panel[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    margin-left: 0;
    background: var(--rg-bg-card, #fff);
    border: 1px solid transparent;
    border-radius: 20px;
    box-shadow: 0 4px 14px rgba(0,0,0,.10);
    opacity: 0;
    transform: translateX(-8px);
    transition:
        max-width .42s cubic-bezier(.4,0,.2,1),
        padding   .42s cubic-bezier(.4,0,.2,1),
        margin-left .42s cubic-bezier(.4,0,.2,1),
        opacity   .25s ease,
        transform .35s cubic-bezier(.4,0,.2,1),
        border-color .25s ease;
    pointer-events: none;
}
.theme-picker.open .theme-drop-panel[b-uutl8o7wqp] {
    max-width: 700px;       /* lo bastante para 15 puntos + gaps */
    padding: 6px 10px;
    margin-left: 8px;
    opacity: 1;
    transform: translateX(0);
    border-color: var(--rg-border, #eef0f4);
    pointer-events: auto;
    gap: 0.3125rem;
}
[data-mode="dark"] .theme-drop-panel[b-uutl8o7wqp] { box-shadow: 0 4px 14px rgba(0,0,0,.4); }

.theme-dot[b-uutl8o7wqp] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--dot-color);
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    /* Entran con stagger */
    opacity: 0;
    transform: scale(.4);
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), opacity .25s ease, border-color .2s, box-shadow .2s;
}
.theme-picker.open .theme-dot[b-uutl8o7wqp] {
    opacity: 1;
    transform: scale(1);
}
/* Stagger: aparición progresiva de cada punto */
.theme-picker.open .theme-dot:nth-child(1)[b-uutl8o7wqp]  { transition-delay: .05s; }
.theme-picker.open .theme-dot:nth-child(2)[b-uutl8o7wqp]  { transition-delay: .07s; }
.theme-picker.open .theme-dot:nth-child(3)[b-uutl8o7wqp]  { transition-delay: .09s; }
.theme-picker.open .theme-dot:nth-child(4)[b-uutl8o7wqp]  { transition-delay: .11s; }
.theme-picker.open .theme-dot:nth-child(5)[b-uutl8o7wqp]  { transition-delay: .13s; }
.theme-picker.open .theme-dot:nth-child(6)[b-uutl8o7wqp]  { transition-delay: .15s; }
.theme-picker.open .theme-dot:nth-child(7)[b-uutl8o7wqp]  { transition-delay: .17s; }
.theme-picker.open .theme-dot:nth-child(8)[b-uutl8o7wqp]  { transition-delay: .19s; }
.theme-picker.open .theme-dot:nth-child(9)[b-uutl8o7wqp]  { transition-delay: .21s; }
.theme-picker.open .theme-dot:nth-child(10)[b-uutl8o7wqp] { transition-delay: .23s; }
.theme-picker.open .theme-dot:nth-child(11)[b-uutl8o7wqp] { transition-delay: .25s; }
.theme-picker.open .theme-dot:nth-child(12)[b-uutl8o7wqp] { transition-delay: .27s; }
.theme-picker.open .theme-dot:nth-child(13)[b-uutl8o7wqp] { transition-delay: .29s; }
.theme-picker.open .theme-dot:nth-child(14)[b-uutl8o7wqp] { transition-delay: .31s; }
.theme-picker.open .theme-dot:nth-child(15)[b-uutl8o7wqp] { transition-delay: .33s; }

.theme-dot:hover[b-uutl8o7wqp] {
    transform: scale(1.35);
}

.theme-dot.active[b-uutl8o7wqp] {
    border-color: var(--dot-color);
    background: transparent;
    box-shadow: inset 0 0 0 4px var(--dot-color);
    transform: scale(1.15);
}

/* 🌐 Idioma */
.header-lang[b-uutl8o7wqp] { gap: 0.25rem; }

.lang-btn[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 2px solid transparent;
    background: transparent;
    border-radius: 8px;
    cursor: pointer;
    font-size: 1.05rem;
    transition: all 0.2s ease;
    padding: 0;
}

.lang-btn:hover[b-uutl8o7wqp] { background: var(--rg-bg-subtle, #f1f5f9); }

.lang-btn.active[b-uutl8o7wqp] {
    background: var(--rg-primary-light, #eff6ff);
    border-color: var(--rg-primary, #3b82f6);
}

/* 👤 Usuario */
.header-user-section[b-uutl8o7wqp] { gap: 0.5rem; }

.header-user-pill[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.1875rem;
    padding-right: 0.75rem;
    background: var(--rg-bg-hover, #f8fafc);
    border-radius: 999px;
    border: 1px solid var(--rg-border, #eef0f4);
}

.header-user-avatar[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--rg-gradient, linear-gradient(135deg, #1e3a8a, #3b82f6));
    color: #ffffff;
    font-size: 0.625rem;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0.05em;
}

.header-user-name[b-uutl8o7wqp] {
    font-size: 0.7875rem;
    font-weight: 500;
    color: var(--rg-text-secondary, #334155);
    white-space: nowrap;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-logout[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--rg-text-faint, #94a3b8);
    font-size: 1rem;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.header-logout:hover[b-uutl8o7wqp] {
    background: #fef2f2;
    color: #ef4444;
}

/* ============================================================
   🌙 DARK MODE TOGGLE — Boton sol/luna
   ============================================================ */

.header-dark-toggle[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 2px solid transparent;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #64748b);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.25s ease;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.header-dark-toggle:hover[b-uutl8o7wqp] {
    background: var(--rg-bg-hover, #e2e8f0);
    color: var(--rg-primary, #3b82f6);
    transform: rotate(15deg);
}

.header-dark-toggle.active[b-uutl8o7wqp] {
    background: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.12);
    color: var(--rg-primary, #3b82f6);
    border-color: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.2);
}

/* ============================================================
   📄 AREA DE CONTENIDO
   ============================================================ */

.app-content[b-uutl8o7wqp] {
    flex: 1;
    padding: 1.5rem;
    overflow-y: auto;
    overflow-x: hidden;
}

/* ============================================================
   📱 OVERLAY
   ============================================================ */

.sidebar-overlay[b-uutl8o7wqp] {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 90;
    backdrop-filter: blur(4px);
    animation: overlayIn-b-uutl8o7wqp 0.25s ease;
}

@keyframes overlayIn-b-uutl8o7wqp {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ============================================================
   🎬 ANIMACIONES
   ============================================================ */

[b-uutl8o7wqp] .rg-fade-in { animation: rgFadeIn-b-uutl8o7wqp 0.3s ease; }
[b-uutl8o7wqp] .rg-slide-up { animation: rgSlideUp-b-uutl8o7wqp 0.4s cubic-bezier(0.4, 0, 0.2, 1); }

@keyframes rgFadeIn-b-uutl8o7wqp { from { opacity: 0; } to { opacity: 1; } }
@keyframes rgSlideUp-b-uutl8o7wqp {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   📱 RESPONSIVE — Tablet
   ============================================================ */

@media (max-width: 1024px) {
    .app-layout[b-uutl8o7wqp] { grid-template-columns: 240px 1fr; }
    .app-layout.sidebar-collapsed[b-uutl8o7wqp] { grid-template-columns: 72px 1fr; }
    .header-company-branch[b-uutl8o7wqp] { display: none; }
    .header-user-name[b-uutl8o7wqp] { display: none; }
    .header-user-pill[b-uutl8o7wqp] { padding-right: 0.1875rem; }
}

/* ============================================================
   🏢 Company Switcher Dropdown
   ============================================================ */

.company-switcher-backdrop[b-uutl8o7wqp] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.company-switcher-dropdown[b-uutl8o7wqp] {
    position: fixed;
    top: 60px;
    left: 60px;
    width: 340px;
    max-height: 400px;
    overflow-y: auto;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.10);
    z-index: 1050;
    animation: dropIn-b-uutl8o7wqp 0.15s ease-out;
}

@keyframes dropIn-b-uutl8o7wqp {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
}

.company-switcher-header[b-uutl8o7wqp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--rg-text-muted, #94a3b8);
}

.company-switcher-count[b-uutl8o7wqp] {
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}

.company-switcher-item[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    color: inherit;
    transition: all 0.15s;
    border-left: 3px solid transparent;
}

.company-switcher-item:hover:not(:disabled)[b-uutl8o7wqp] {
    background: var(--rg-bg-hover, #f8fafc);
}

.company-switcher-item.current[b-uutl8o7wqp] {
    background: rgba(79, 70, 229, 0.04);
    border-left-color: var(--rg-accent, #4f46e5);
    cursor: default;
}

.company-switcher-item:disabled[b-uutl8o7wqp] {
    opacity: 0.7;
}

.company-switcher-item-icon[b-uutl8o7wqp] {
    width: 32px;
    height: 32px;
    border-radius: 0.5rem;
    background: var(--rg-bg-hover, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    color: var(--rg-text-muted, #94a3b8);
    flex-shrink: 0;
}

.company-switcher-item.current .company-switcher-item-icon[b-uutl8o7wqp] {
    background: rgba(79, 70, 229, 0.1);
    color: var(--rg-accent, #4f46e5);
}

.company-switcher-item-info[b-uutl8o7wqp] {
    flex: 1;
    min-width: 0;
}

.company-switcher-item-name[b-uutl8o7wqp] {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.company-switcher-item-branch[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.68rem;
    color: var(--rg-text-muted, #94a3b8);
}

.company-switcher-item-branch i[b-uutl8o7wqp] {
    font-size: 0.55rem;
}

.company-switcher-current-badge[b-uutl8o7wqp] {
    font-size: 0.6rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    background: rgba(79, 70, 229, 0.1);
    color: var(--rg-accent, #4f46e5);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.company-switcher-loading[b-uutl8o7wqp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

/* ============================================================
   📱 RESPONSIVE — Movil (drawer)
   ============================================================ */

@media (max-width: 768px) {
    .app-layout[b-uutl8o7wqp] { grid-template-columns: 1fr; }
    .app-layout.sidebar-collapsed[b-uutl8o7wqp] { grid-template-columns: 1fr; }

    .app-sidebar[b-uutl8o7wqp] {
        position: fixed;
        left: -320px;
        top: 0;
        width: 310px;
        height: 100vh;
        z-index: 200;
        transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: none;
    }

    .app-layout.sidebar-mobile-open .app-sidebar[b-uutl8o7wqp] {
        left: 0;
        box-shadow: 8px 0 32px rgba(0, 0, 0, 0.15);
    }

    .app-layout.sidebar-mobile-open .sidebar-overlay[b-uutl8o7wqp] { display: block; }
    .app-main[b-uutl8o7wqp] { grid-column: 1; }
    .header-menu-btn[b-uutl8o7wqp] { display: flex; }
    .sidebar-toggle[b-uutl8o7wqp] { display: none; }
    .header-themes[b-uutl8o7wqp] { display: none; }
    .app-content[b-uutl8o7wqp] { padding: 1rem; }
    .app-header[b-uutl8o7wqp] { padding: 0 0.75rem; gap: 0.5rem; }
    .header-section[b-uutl8o7wqp]::before { display: none !important; }
    .header-lang[b-uutl8o7wqp] { padding: 0 0.25rem; }
    .header-user-section[b-uutl8o7wqp] { padding: 0; }
}

@media (max-width: 480px) {
    .header-lang[b-uutl8o7wqp] { display: none; }
    .header-company-text[b-uutl8o7wqp] { display: none; }
    .app-content[b-uutl8o7wqp] { padding: 0.75rem; }
}

/* ============================================================
   ⏳ CONTENT LOADING — Spinner mientras se restaura la sesion
   ============================================================ */

.content-loading[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 40vh;
    gap: 1rem;
    color: var(--rg-text-muted);
    font-size: 0.9rem;
}

.content-loading-spinner[b-uutl8o7wqp] {
    width: 36px;
    height: 36px;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: content-spin-b-uutl8o7wqp 0.7s linear infinite;
}

@keyframes content-spin-b-uutl8o7wqp {
    to { transform: rotate(360deg); }
}

/* ── Acceso Denegado ───────────────────────────────── */
.access-denied[b-uutl8o7wqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    gap: 0.75rem;
    animation: slideUp-b-uutl8o7wqp 0.3s ease-out;
}
@keyframes slideUp-b-uutl8o7wqp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.access-denied-icon[b-uutl8o7wqp] {
    font-size: 3.5rem;
    color: var(--rg-danger, #dc2626);
    margin-bottom: 0.5rem;
}
.access-denied h2[b-uutl8o7wqp] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0;
}
.access-denied p[b-uutl8o7wqp] {
    font-size: 0.9rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0;
}
.access-denied-hint[b-uutl8o7wqp] {
    font-size: 0.8rem;
    color: var(--rg-text-muted, #94a3b8);
}
/* _content/Rgclouds.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-6vkvhi97q2] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-6vkvhi97q2] {
    flex: 1;
}

.sidebar[b-6vkvhi97q2] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-6vkvhi97q2] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-6vkvhi97q2]  a, .top-row[b-6vkvhi97q2]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-6vkvhi97q2]  a:hover, .top-row[b-6vkvhi97q2]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-6vkvhi97q2]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-6vkvhi97q2] {
        justify-content: space-between;
    }

    .top-row[b-6vkvhi97q2]  a, .top-row[b-6vkvhi97q2]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-6vkvhi97q2] {
        flex-direction: row;
    }

    .sidebar[b-6vkvhi97q2] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-6vkvhi97q2] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-6vkvhi97q2]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-6vkvhi97q2], article[b-6vkvhi97q2] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-6vkvhi97q2] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-6vkvhi97q2] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/Rgclouds.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-b9cyswqrvy] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-b9cyswqrvy] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-b9cyswqrvy] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-b9cyswqrvy] {
    font-size: 1.1rem;
}

.bi[b-b9cyswqrvy] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-b9cyswqrvy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-b9cyswqrvy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-b9cyswqrvy] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-b9cyswqrvy] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-b9cyswqrvy] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-b9cyswqrvy] {
        padding-bottom: 1rem;
    }

    .nav-item[b-b9cyswqrvy]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-b9cyswqrvy]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-b9cyswqrvy]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-b9cyswqrvy] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-b9cyswqrvy] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-b9cyswqrvy] {
        display: none;
    }

    .nav-scrollable[b-b9cyswqrvy] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/Rgclouds.Web/Components/Layout/PwaInstallBanner.razor.rz.scp.css */
/* ============================================================
   📱 PwaInstallBanner.razor.css — Banner PWA instalacion
   ============================================================ */

.pwa-banner[b-ki1bvbm0xc] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #fff;
    border-top: 1px solid #e2e8f0;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.12);
    padding: 0.875rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    safe-area-inset-bottom: env(safe-area-inset-bottom, 0);
    padding-bottom: calc(0.875rem + env(safe-area-inset-bottom, 0px));
}

.pwa-slide-in[b-ki1bvbm0xc] {
    animation: pwaSlideIn-b-ki1bvbm0xc 0.35s ease-out;
}

.pwa-slide-out[b-ki1bvbm0xc] {
    animation: pwaSlideOut-b-ki1bvbm0xc 0.3s ease-in forwards;
}

@keyframes pwaSlideIn-b-ki1bvbm0xc {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes pwaSlideOut-b-ki1bvbm0xc {
    from { transform: translateY(0); opacity: 1; }
    to { transform: translateY(100%); opacity: 0; }
}

.pwa-banner-content[b-ki1bvbm0xc] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.pwa-banner-icon[b-ki1bvbm0xc] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.75rem;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.pwa-banner-icon img[b-ki1bvbm0xc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pwa-banner-text[b-ki1bvbm0xc] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.pwa-banner-text strong[b-ki1bvbm0xc] {
    font-size: 0.9rem;
    color: #1e293b;
    line-height: 1.2;
}

.pwa-banner-text span[b-ki1bvbm0xc] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.3;
}

.pwa-banner-actions[b-ki1bvbm0xc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.pwa-btn-install[b-ki1bvbm0xc] {
    background: var(--rg-primary, #0B8AD9);
    color: white;
    border: none;
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    transition: background 0.2s, transform 0.15s;
    white-space: nowrap;
}

.pwa-btn-install:hover[b-ki1bvbm0xc] {
    background: var(--rg-primary-dark, #0974b8);
}

.pwa-btn-install:active[b-ki1bvbm0xc] {
    transform: scale(0.96);
}

.pwa-btn-dismiss[b-ki1bvbm0xc] {
    background: none;
    border: none;
    color: #94a3b8;
    font-size: 1.1rem;
    padding: 0.35rem;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s, background 0.2s;
}

.pwa-btn-dismiss:hover[b-ki1bvbm0xc] {
    color: #475569;
    background: #f1f5f9;
}

/* En pantallas muy pequeñas, apretar más */
@media (max-width: 360px) {
    .pwa-banner-text span[b-ki1bvbm0xc] {
        display: none;
    }

    .pwa-btn-install[b-ki1bvbm0xc] {
        padding: 0.45rem 0.75rem;
        font-size: 0.8rem;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Activosfijo/Frmmaestraactivofijo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rapnk7bd02] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rapnk7bd02 0.3s ease-out; }
@keyframes slideUp-b-rapnk7bd02 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rapnk7bd02] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rapnk7bd02] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rapnk7bd02] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rapnk7bd02] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rapnk7bd02] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rapnk7bd02] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rapnk7bd02] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rapnk7bd02] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rapnk7bd02] { filter: brightness(1.1); }
.btn-outline[b-rapnk7bd02] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rapnk7bd02] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rapnk7bd02] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rapnk7bd02] { filter: brightness(1.1); }
.btn-icon[b-rapnk7bd02] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rapnk7bd02] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rapnk7bd02] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rapnk7bd02] { color: #ef4444; }
.btn-delete:hover[b-rapnk7bd02] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rapnk7bd02] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rapnk7bd02] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rapnk7bd02] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rapnk7bd02] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rapnk7bd02] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rapnk7bd02] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rapnk7bd02] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rapnk7bd02] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rapnk7bd02] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rapnk7bd02] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rapnk7bd02] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rapnk7bd02] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rapnk7bd02] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rapnk7bd02] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rapnk7bd02] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rapnk7bd02] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rapnk7bd02] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rapnk7bd02] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rapnk7bd02] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rapnk7bd02] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rapnk7bd02] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rapnk7bd02] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rapnk7bd02] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rapnk7bd02] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rapnk7bd02] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rapnk7bd02] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rapnk7bd02] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rapnk7bd02] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rapnk7bd02] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rapnk7bd02] { display: block; }
.hide-on-cards[b-rapnk7bd02] { display: none !important; }
.show-on-cards[b-rapnk7bd02] { display: grid; }
.hide-on-grid[b-rapnk7bd02] { display: none !important; }

/* Badges */
.badge[b-rapnk7bd02] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rapnk7bd02] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rapnk7bd02] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rapnk7bd02] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rapnk7bd02] { text-align: center; }
.text-muted[b-rapnk7bd02] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rapnk7bd02], .crud-empty-state[b-rapnk7bd02] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rapnk7bd02] { font-size: 2rem; }
.crud-spinner[b-rapnk7bd02] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rapnk7bd02 0.6s linear infinite; }
.crud-spinner-sm[b-rapnk7bd02] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rapnk7bd02 0.6s linear infinite; }
@keyframes spin-b-rapnk7bd02 { to { transform: rotate(360deg); } }
.spin[b-rapnk7bd02] { animation: spin-b-rapnk7bd02 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rapnk7bd02] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rapnk7bd02 0.15s ease-out; }
.modal-container[b-rapnk7bd02] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rapnk7bd02] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rapnk7bd02 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rapnk7bd02] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rapnk7bd02] { max-width: 420px; }
@keyframes fadeIn-b-rapnk7bd02 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rapnk7bd02 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rapnk7bd02] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rapnk7bd02] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rapnk7bd02] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rapnk7bd02] { color: #dc2626; }
.modal-close[b-rapnk7bd02] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rapnk7bd02] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rapnk7bd02] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rapnk7bd02] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rapnk7bd02] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rapnk7bd02] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rapnk7bd02] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rapnk7bd02] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rapnk7bd02] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rapnk7bd02] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rapnk7bd02] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rapnk7bd02] { flex: 2; }
.form-group label[b-rapnk7bd02] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rapnk7bd02], .form-group select[b-rapnk7bd02], .form-textarea[b-rapnk7bd02] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rapnk7bd02], .form-group select:focus[b-rapnk7bd02], .form-textarea:focus[b-rapnk7bd02] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rapnk7bd02] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rapnk7bd02] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rapnk7bd02] { flex: 1; display: flex; align-items: center; }
.form-check[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rapnk7bd02] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rapnk7bd02] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rapnk7bd02] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rapnk7bd02] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rapnk7bd02] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rapnk7bd02] { font-size: 3rem; }
.photo-placeholder span[b-rapnk7bd02] { font-size: 0.78rem; }
.photo-actions[b-rapnk7bd02] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rapnk7bd02] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rapnk7bd02] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rapnk7bd02] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rapnk7bd02] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rapnk7bd02] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rapnk7bd02] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rapnk7bd02] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rapnk7bd02] { filter: brightness(1.15); transform: scale(1.05); }
[b-rapnk7bd02] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rapnk7bd02] { padding: 0.75rem; }
    .crud-header[b-rapnk7bd02] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rapnk7bd02] { font-size: 1.1rem; }
    .btn-text[b-rapnk7bd02] { display: none; }
    .form-row[b-rapnk7bd02] { flex-direction: column; }
    .form-row-4[b-rapnk7bd02] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rapnk7bd02] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rapnk7bd02] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rapnk7bd02] { padding: 0.75rem; }
    .modal-tabs[b-rapnk7bd02] { overflow-x: auto; }
    .modal-tab[b-rapnk7bd02] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rapnk7bd02] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rapnk7bd02] { display: grid !important; }
    .crud-cards-wrapper[b-rapnk7bd02] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rapnk7bd02] { grid-template-columns: 1fr; }
    .card-details[b-rapnk7bd02] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rapnk7bd02] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rapnk7bd02] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rapnk7bd02] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rapnk7bd02] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Admin/FrmAdmParametrosSistema.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qgj9i5dlil] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qgj9i5dlil 0.3s ease-out; }
@keyframes slideUp-b-qgj9i5dlil { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qgj9i5dlil] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qgj9i5dlil] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qgj9i5dlil] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qgj9i5dlil] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qgj9i5dlil] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qgj9i5dlil] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qgj9i5dlil] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qgj9i5dlil] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qgj9i5dlil] { filter: brightness(1.1); }
.btn-outline[b-qgj9i5dlil] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qgj9i5dlil] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qgj9i5dlil] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qgj9i5dlil] { filter: brightness(1.1); }
.btn-icon[b-qgj9i5dlil] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qgj9i5dlil] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qgj9i5dlil] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qgj9i5dlil] { color: #ef4444; }
.btn-delete:hover[b-qgj9i5dlil] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qgj9i5dlil] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qgj9i5dlil] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qgj9i5dlil] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qgj9i5dlil] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qgj9i5dlil] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qgj9i5dlil] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qgj9i5dlil] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qgj9i5dlil] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qgj9i5dlil] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qgj9i5dlil] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qgj9i5dlil] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qgj9i5dlil] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qgj9i5dlil] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qgj9i5dlil] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qgj9i5dlil] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qgj9i5dlil] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qgj9i5dlil] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qgj9i5dlil] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qgj9i5dlil] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qgj9i5dlil] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qgj9i5dlil] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qgj9i5dlil] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qgj9i5dlil] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qgj9i5dlil] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qgj9i5dlil] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qgj9i5dlil] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qgj9i5dlil] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qgj9i5dlil] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qgj9i5dlil] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qgj9i5dlil] { display: block; }
.hide-on-cards[b-qgj9i5dlil] { display: none !important; }
.show-on-cards[b-qgj9i5dlil] { display: grid; }
.hide-on-grid[b-qgj9i5dlil] { display: none !important; }

/* Badges */
.badge[b-qgj9i5dlil] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qgj9i5dlil] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qgj9i5dlil] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qgj9i5dlil] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qgj9i5dlil] { text-align: center; }
.text-muted[b-qgj9i5dlil] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qgj9i5dlil], .crud-empty-state[b-qgj9i5dlil] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qgj9i5dlil] { font-size: 2rem; }
.crud-spinner[b-qgj9i5dlil] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qgj9i5dlil 0.6s linear infinite; }
.crud-spinner-sm[b-qgj9i5dlil] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qgj9i5dlil 0.6s linear infinite; }
@keyframes spin-b-qgj9i5dlil { to { transform: rotate(360deg); } }
.spin[b-qgj9i5dlil] { animation: spin-b-qgj9i5dlil 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qgj9i5dlil] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qgj9i5dlil 0.15s ease-out; }
.modal-container[b-qgj9i5dlil] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qgj9i5dlil] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qgj9i5dlil 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-qgj9i5dlil] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qgj9i5dlil] { max-width: 420px; }
@keyframes fadeIn-b-qgj9i5dlil { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qgj9i5dlil { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qgj9i5dlil] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qgj9i5dlil] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qgj9i5dlil] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qgj9i5dlil] { color: #dc2626; }
.modal-close[b-qgj9i5dlil] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qgj9i5dlil] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qgj9i5dlil] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qgj9i5dlil] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qgj9i5dlil] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qgj9i5dlil] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qgj9i5dlil] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qgj9i5dlil] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qgj9i5dlil] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qgj9i5dlil] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qgj9i5dlil] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qgj9i5dlil] { flex: 2; }
.form-group label[b-qgj9i5dlil] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qgj9i5dlil], .form-group select[b-qgj9i5dlil], .form-textarea[b-qgj9i5dlil] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qgj9i5dlil], .form-group select:focus[b-qgj9i5dlil], .form-textarea:focus[b-qgj9i5dlil] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qgj9i5dlil] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qgj9i5dlil] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qgj9i5dlil] { flex: 1; display: flex; align-items: center; }
.form-check[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qgj9i5dlil] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qgj9i5dlil] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qgj9i5dlil] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qgj9i5dlil] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qgj9i5dlil] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qgj9i5dlil] { font-size: 3rem; }
.photo-placeholder span[b-qgj9i5dlil] { font-size: 0.78rem; }
.photo-actions[b-qgj9i5dlil] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qgj9i5dlil] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-qgj9i5dlil] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qgj9i5dlil] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qgj9i5dlil] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qgj9i5dlil] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qgj9i5dlil] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qgj9i5dlil] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qgj9i5dlil] { filter: brightness(1.15); transform: scale(1.05); }
[b-qgj9i5dlil] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qgj9i5dlil] { padding: 0.75rem; }
    .crud-header[b-qgj9i5dlil] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qgj9i5dlil] { font-size: 1.1rem; }
    .btn-text[b-qgj9i5dlil] { display: none; }
    .form-row[b-qgj9i5dlil] { flex-direction: column; }
    .form-row-4[b-qgj9i5dlil] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qgj9i5dlil] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qgj9i5dlil] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qgj9i5dlil] { padding: 0.75rem; }
    .modal-tabs[b-qgj9i5dlil] { overflow-x: auto; }
    .modal-tab[b-qgj9i5dlil] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qgj9i5dlil] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qgj9i5dlil] { display: grid !important; }
    .crud-cards-wrapper[b-qgj9i5dlil] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qgj9i5dlil] { grid-template-columns: 1fr; }
    .card-details[b-qgj9i5dlil] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-qgj9i5dlil] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qgj9i5dlil] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qgj9i5dlil] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qgj9i5dlil] { background:rgba(37,99,235,.25); }

/* ============================================================
   Parámetros del Sistema — estilos específicos
   ============================================================ */

/* Layout 2 columnas */
.ps-body[b-qgj9i5dlil] { display: grid; grid-template-columns: 280px 1fr; gap: 1rem; align-items: start; }
.ps-side[b-qgj9i5dlil] { background: var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:0.5rem; padding:0.75rem; max-height: calc(100vh - 220px); overflow-y:auto; }
.ps-side h3[b-qgj9i5dlil] { font-size:0.78rem; color:var(--rg-text-muted,#94a3b8); text-transform:uppercase; margin-bottom:0.5rem; }
.ps-filtro[b-qgj9i5dlil] { width:100%; padding:0.4rem 0.6rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:0.375rem; margin-bottom:0.5rem; background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b); font-size:0.82rem; }
.ps-item[b-qgj9i5dlil] { display:flex; align-items:center; gap:0.4rem; padding:0.4rem 0.6rem; border-radius:0.375rem; cursor:pointer; font-size:0.82rem; color:var(--rg-text-secondary,#475569); font-family:'Cascadia Code',monospace; }
.ps-item:hover[b-qgj9i5dlil] { background:var(--rg-bg-hover,#f1f5f9); color:var(--rg-text-primary,#1e293b); }
.ps-item.active[b-qgj9i5dlil] { background:rgba(37,99,235,0.12); color:var(--rg-accent,#2563eb); font-weight:700; }
.ps-item-badge[b-qgj9i5dlil] { margin-left:auto; background:var(--rg-bg-subtle,#f1f5f9); padding:0.05rem 0.45rem; border-radius:1rem; font-size:0.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:700; }
.ps-item.active .ps-item-badge[b-qgj9i5dlil] { background:rgba(37,99,235,0.2); color:var(--rg-accent,#2563eb); }

/* Detalle */
.ps-detail[b-qgj9i5dlil] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:0.5rem; padding:1rem; min-height: 400px; }
.ps-detail-header[b-qgj9i5dlil] { display:flex; align-items:center; gap:0.75rem; margin-bottom:0.75rem; padding-bottom:0.75rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.ps-detail-title[b-qgj9i5dlil] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.ps-detail-meta[b-qgj9i5dlil] { font-size:0.78rem; color:var(--rg-text-muted,#94a3b8); }
.ps-actions[b-qgj9i5dlil] { display:flex; align-items:center; gap:0.5rem; margin-bottom:0.6rem; }
.ps-counter[b-qgj9i5dlil] { font-size:0.8rem; font-weight:600; color:var(--rg-warning,#d97706); margin-left:auto; }
.ps-counter.zero[b-qgj9i5dlil] { color:var(--rg-text-muted,#94a3b8); }

/* Grid editable */
.ps-grid-wrap[b-qgj9i5dlil] { overflow-x:auto; border:1px solid var(--rg-border,#e2e8f0); border-radius:0.5rem; max-height: calc(100vh - 380px); }
.ps-grid[b-qgj9i5dlil] { width:100%; border-collapse:collapse; font-size:0.8rem; }
.ps-grid th[b-qgj9i5dlil] { background:var(--rg-bg-subtle,#f8fafc); padding:0.45rem 0.6rem; text-align:left; font-weight:600; font-size:0.7rem; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); border-bottom:2px solid var(--rg-border,#e2e8f0); white-space:nowrap; position:sticky; top:0; z-index:1; }
.ps-grid th i[b-qgj9i5dlil] { margin-right:0.25rem; font-size:0.78rem; }
.ps-grid td[b-qgj9i5dlil] { padding:0.25rem 0.4rem; border-bottom:1px solid var(--rg-border,#e2e8f0); vertical-align:middle; }
.ps-grid tr[b-qgj9i5dlil] { border-left:3px solid transparent; transition:background 0.15s; }
.ps-grid tr.modif[b-qgj9i5dlil] { border-left-color:var(--rg-warning,#d97706); background:rgba(217,119,6,0.04); }
.ps-grid tr.nueva[b-qgj9i5dlil] { border-left-color:var(--rg-success,#16a34a); background:rgba(22,163,74,0.04); }
.ps-grid tr.del[b-qgj9i5dlil]   { border-left-color:var(--rg-danger,#dc2626);  background:rgba(220,38,38,0.05); opacity:0.6; }

.ps-cell-input[b-qgj9i5dlil] { width:100%; padding:0.3rem 0.45rem; border:1px solid transparent; border-radius:0.3rem; background:transparent; color:var(--rg-text-primary,#1e293b); font-size:0.78rem; font-family:inherit; }
.ps-cell-input:hover[b-qgj9i5dlil] { background:var(--rg-bg-input,#fff); border-color:var(--rg-border,#e2e8f0); }
.ps-cell-input:focus[b-qgj9i5dlil] { background:var(--rg-bg-input,#fff); border-color:var(--rg-accent,#2563eb); outline:none; box-shadow:0 0 0 2px rgba(37,99,235,0.15); }
.ps-cell-input.cuenta.ok[b-qgj9i5dlil] { background:rgba(22,163,74,0.06); border-color:rgba(22,163,74,0.3); }
.ps-cell-input.cuenta.empty[b-qgj9i5dlil] { background:rgba(217,119,6,0.05); border-color:rgba(217,119,6,0.25); }
.ps-cell-readonly[b-qgj9i5dlil] { color:var(--rg-text-muted,#94a3b8); font-family:'Cascadia Code',monospace; padding:0.3rem 0.45rem; }
.ps-cell-pk[b-qgj9i5dlil] { color:var(--rg-accent,#2563eb); font-weight:700; }
.ps-cell-del[b-qgj9i5dlil] { background:transparent; border:none; cursor:pointer; color:var(--rg-text-muted,#94a3b8); padding:0.25rem; }
.ps-cell-del:hover[b-qgj9i5dlil] { color:var(--rg-danger,#dc2626); }

/* Modal de Ayuda — contenido */
.help-icon-header[b-qgj9i5dlil] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-qgj9i5dlil] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-qgj9i5dlil] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-qgj9i5dlil] { border-bottom:none; }
.help-section p[b-qgj9i5dlil] { font-size:0.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:0.4rem; }
.help-section ul[b-qgj9i5dlil], .help-section ol[b-qgj9i5dlil] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-qgj9i5dlil] { font-size:0.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:0.2rem; }
.help-section-title[b-qgj9i5dlil] { display:flex; align-items:center; gap:0.45rem; font-size:0.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:0.65rem; }
.help-section-title i[b-qgj9i5dlil] { color:var(--rg-accent,#2563eb); }
.help-tip[b-qgj9i5dlil] { display:flex; gap:0.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 0.4rem 0.4rem 0; padding:0.65rem 0.8rem; margin-top:0.5rem; font-size:0.82rem; color:var(--rg-text-secondary,#475569); }
.help-tip i[b-qgj9i5dlil] { color:var(--rg-accent,#2563eb); font-size:1rem; flex-shrink:0; margin-top:0.05rem; }
[data-mode="dark"] .help-tip[b-qgj9i5dlil] { background:rgba(37,99,235,0.12); }
.help-steps[b-qgj9i5dlil] { display:flex; flex-direction:column; gap:0.5rem; margin-top:0.4rem; }
.help-step[b-qgj9i5dlil] { display:flex; gap:0.6rem; align-items:flex-start; }
.help-step-num[b-qgj9i5dlil] { display:inline-flex; align-items:center; justify-content:center; min-width:1.5rem; height:1.5rem; background:var(--rg-accent,#2563eb); color:#fff; border-radius:50%; font-size:0.72rem; font-weight:700; flex-shrink:0; margin-top:0.1rem; }
.help-step div[b-qgj9i5dlil] { font-size:0.85rem; color:var(--rg-text-secondary,#475569); padding-top:0.1rem; }

/* Responsive */
@media (max-width: 900px) {
    .ps-body[b-qgj9i5dlil] { grid-template-columns: 1fr; }
    .ps-side[b-qgj9i5dlil] { max-height: 240px; }
}
/* _content/Rgclouds.Web/Components/Pages/Admin/FrmAdmTenants.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-r944ntvs8q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-r944ntvs8q 0.3s ease-out; }
@keyframes slideUp-b-r944ntvs8q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-r944ntvs8q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-r944ntvs8q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-r944ntvs8q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-r944ntvs8q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-r944ntvs8q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-r944ntvs8q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-r944ntvs8q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-r944ntvs8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-r944ntvs8q] { filter: brightness(1.1); }
.btn-outline[b-r944ntvs8q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-r944ntvs8q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-r944ntvs8q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-r944ntvs8q] { filter: brightness(1.1); }
.btn-icon[b-r944ntvs8q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-r944ntvs8q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-r944ntvs8q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-r944ntvs8q] { color: #ef4444; }
.btn-delete:hover[b-r944ntvs8q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-r944ntvs8q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-r944ntvs8q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-r944ntvs8q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-r944ntvs8q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-r944ntvs8q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-r944ntvs8q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-r944ntvs8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-r944ntvs8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-r944ntvs8q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-r944ntvs8q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-r944ntvs8q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-r944ntvs8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-r944ntvs8q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-r944ntvs8q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-r944ntvs8q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-r944ntvs8q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-r944ntvs8q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-r944ntvs8q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-r944ntvs8q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-r944ntvs8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-r944ntvs8q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-r944ntvs8q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-r944ntvs8q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-r944ntvs8q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-r944ntvs8q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-r944ntvs8q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-r944ntvs8q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-r944ntvs8q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-r944ntvs8q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-r944ntvs8q] { display: block; }
.hide-on-cards[b-r944ntvs8q] { display: none !important; }
.show-on-cards[b-r944ntvs8q] { display: grid; }
.hide-on-grid[b-r944ntvs8q] { display: none !important; }

/* Badges */
.badge[b-r944ntvs8q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-r944ntvs8q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-r944ntvs8q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-r944ntvs8q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-r944ntvs8q] { text-align: center; }
.text-muted[b-r944ntvs8q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-r944ntvs8q], .crud-empty-state[b-r944ntvs8q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-r944ntvs8q] { font-size: 2rem; }
.crud-spinner[b-r944ntvs8q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-r944ntvs8q 0.6s linear infinite; }
.crud-spinner-sm[b-r944ntvs8q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-r944ntvs8q 0.6s linear infinite; }
@keyframes spin-b-r944ntvs8q { to { transform: rotate(360deg); } }
.spin[b-r944ntvs8q] { animation: spin-b-r944ntvs8q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-r944ntvs8q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-r944ntvs8q 0.15s ease-out; }
.modal-container[b-r944ntvs8q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-r944ntvs8q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-r944ntvs8q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-r944ntvs8q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-r944ntvs8q] { max-width: 420px; }
@keyframes fadeIn-b-r944ntvs8q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-r944ntvs8q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-r944ntvs8q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-r944ntvs8q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-r944ntvs8q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-r944ntvs8q] { color: #dc2626; }
.modal-close[b-r944ntvs8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-r944ntvs8q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-r944ntvs8q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-r944ntvs8q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-r944ntvs8q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-r944ntvs8q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-r944ntvs8q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-r944ntvs8q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-r944ntvs8q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-r944ntvs8q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-r944ntvs8q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-r944ntvs8q] { flex: 2; }
.form-group label[b-r944ntvs8q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-r944ntvs8q], .form-group select[b-r944ntvs8q], .form-textarea[b-r944ntvs8q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-r944ntvs8q], .form-group select:focus[b-r944ntvs8q], .form-textarea:focus[b-r944ntvs8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-r944ntvs8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-r944ntvs8q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-r944ntvs8q] { flex: 1; display: flex; align-items: center; }
.form-check[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-r944ntvs8q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-r944ntvs8q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-r944ntvs8q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-r944ntvs8q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-r944ntvs8q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-r944ntvs8q] { font-size: 3rem; }
.photo-placeholder span[b-r944ntvs8q] { font-size: 0.78rem; }
.photo-actions[b-r944ntvs8q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-r944ntvs8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-r944ntvs8q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-r944ntvs8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-r944ntvs8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-r944ntvs8q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-r944ntvs8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-r944ntvs8q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-r944ntvs8q] { filter: brightness(1.15); transform: scale(1.05); }
[b-r944ntvs8q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-r944ntvs8q] { padding: 0.75rem; }
    .crud-header[b-r944ntvs8q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-r944ntvs8q] { font-size: 1.1rem; }
    .btn-text[b-r944ntvs8q] { display: none; }
    .form-row[b-r944ntvs8q] { flex-direction: column; }
    .form-row-4[b-r944ntvs8q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-r944ntvs8q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-r944ntvs8q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-r944ntvs8q] { padding: 0.75rem; }
    .modal-tabs[b-r944ntvs8q] { overflow-x: auto; }
    .modal-tab[b-r944ntvs8q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-r944ntvs8q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-r944ntvs8q] { display: grid !important; }
    .crud-cards-wrapper[b-r944ntvs8q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-r944ntvs8q] { grid-template-columns: 1fr; }
    .card-details[b-r944ntvs8q] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-r944ntvs8q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-r944ntvs8q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-r944ntvs8q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-r944ntvs8q] { background:rgba(37,99,235,.25); }

/* === Tabs internos === */
.adm-tabs[b-r944ntvs8q] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); margin-bottom: 1rem; }
.adm-tab[b-r944ntvs8q] {
    background: transparent; border: none; padding: 0.6rem 1rem;
    cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 0.88rem; font-weight: 600;
    display: inline-flex; align-items: center; gap: 0.5rem;
    border-bottom: 2px solid transparent; margin-bottom: -2px;
    transition: color 0.15s, border-color 0.15s;
}
.adm-tab:hover[b-r944ntvs8q] { color: var(--rg-text-primary,#1e293b); }
.adm-tab.active[b-r944ntvs8q] { color: var(--rg-accent,#2563eb); border-bottom-color: var(--rg-accent,#2563eb); }
.adm-tab i[b-r944ntvs8q] { font-size: 1rem; }
.adm-tab-count[b-r944ntvs8q] {
    background: var(--rg-bg-subtle,#f1f5f9); color: var(--rg-text-muted,#94a3b8);
    font-size: 0.7rem; padding: 0.05rem 0.45rem; border-radius: 1rem; font-weight: 700;
}
.adm-tab.active .adm-tab-count[b-r944ntvs8q] {
    background: rgba(37,99,235,0.15); color: var(--rg-accent,#2563eb);
}
/* _content/Rgclouds.Web/Components/Pages/Admin/FrmRouteMap.razor.rz.scp.css */
/* ============================================================
   FrmRouteMap — Administrador del Mapa de Rutas
   Estilos CRUD auto-contenidos (CSS isolation de Blazor)
   ============================================================ */

/* ── Contenedor ── */
.crud-container[b-8pd0gvdj5d] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8pd0gvdj5d 0.3s ease-out; }
@keyframes slideUp-b-8pd0gvdj5d { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-8pd0gvdj5d] { animation: slideUp-b-8pd0gvdj5d 0.3s ease-out; }

/* ── Header ── */
.crud-header[b-8pd0gvdj5d] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8pd0gvdj5d] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8pd0gvdj5d] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8pd0gvdj5d] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8pd0gvdj5d] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8pd0gvdj5d] { display: flex; gap: 0.5rem; }

/* ── Botones ── */
.btn-crud[b-8pd0gvdj5d] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8pd0gvdj5d] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8pd0gvdj5d] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8pd0gvdj5d] { filter: brightness(1.1); }
.btn-outline[b-8pd0gvdj5d] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8pd0gvdj5d] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8pd0gvdj5d] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8pd0gvdj5d] { filter: brightness(1.1); }
.btn-icon[b-8pd0gvdj5d] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8pd0gvdj5d] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8pd0gvdj5d] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8pd0gvdj5d] { color: #ef4444; }
.btn-delete:hover[b-8pd0gvdj5d] { background: rgba(239, 68, 68, 0.1); }

/* ── Alert ── */
.crud-alert[b-8pd0gvdj5d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8pd0gvdj5d] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8pd0gvdj5d] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8pd0gvdj5d] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-8pd0gvdj5d] { background: rgba(22,163,74,0.15); color: #86efac; border-color: rgba(22,163,74,0.3); }
[data-mode="dark"] .crud-alert.error[b-8pd0gvdj5d]   { background: rgba(239,68,68,0.15); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* ── Búsqueda ── */
.crud-search-bar[b-8pd0gvdj5d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8pd0gvdj5d] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8pd0gvdj5d] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-8pd0gvdj5d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0.25rem; }
.crud-search-clear[b-8pd0gvdj5d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8pd0gvdj5d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* ── Grid ── */
.crud-grid-wrapper[b-8pd0gvdj5d] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8pd0gvdj5d] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8pd0gvdj5d] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8pd0gvdj5d] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8pd0gvdj5d] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8pd0gvdj5d] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8pd0gvdj5d] { width: 80px; text-align: center; white-space: nowrap; }

/* ── Código y path ── */
.rm-code[b-8pd0gvdj5d] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.75rem; background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-accent, #4f46e5); padding: 0.1em 0.4em; border-radius: 4px; }
.rm-path[b-8pd0gvdj5d] { display: inline-flex; align-items: center; gap: 0.15rem; font-size: 0.78rem; color: var(--rg-text-secondary, #475569); }
.rm-path i[b-8pd0gvdj5d] { color: var(--rg-text-muted, #94a3b8); }

/* ── Loading / Empty ── */
.crud-loading[b-8pd0gvdj5d], .crud-empty-state[b-8pd0gvdj5d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8pd0gvdj5d] { font-size: 2rem; }
.crud-spinner[b-8pd0gvdj5d] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8pd0gvdj5d 0.6s linear infinite; }
@keyframes spin-b-8pd0gvdj5d { to { transform: rotate(360deg); } }
.spin[b-8pd0gvdj5d] { animation: spin-b-8pd0gvdj5d 0.8s linear infinite; }

/* ── Modal ── */
.modal-backdrop[b-8pd0gvdj5d] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(3px); z-index: 1000; animation: fadeIn-b-8pd0gvdj5d 0.15s ease-out; }
.modal-container[b-8pd0gvdj5d] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8pd0gvdj5d] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 520px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8pd0gvdj5d 0.2s ease-out; }
.modal-sm[b-8pd0gvdj5d] { max-width: 480px; }
@keyframes fadeIn-b-8pd0gvdj5d  { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8pd0gvdj5d { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8pd0gvdj5d] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8pd0gvdj5d] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8pd0gvdj5d] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8pd0gvdj5d] { color: #dc2626; }
.modal-close[b-8pd0gvdj5d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8pd0gvdj5d] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8pd0gvdj5d] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8pd0gvdj5d] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ── Formulario del modal ── */
.form-group label[b-8pd0gvdj5d] { display: block; font-size: 0.75rem; font-weight: 600; color: var(--rg-text-secondary, #475569); margin-bottom: 0.35rem; text-transform: uppercase; letter-spacing: 0.03em; }
.form-control[b-8pd0gvdj5d] { width: 100%; padding: 0.45rem 0.65rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.82rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); outline: none; transition: border-color 0.15s; font-family: 'Cascadia Code','Fira Code',monospace; }
.form-control:focus[b-8pd0gvdj5d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.form-control:disabled[b-8pd0gvdj5d] { opacity: 0.6; cursor: not-allowed; }
.form-control.is-invalid[b-8pd0gvdj5d] { border-color: #ef4444; }

/* URL input con "/" fijo */
.rm-path-input-wrap[b-8pd0gvdj5d] { display: flex; align-items: center; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; background: var(--rg-bg-input, #fff); }
.rm-path-input-wrap:focus-within[b-8pd0gvdj5d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.rm-path-prefix[b-8pd0gvdj5d] { padding: 0.45rem 0.5rem 0.45rem 0.65rem; font-size: 0.85rem; font-weight: 700; color: var(--rg-text-muted, #94a3b8); background: var(--rg-bg-subtle, #f8fafc); border-right: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; font-family: 'Cascadia Code','Fira Code',monospace; }
.rm-path-input-wrap .form-control[b-8pd0gvdj5d] { border: none; border-radius: 0; box-shadow: none; padding-left: 0.5rem; }
.rm-path-input-wrap .form-control:focus[b-8pd0gvdj5d] { box-shadow: none; }

.rm-req[b-8pd0gvdj5d] { color: #ef4444; margin-left: 2px; }
.rm-hint[b-8pd0gvdj5d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); margin-top: 0.25rem; display: block; }
.rm-hint code[b-8pd0gvdj5d] { font-size: 0.7rem; background: var(--rg-bg-subtle, #f1f5f9); padding: 0.05em 0.3em; border-radius: 3px; }
.rm-error[b-8pd0gvdj5d] { font-size: 0.7rem; color: #ef4444; margin-top: 0.2rem; display: block; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/Frmahoproductos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8v81qt2bnd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8v81qt2bnd 0.3s ease-out; }
@keyframes slideUp-b-8v81qt2bnd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8v81qt2bnd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8v81qt2bnd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8v81qt2bnd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8v81qt2bnd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8v81qt2bnd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8v81qt2bnd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8v81qt2bnd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8v81qt2bnd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8v81qt2bnd] { filter: brightness(1.1); }
.btn-outline[b-8v81qt2bnd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8v81qt2bnd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8v81qt2bnd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8v81qt2bnd] { filter: brightness(1.1); }
.btn-icon[b-8v81qt2bnd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8v81qt2bnd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8v81qt2bnd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8v81qt2bnd] { color: #ef4444; }
.btn-delete:hover[b-8v81qt2bnd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8v81qt2bnd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8v81qt2bnd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8v81qt2bnd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8v81qt2bnd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8v81qt2bnd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8v81qt2bnd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8v81qt2bnd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8v81qt2bnd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8v81qt2bnd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8v81qt2bnd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8v81qt2bnd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8v81qt2bnd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8v81qt2bnd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8v81qt2bnd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8v81qt2bnd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8v81qt2bnd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8v81qt2bnd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8v81qt2bnd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8v81qt2bnd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8v81qt2bnd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8v81qt2bnd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8v81qt2bnd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8v81qt2bnd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8v81qt2bnd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8v81qt2bnd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8v81qt2bnd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8v81qt2bnd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8v81qt2bnd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8v81qt2bnd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8v81qt2bnd] { display: block; }
.hide-on-cards[b-8v81qt2bnd] { display: none !important; }
.show-on-cards[b-8v81qt2bnd] { display: grid; }
.hide-on-grid[b-8v81qt2bnd] { display: none !important; }

/* Badges */
.badge[b-8v81qt2bnd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8v81qt2bnd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8v81qt2bnd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8v81qt2bnd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8v81qt2bnd] { text-align: center; }
.text-muted[b-8v81qt2bnd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8v81qt2bnd], .crud-empty-state[b-8v81qt2bnd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8v81qt2bnd] { font-size: 2rem; }
.crud-spinner[b-8v81qt2bnd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8v81qt2bnd 0.6s linear infinite; }
.crud-spinner-sm[b-8v81qt2bnd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8v81qt2bnd 0.6s linear infinite; }
@keyframes spin-b-8v81qt2bnd { to { transform: rotate(360deg); } }
.spin[b-8v81qt2bnd] { animation: spin-b-8v81qt2bnd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8v81qt2bnd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8v81qt2bnd 0.15s ease-out; }
.modal-container[b-8v81qt2bnd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8v81qt2bnd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8v81qt2bnd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8v81qt2bnd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8v81qt2bnd] { max-width: 420px; }
@keyframes fadeIn-b-8v81qt2bnd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8v81qt2bnd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8v81qt2bnd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8v81qt2bnd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8v81qt2bnd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8v81qt2bnd] { color: #dc2626; }
.modal-close[b-8v81qt2bnd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8v81qt2bnd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8v81qt2bnd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8v81qt2bnd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8v81qt2bnd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8v81qt2bnd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8v81qt2bnd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8v81qt2bnd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8v81qt2bnd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8v81qt2bnd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8v81qt2bnd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8v81qt2bnd] { flex: 2; }
.form-group label[b-8v81qt2bnd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8v81qt2bnd], .form-group select[b-8v81qt2bnd], .form-textarea[b-8v81qt2bnd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8v81qt2bnd], .form-group select:focus[b-8v81qt2bnd], .form-textarea:focus[b-8v81qt2bnd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8v81qt2bnd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8v81qt2bnd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8v81qt2bnd] { flex: 1; display: flex; align-items: center; }
.form-check[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8v81qt2bnd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8v81qt2bnd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8v81qt2bnd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8v81qt2bnd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8v81qt2bnd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8v81qt2bnd] { font-size: 3rem; }
.photo-placeholder span[b-8v81qt2bnd] { font-size: 0.78rem; }
.photo-actions[b-8v81qt2bnd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8v81qt2bnd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8v81qt2bnd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8v81qt2bnd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8v81qt2bnd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8v81qt2bnd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8v81qt2bnd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8v81qt2bnd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8v81qt2bnd] { filter: brightness(1.15); transform: scale(1.05); }
[b-8v81qt2bnd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8v81qt2bnd] { padding: 0.75rem; }
    .crud-header[b-8v81qt2bnd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8v81qt2bnd] { font-size: 1.1rem; }
    .btn-text[b-8v81qt2bnd] { display: none; }
    .form-row[b-8v81qt2bnd] { flex-direction: column; }
    .form-row-4[b-8v81qt2bnd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8v81qt2bnd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8v81qt2bnd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8v81qt2bnd] { padding: 0.75rem; }
    .modal-tabs[b-8v81qt2bnd] { overflow-x: auto; }
    .modal-tab[b-8v81qt2bnd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8v81qt2bnd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8v81qt2bnd] { display: grid !important; }
    .crud-cards-wrapper[b-8v81qt2bnd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8v81qt2bnd] { grid-template-columns: 1fr; }
    .card-details[b-8v81qt2bnd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8v81qt2bnd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8v81qt2bnd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8v81qt2bnd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8v81qt2bnd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/Frmahorroaperturaproducto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-bk3czwok3n] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bk3czwok3n 0.3s ease-out; }
@keyframes slideUp-b-bk3czwok3n { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bk3czwok3n] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bk3czwok3n] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bk3czwok3n] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bk3czwok3n] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bk3czwok3n] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bk3czwok3n] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bk3czwok3n] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bk3czwok3n] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bk3czwok3n] { filter: brightness(1.1); }
.btn-outline[b-bk3czwok3n] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bk3czwok3n] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bk3czwok3n] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bk3czwok3n] { filter: brightness(1.1); }
.btn-icon[b-bk3czwok3n] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bk3czwok3n] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bk3czwok3n] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bk3czwok3n] { color: #ef4444; }
.btn-delete:hover[b-bk3czwok3n] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-bk3czwok3n] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bk3czwok3n] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bk3czwok3n] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bk3czwok3n] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bk3czwok3n] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bk3czwok3n] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-bk3czwok3n] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bk3czwok3n] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-bk3czwok3n] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bk3czwok3n] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bk3czwok3n] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bk3czwok3n] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bk3czwok3n] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bk3czwok3n] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bk3czwok3n] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-bk3czwok3n] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-bk3czwok3n] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-bk3czwok3n] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-bk3czwok3n] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-bk3czwok3n] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-bk3czwok3n] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-bk3czwok3n] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-bk3czwok3n] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-bk3czwok3n] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-bk3czwok3n] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-bk3czwok3n] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-bk3czwok3n] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-bk3czwok3n] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-bk3czwok3n] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-bk3czwok3n] { display: block; }
.hide-on-cards[b-bk3czwok3n] { display: none !important; }
.show-on-cards[b-bk3czwok3n] { display: grid; }
.hide-on-grid[b-bk3czwok3n] { display: none !important; }

/* Badges */
.badge[b-bk3czwok3n] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bk3czwok3n] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bk3czwok3n] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-bk3czwok3n] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bk3czwok3n] { text-align: center; }
.text-muted[b-bk3czwok3n] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bk3czwok3n], .crud-empty-state[b-bk3czwok3n] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bk3czwok3n] { font-size: 2rem; }
.crud-spinner[b-bk3czwok3n] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bk3czwok3n 0.6s linear infinite; }
.crud-spinner-sm[b-bk3czwok3n] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bk3czwok3n 0.6s linear infinite; }
@keyframes spin-b-bk3czwok3n { to { transform: rotate(360deg); } }
.spin[b-bk3czwok3n] { animation: spin-b-bk3czwok3n 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-bk3czwok3n] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bk3czwok3n 0.15s ease-out; }
.modal-container[b-bk3czwok3n] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bk3czwok3n] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bk3czwok3n 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-bk3czwok3n] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-bk3czwok3n] { max-width: 420px; }
@keyframes fadeIn-b-bk3czwok3n { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bk3czwok3n { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bk3czwok3n] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bk3czwok3n] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-bk3czwok3n] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-bk3czwok3n] { color: #dc2626; }
.modal-close[b-bk3czwok3n] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bk3czwok3n] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bk3czwok3n] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bk3czwok3n] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bk3czwok3n] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-bk3czwok3n] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bk3czwok3n] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bk3czwok3n] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bk3czwok3n] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bk3czwok3n] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bk3czwok3n] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bk3czwok3n] { flex: 2; }
.form-group label[b-bk3czwok3n] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bk3czwok3n], .form-group select[b-bk3czwok3n], .form-textarea[b-bk3czwok3n] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bk3czwok3n], .form-group select:focus[b-bk3czwok3n], .form-textarea:focus[b-bk3czwok3n] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bk3czwok3n] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bk3czwok3n] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bk3czwok3n] { flex: 1; display: flex; align-items: center; }
.form-check[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bk3czwok3n] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-bk3czwok3n] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-bk3czwok3n] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-bk3czwok3n] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-bk3czwok3n] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-bk3czwok3n] { font-size: 3rem; }
.photo-placeholder span[b-bk3czwok3n] { font-size: 0.78rem; }
.photo-actions[b-bk3czwok3n] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-bk3czwok3n] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-bk3czwok3n] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-bk3czwok3n] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-bk3czwok3n] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-bk3czwok3n] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-bk3czwok3n] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-bk3czwok3n] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-bk3czwok3n] { filter: brightness(1.15); transform: scale(1.05); }
[b-bk3czwok3n] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bk3czwok3n] { padding: 0.75rem; }
    .crud-header[b-bk3czwok3n] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bk3czwok3n] { font-size: 1.1rem; }
    .btn-text[b-bk3czwok3n] { display: none; }
    .form-row[b-bk3czwok3n] { flex-direction: column; }
    .form-row-4[b-bk3czwok3n] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bk3czwok3n] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bk3czwok3n] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-bk3czwok3n] { padding: 0.75rem; }
    .modal-tabs[b-bk3czwok3n] { overflow-x: auto; }
    .modal-tab[b-bk3czwok3n] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-bk3czwok3n] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-bk3czwok3n] { display: grid !important; }
    .crud-cards-wrapper[b-bk3czwok3n] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-bk3czwok3n] { grid-template-columns: 1fr; }
    .card-details[b-bk3czwok3n] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-bk3czwok3n] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bk3czwok3n] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bk3czwok3n] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bk3czwok3n] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAhoSanApertura.razor.rz.scp.css */
/* ============================================================
   Plan San — Apertura (CRUD base + formulario + resumen)
   ============================================================ */

.crud-container[b-ubextj29fe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ubextj29fe 0.3s ease-out; }
@keyframes slideUp-b-ubextj29fe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ubextj29fe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ubextj29fe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ubextj29fe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ubextj29fe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ubextj29fe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ubextj29fe] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* Buttons */
.btn-crud[b-ubextj29fe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; text-decoration: none; }
.btn-crud:disabled[b-ubextj29fe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ubextj29fe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ubextj29fe] { filter: brightness(1.1); }
.btn-outline[b-ubextj29fe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ubextj29fe] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-ubextj29fe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ubextj29fe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ubextj29fe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ubextj29fe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Form sections */
.san-form-card[b-ubextj29fe] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1rem 1.25rem; margin-bottom: 1rem; }
.san-form-title[b-ubextj29fe] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.45rem; }
.san-form-title i[b-ubextj29fe] { color: var(--rg-accent,#4f46e5); }

/* Form */
.form-row[b-ubextj29fe] { display: flex; gap: 0.6rem; margin-bottom: 0.6rem; }
.form-group[b-ubextj29fe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-ubextj29fe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ubextj29fe], .form-group select[b-ubextj29fe] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-card,#fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ubextj29fe], .form-group select:focus[b-ubextj29fe] { border-color: var(--rg-accent,#4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.form-hint[b-ubextj29fe] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); margin-top: 0.15rem; }

/* Footer */
.san-form-actions[b-ubextj29fe] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1.25rem; }

/* Modal */
.modal-backdrop[b-ubextj29fe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ubextj29fe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ubextj29fe] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-header[b-ubextj29fe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ubextj29fe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ubextj29fe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ubextj29fe] { color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-hover,#f1f5f9); }
.modal-body[b-ubextj29fe] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-ubextj29fe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

/* Spinner */
.spin[b-ubextj29fe] { animation: spin-b-ubextj29fe 0.8s linear infinite; }
@keyframes spin-b-ubextj29fe { to { transform: rotate(360deg); } }

/* Botón ayuda */
.btn-help[b-ubextj29fe] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-ubextj29fe] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-ubextj29fe] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-ubextj29fe] { background: rgba(37,99,235,0.25); }

/* Help modal */
.help-icon-header[b-ubextj29fe] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-ubextj29fe] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ubextj29fe] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-ubextj29fe] { border-bottom: none; }
.help-section p[b-ubextj29fe] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-ubextj29fe], .help-section ol[b-ubextj29fe] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ubextj29fe] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-ubextj29fe] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ubextj29fe] { color: var(--rg-accent,#2563eb); }
.help-tip[b-ubextj29fe] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-ubextj29fe] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-ubextj29fe] { background: rgba(37,99,235,0.12); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ubextj29fe] { padding: 0.75rem; }
    .crud-header[b-ubextj29fe] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-ubextj29fe] { display: none; }
    .form-row[b-ubextj29fe] { flex-direction: column; }
}

/* ─────────── Resumen Plan San ─────────── */
.san-resumen[b-ubextj29fe] { background: rgba(37,99,235,0.06); border: 1px solid rgba(37,99,235,0.25); border-radius: 0.75rem; padding: 1rem 1.25rem; margin-top: 1rem; }
.san-resumen-title[b-ubextj29fe] { font-size: 0.85rem; font-weight: 700; color: var(--rg-accent,#2563eb); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.4rem; }
.san-resumen-row[b-ubextj29fe] { display: flex; justify-content: space-between; padding: 0.35rem 0; border-bottom: 1px dashed var(--rg-border); font-size: 0.88rem; }
.san-resumen-row:last-child[b-ubextj29fe] { border-bottom: none; font-weight: 700; padding-top: 0.5rem; }
.san-resumen-label[b-ubextj29fe] { color: var(--rg-text-secondary); }
.san-resumen-val[b-ubextj29fe] { font-family: 'Cascadia Code',monospace; color: var(--rg-text-primary); }
[data-mode="dark"] .san-resumen[b-ubextj29fe] { background: rgba(37,99,235,0.12); }

/* Validación de cliente al digitar cédula/RNC */
.cli-valid-banner[b-ubextj29fe] { display:flex; align-items:flex-start; gap:0.6rem; padding:0.55rem 0.8rem; border-radius:0.5rem; margin-top:0.4rem; font-size:0.82rem; border:1px solid var(--rg-border); }
.cli-valid-loading[b-ubextj29fe] { background:var(--rg-bg-subtle); color:var(--rg-text-secondary); }
.cli-valid-ok[b-ubextj29fe]      { background:rgba(22,163,74,0.08); border-color:rgba(22,163,74,0.3); }
.cli-valid-ok i[b-ubextj29fe]    { color:#16a34a; font-size:1.1rem; }
.cli-valid-err[b-ubextj29fe]     { background:rgba(220,38,38,0.08); border-color:rgba(220,38,38,0.3); color:#7f1d1d; }
.cli-valid-err i[b-ubextj29fe]   { color:#dc2626; font-size:1.1rem; }
[data-mode="dark"] .cli-valid-err[b-ubextj29fe]     { color:#fca5a5; }
[data-mode="dark"] .cli-valid-err div div:first-child[b-ubextj29fe] { color:#fca5a5 !important; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAhoSanCuentas.razor.rz.scp.css */
/* ============================================================
   Plan San — Listado de cuentas (CRUD base + extras San)
   ============================================================ */

.crud-container[b-7smluo8wke] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7smluo8wke 0.3s ease-out; }
@keyframes slideUp-b-7smluo8wke { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7smluo8wke] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7smluo8wke] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7smluo8wke] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7smluo8wke] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7smluo8wke] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7smluo8wke] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* Buttons */
.btn-crud[b-7smluo8wke] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; text-decoration: none; }
.btn-crud:disabled[b-7smluo8wke] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7smluo8wke] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7smluo8wke] { filter: brightness(1.1); }
.btn-outline[b-7smluo8wke] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7smluo8wke] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7smluo8wke] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7smluo8wke] { filter: brightness(1.1); }
.btn-icon[b-7smluo8wke] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }

/* Alert */
.crud-alert[b-7smluo8wke] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7smluo8wke] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7smluo8wke] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7smluo8wke] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7smluo8wke] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7smluo8wke] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7smluo8wke] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-7smluo8wke] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }
.crud-search-btn:hover[b-7smluo8wke] { color: var(--rg-accent, #4f46e5); }
.crud-search-clear[b-7smluo8wke] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7smluo8wke] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-7smluo8wke] { padding: 0.3rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); font-size: 0.78rem; outline: none; }

/* Grid */
.crud-grid-wrapper[b-7smluo8wke] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7smluo8wke] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7smluo8wke] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7smluo8wke] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7smluo8wke] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7smluo8wke] { background: var(--rg-bg-hover, #f8fafc); }

/* Badges */
.badge[b-7smluo8wke] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-warn[b-7smluo8wke] { background: rgba(217,119,6,0.15); color: #92400e; }
[data-mode="dark"] .badge-warn[b-7smluo8wke] { color: #fcd34d; }

/* Utilities */
.font-mono[b-7smluo8wke] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7smluo8wke] { text-align: center; }
.text-right[b-7smluo8wke] { text-align: right; }

/* Loading / Empty */
.crud-loading[b-7smluo8wke], .crud-empty-state[b-7smluo8wke] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7smluo8wke] { font-size: 2rem; }
.crud-spinner[b-7smluo8wke] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7smluo8wke 0.6s linear infinite; }
@keyframes spin-b-7smluo8wke { to { transform: rotate(360deg); } }
.spin[b-7smluo8wke] { animation: spin-b-7smluo8wke 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7smluo8wke] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-7smluo8wke] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7smluo8wke] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-7smluo8wke] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7smluo8wke] { max-width: 420px; }
.modal-header[b-7smluo8wke] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7smluo8wke] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7smluo8wke] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7smluo8wke] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7smluo8wke] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-7smluo8wke] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Botón ayuda */
.btn-help[b-7smluo8wke] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-7smluo8wke] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-7smluo8wke] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-7smluo8wke] { background: rgba(37,99,235,0.25); }

/* Help modal */
.help-icon-header[b-7smluo8wke] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7smluo8wke] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7smluo8wke] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7smluo8wke] { border-bottom: none; }
.help-section p[b-7smluo8wke] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-7smluo8wke], .help-section ol[b-7smluo8wke] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-7smluo8wke] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-7smluo8wke] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7smluo8wke] { color: var(--rg-accent,#2563eb); }
.help-tip[b-7smluo8wke] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7smluo8wke] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7smluo8wke] { background: rgba(37,99,235,0.12); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7smluo8wke] { padding: 0.75rem; }
    .crud-header[b-7smluo8wke] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-7smluo8wke] { display: none; }
    .modal-dialog[b-7smluo8wke] { width: 98%; max-height: 95vh; }
}

/* ─────────── Extras Plan San ─────────── */
.san-state-activo[b-7smluo8wke]    { background: rgba(22,163,74,0.15);  color: #166534; }
.san-state-vencido[b-7smluo8wke]   { background: rgba(217,119,6,0.15);  color: #92400e; }
.san-state-entregado[b-7smluo8wke] { background: rgba(100,116,139,0.15); color: #475569; }
[data-mode="dark"] .san-state-activo[b-7smluo8wke]    { color: #86efac; }
[data-mode="dark"] .san-state-vencido[b-7smluo8wke]   { color: #fcd34d; }
[data-mode="dark"] .san-state-entregado[b-7smluo8wke] { color: #cbd5e1; }
.san-money[b-7smluo8wke] { font-family: 'Cascadia Code',monospace; text-align: right; }
.san-money-highlight[b-7smluo8wke] { font-family: 'Cascadia Code',monospace; text-align: right; color: var(--rg-accent,#2563eb); font-weight: 700; }
.san-money-bold[b-7smluo8wke] { font-family: 'Cascadia Code',monospace; text-align: right; font-weight: 700; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAhoSanGanancia.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kn76vurttr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kn76vurttr 0.3s ease-out; }
@keyframes slideUp-b-kn76vurttr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kn76vurttr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kn76vurttr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kn76vurttr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kn76vurttr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kn76vurttr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kn76vurttr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kn76vurttr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kn76vurttr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kn76vurttr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kn76vurttr] { filter: brightness(1.1); }
.btn-outline[b-kn76vurttr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kn76vurttr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kn76vurttr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kn76vurttr] { filter: brightness(1.1); }
.btn-icon[b-kn76vurttr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kn76vurttr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kn76vurttr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kn76vurttr] { color: #ef4444; }
.btn-delete:hover[b-kn76vurttr] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kn76vurttr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kn76vurttr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kn76vurttr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kn76vurttr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kn76vurttr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kn76vurttr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kn76vurttr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kn76vurttr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kn76vurttr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kn76vurttr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kn76vurttr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kn76vurttr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kn76vurttr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kn76vurttr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kn76vurttr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kn76vurttr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kn76vurttr] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kn76vurttr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kn76vurttr] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kn76vurttr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kn76vurttr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kn76vurttr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kn76vurttr] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kn76vurttr] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kn76vurttr] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kn76vurttr] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kn76vurttr] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kn76vurttr] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kn76vurttr] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kn76vurttr] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kn76vurttr] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kn76vurttr] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kn76vurttr] { display: block; }
.hide-on-cards[b-kn76vurttr] { display: none !important; }
.show-on-cards[b-kn76vurttr] { display: grid; }
.hide-on-grid[b-kn76vurttr] { display: none !important; }

/* Badges */
.badge[b-kn76vurttr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kn76vurttr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kn76vurttr] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kn76vurttr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kn76vurttr] { text-align: center; }
.text-muted[b-kn76vurttr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kn76vurttr], .crud-empty-state[b-kn76vurttr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kn76vurttr] { font-size: 2rem; }
.crud-spinner[b-kn76vurttr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kn76vurttr 0.6s linear infinite; }
.crud-spinner-sm[b-kn76vurttr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kn76vurttr 0.6s linear infinite; }
@keyframes spin-b-kn76vurttr { to { transform: rotate(360deg); } }
.spin[b-kn76vurttr] { animation: spin-b-kn76vurttr 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kn76vurttr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kn76vurttr 0.15s ease-out; }
.modal-container[b-kn76vurttr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kn76vurttr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kn76vurttr 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-kn76vurttr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kn76vurttr] { max-width: 420px; }
@keyframes fadeIn-b-kn76vurttr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kn76vurttr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kn76vurttr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kn76vurttr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kn76vurttr] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kn76vurttr] { color: #dc2626; }
.modal-close[b-kn76vurttr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kn76vurttr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kn76vurttr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kn76vurttr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kn76vurttr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kn76vurttr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kn76vurttr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kn76vurttr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kn76vurttr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kn76vurttr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kn76vurttr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kn76vurttr] { flex: 2; }
.form-group label[b-kn76vurttr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kn76vurttr], .form-group select[b-kn76vurttr], .form-textarea[b-kn76vurttr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kn76vurttr], .form-group select:focus[b-kn76vurttr], .form-textarea:focus[b-kn76vurttr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kn76vurttr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kn76vurttr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kn76vurttr] { flex: 1; display: flex; align-items: center; }
.form-check[b-kn76vurttr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kn76vurttr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kn76vurttr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kn76vurttr] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kn76vurttr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kn76vurttr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kn76vurttr] { font-size: 3rem; }
.photo-placeholder span[b-kn76vurttr] { font-size: 0.78rem; }
.photo-actions[b-kn76vurttr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kn76vurttr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-kn76vurttr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kn76vurttr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kn76vurttr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kn76vurttr] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kn76vurttr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kn76vurttr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kn76vurttr] { filter: brightness(1.15); transform: scale(1.05); }
[b-kn76vurttr] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kn76vurttr] { padding: 0.75rem; }
    .crud-header[b-kn76vurttr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kn76vurttr] { font-size: 1.1rem; }
    .btn-text[b-kn76vurttr] { display: none; }
    .form-row[b-kn76vurttr] { flex-direction: column; }
    .form-row-4[b-kn76vurttr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kn76vurttr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kn76vurttr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kn76vurttr] { padding: 0.75rem; }
    .modal-tabs[b-kn76vurttr] { overflow-x: auto; }
    .modal-tab[b-kn76vurttr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kn76vurttr] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kn76vurttr] { display: grid !important; }
    .crud-cards-wrapper[b-kn76vurttr] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kn76vurttr] { grid-template-columns: 1fr; }
    .card-details[b-kn76vurttr] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-kn76vurttr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kn76vurttr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kn76vurttr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kn76vurttr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_AperturaCuenta.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-n2n7xa74ax] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-n2n7xa74ax 0.3s ease-out; }
@keyframes slideUp-b-n2n7xa74ax { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-n2n7xa74ax] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-n2n7xa74ax] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-n2n7xa74ax] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-n2n7xa74ax] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-n2n7xa74ax] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-n2n7xa74ax] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-n2n7xa74ax] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-n2n7xa74ax] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-n2n7xa74ax] { filter: brightness(1.1); }
.btn-outline[b-n2n7xa74ax] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-n2n7xa74ax] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-n2n7xa74ax] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-n2n7xa74ax] { filter: brightness(1.1); }
.btn-icon[b-n2n7xa74ax] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-n2n7xa74ax] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-n2n7xa74ax] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-n2n7xa74ax] { color: #ef4444; }
.btn-delete:hover[b-n2n7xa74ax] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-n2n7xa74ax] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-n2n7xa74ax] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-n2n7xa74ax] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-n2n7xa74ax] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-n2n7xa74ax] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-n2n7xa74ax] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-n2n7xa74ax] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-n2n7xa74ax] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-n2n7xa74ax] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-n2n7xa74ax] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-n2n7xa74ax] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-n2n7xa74ax] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-n2n7xa74ax] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-n2n7xa74ax] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-n2n7xa74ax] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-n2n7xa74ax] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-n2n7xa74ax] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-n2n7xa74ax] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-n2n7xa74ax] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-n2n7xa74ax] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-n2n7xa74ax] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-n2n7xa74ax] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-n2n7xa74ax] { background: #ecfdf5; color: #065f46; }
.badge-no[b-n2n7xa74ax] { background: #f1f5f9; color: #64748b; }
.badge-info[b-n2n7xa74ax] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-n2n7xa74ax] { background: #fffbeb; color: #92400e; }
.badge-danger[b-n2n7xa74ax] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-n2n7xa74ax] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-n2n7xa74ax] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-n2n7xa74ax] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-n2n7xa74ax] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-n2n7xa74ax] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-n2n7xa74ax] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-n2n7xa74ax] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-n2n7xa74ax] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-n2n7xa74ax] { text-align: center; }
.text-muted[b-n2n7xa74ax] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-n2n7xa74ax], .crud-empty-state[b-n2n7xa74ax] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-n2n7xa74ax] { font-size: 2rem; }
.crud-spinner[b-n2n7xa74ax] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-n2n7xa74ax 0.6s linear infinite; }
.crud-spinner-sm[b-n2n7xa74ax] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-n2n7xa74ax 0.6s linear infinite; }
@keyframes spin-b-n2n7xa74ax { to { transform: rotate(360deg); } }
.spin[b-n2n7xa74ax] { animation: spin-b-n2n7xa74ax 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-n2n7xa74ax] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-n2n7xa74ax 0.15s ease-out; }
.modal-container[b-n2n7xa74ax] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-n2n7xa74ax] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-n2n7xa74ax 0.2s ease-out; }
.modal-lg[b-n2n7xa74ax] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-n2n7xa74ax] { max-width: 420px; }
@keyframes fadeIn-b-n2n7xa74ax { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-n2n7xa74ax { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-n2n7xa74ax] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-n2n7xa74ax] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-n2n7xa74ax] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-n2n7xa74ax] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-n2n7xa74ax] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-n2n7xa74ax] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-n2n7xa74ax] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-n2n7xa74ax] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-n2n7xa74ax] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-n2n7xa74ax] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-n2n7xa74ax] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-n2n7xa74ax] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-n2n7xa74ax] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-n2n7xa74ax] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-n2n7xa74ax] { flex: 2; }
.form-group label[b-n2n7xa74ax] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-n2n7xa74ax], .form-group select[b-n2n7xa74ax], .form-textarea[b-n2n7xa74ax] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-n2n7xa74ax], .form-group select:focus[b-n2n7xa74ax], .form-textarea:focus[b-n2n7xa74ax] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-n2n7xa74ax] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-n2n7xa74ax] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-n2n7xa74ax] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-n2n7xa74ax] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-n2n7xa74ax] { margin-top: 0; }
.form-section-title i[b-n2n7xa74ax] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-n2n7xa74ax] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-n2n7xa74ax] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-n2n7xa74ax] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-n2n7xa74ax] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-n2n7xa74ax] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-n2n7xa74ax] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-n2n7xa74ax] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-n2n7xa74ax] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-n2n7xa74ax] { padding: 0.75rem; }
    .crud-header[b-n2n7xa74ax] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-n2n7xa74ax] { font-size: 1.1rem; }
    .btn-text[b-n2n7xa74ax] { display: none; }
    .form-row[b-n2n7xa74ax] { flex-direction: column; }
    .form-row-3[b-n2n7xa74ax] { grid-template-columns: 1fr; }
    .form-row-4[b-n2n7xa74ax] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-n2n7xa74ax] { width: 98%; max-height: 95vh; }
    .modal-lg[b-n2n7xa74ax] { max-width: 98vw; width: 98vw; }
    .modal-body[b-n2n7xa74ax] { padding: 0.75rem; }
    .modal-tabs[b-n2n7xa74ax] { overflow-x: auto; }
    .modal-tab[b-n2n7xa74ax] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-n2n7xa74ax] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-n2n7xa74ax] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-n2n7xa74ax] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-n2n7xa74ax] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-n2n7xa74ax] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-n2n7xa74ax] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-n2n7xa74ax] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-n2n7xa74ax] { border-bottom: none; }
.help-section p[b-n2n7xa74ax] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-n2n7xa74ax], .help-section ol[b-n2n7xa74ax] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-n2n7xa74ax] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-n2n7xa74ax] { color: var(--rg-accent,#2563eb); }
.help-tip[b-n2n7xa74ax] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-n2n7xa74ax] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-n2n7xa74ax] { background: rgba(37,99,235,0.12); }
.help-table[b-n2n7xa74ax] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-n2n7xa74ax] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-n2n7xa74ax] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-n2n7xa74ax] { background: rgba(255,255,255,0.04); }

/* ── Validación de identidad de cliente + DGII ─────────────────────── */
.cli-info-box[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; border-radius: 0.5rem; margin: 0.5rem 0 1rem; border: 1px solid var(--rg-border); background: var(--rg-bg-subtle); }
.cli-info-box.ok[b-n2n7xa74ax]   { border-left: 4px solid #16a34a; }
.cli-info-box.warn[b-n2n7xa74ax] { border-left: 4px solid #dc2626; }
.badge-dgii[b-n2n7xa74ax] { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.35rem 0.65rem; border-radius: 1rem; background: linear-gradient(135deg, #1d4ed8, #2563eb); color: white; font-size: 0.74rem; font-weight: 700; box-shadow: 0 2px 8px rgba(37,99,235,0.3); }
.badge-dgii i[b-n2n7xa74ax] { font-size: 0.95rem; }
.badge-count[b-n2n7xa74ax] { display: inline-block; margin-left: 0.5rem; padding: 0.15rem 0.55rem; background: rgba(37,99,235,0.15); color: var(--rg-accent, #2563eb); border-radius: 1rem; font-size: 0.72rem; font-weight: 700; }
[data-mode="dark"] .badge-count[b-n2n7xa74ax] { background: rgba(37,99,235,0.25); color: #93c5fd; }
.spin[b-n2n7xa74ax] { animation: spin-b-n2n7xa74ax 1s linear infinite; display: inline-block; }
@keyframes spin-b-n2n7xa74ax { to { transform: rotate(360deg); } }

/* ── Sección de evidencia (documentos de identidad) ───────────────── */
.evid-section[b-n2n7xa74ax] { background: var(--rg-bg-subtle); border: 1px dashed var(--rg-border); border-radius: 0.5rem; padding: 0.85rem 1rem; margin: 0.5rem 0 1rem; }
.evid-file-input[b-n2n7xa74ax] { position: absolute; left: -9999px; opacity: 0; }
.evid-list[b-n2n7xa74ax] { display: flex; flex-direction: column; gap: 0.45rem; margin-top: 0.75rem; }
.evid-item[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.65rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; }
.evid-item > i[b-n2n7xa74ax] { font-size: 1.3rem; color: var(--rg-accent, #2563eb); flex-shrink: 0; }
.evid-info[b-n2n7xa74ax] { flex: 1; min-width: 0; }
.evid-name[b-n2n7xa74ax] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evid-meta[b-n2n7xa74ax] { font-size: 0.74rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; }
.evid-sep[b-n2n7xa74ax] { color: var(--rg-text-muted); }
.btn-icon[b-n2n7xa74ax] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); }
.btn-icon:hover[b-n2n7xa74ax] { background: var(--rg-bg-hover); }
.btn-delete:hover[b-n2n7xa74ax] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger); }

/* Resumen OCR */
.ocr-resumen[b-n2n7xa74ax] { display: flex; align-items: center; gap: 0.5rem; padding: 0.65rem 0.85rem; border-radius: 0.4rem; margin-top: 0.75rem; font-size: 0.85rem; }
.ocr-resumen.ok[b-n2n7xa74ax]   { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.ocr-resumen.warn[b-n2n7xa74ax] { background: rgba(217,119,6,0.12); color: #b45309; border: 1px solid rgba(217,119,6,0.3); }
[data-mode="dark"] .ocr-resumen.ok[b-n2n7xa74ax]   { color: #86efac; }
[data-mode="dark"] .ocr-resumen.warn[b-n2n7xa74ax] { color: #fcd34d; }
.ocr-resumen i[b-n2n7xa74ax] { font-size: 1.1rem; flex-shrink: 0; }

/* Documentos de identidad — versión compacta */
.evid-compact[b-n2n7xa74ax] {
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    border-radius: 0.5rem;
    padding: 0.6rem 0.85rem;
    margin: 0.5rem 0 0.75rem 0;
}

.evid-compact-head[b-n2n7xa74ax] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.evid-compact-title[b-n2n7xa74ax] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.evid-compact-title i[b-n2n7xa74ax] {
    color: var(--rg-accent);
}

.evid-compact-badge[b-n2n7xa74ax] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.3rem;
    height: 1.3rem;
    padding: 0 0.4rem;
    background: var(--rg-accent);
    color: #ffffff;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    margin-left: 0.2rem;
}

.evid-compact-hint[b-n2n7xa74ax] {
    flex: 1;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    cursor: help;
    min-width: 0;
}

.evid-compact-hint i[b-n2n7xa74ax] {
    font-size: 0.85rem;
    color: var(--rg-accent);
}

.evid-compact .btn-crud.btn-sm[b-n2n7xa74ax] {
    padding: 0.3rem 0.65rem;
    font-size: 0.78rem;
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_AuditoriaImp015.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-1lgpj0xz4j] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1lgpj0xz4j 0.3s ease-out; }
@keyframes slideUp-b-1lgpj0xz4j { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1lgpj0xz4j] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1lgpj0xz4j] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1lgpj0xz4j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1lgpj0xz4j] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1lgpj0xz4j] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1lgpj0xz4j] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1lgpj0xz4j] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1lgpj0xz4j] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1lgpj0xz4j] { filter: brightness(1.1); }
.btn-outline[b-1lgpj0xz4j] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1lgpj0xz4j] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1lgpj0xz4j] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1lgpj0xz4j] { filter: brightness(1.1); }
.btn-icon[b-1lgpj0xz4j] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1lgpj0xz4j] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1lgpj0xz4j] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1lgpj0xz4j] { color: #ef4444; }
.btn-delete:hover[b-1lgpj0xz4j] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-1lgpj0xz4j] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-1lgpj0xz4j] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-1lgpj0xz4j] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1lgpj0xz4j] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1lgpj0xz4j] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1lgpj0xz4j] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1lgpj0xz4j] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1lgpj0xz4j] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-1lgpj0xz4j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-1lgpj0xz4j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1lgpj0xz4j] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-1lgpj0xz4j] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-1lgpj0xz4j] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1lgpj0xz4j] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1lgpj0xz4j] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1lgpj0xz4j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1lgpj0xz4j] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1lgpj0xz4j] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1lgpj0xz4j] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-1lgpj0xz4j] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-1lgpj0xz4j] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-1lgpj0xz4j] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1lgpj0xz4j] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1lgpj0xz4j] { background: #f1f5f9; color: #64748b; }
.badge-info[b-1lgpj0xz4j] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-1lgpj0xz4j] { background: #fffbeb; color: #92400e; }
.badge-danger[b-1lgpj0xz4j] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-1lgpj0xz4j] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-1lgpj0xz4j] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-1lgpj0xz4j] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-1lgpj0xz4j] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-1lgpj0xz4j] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-1lgpj0xz4j] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-1lgpj0xz4j] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-1lgpj0xz4j] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1lgpj0xz4j] { text-align: center; }
.text-muted[b-1lgpj0xz4j] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1lgpj0xz4j], .crud-empty-state[b-1lgpj0xz4j] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1lgpj0xz4j] { font-size: 2rem; }
.crud-spinner[b-1lgpj0xz4j] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1lgpj0xz4j 0.6s linear infinite; }
.crud-spinner-sm[b-1lgpj0xz4j] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1lgpj0xz4j 0.6s linear infinite; }
@keyframes spin-b-1lgpj0xz4j { to { transform: rotate(360deg); } }
.spin[b-1lgpj0xz4j] { animation: spin-b-1lgpj0xz4j 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-1lgpj0xz4j] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1lgpj0xz4j 0.15s ease-out; }
.modal-container[b-1lgpj0xz4j] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1lgpj0xz4j] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1lgpj0xz4j 0.2s ease-out; }
.modal-lg[b-1lgpj0xz4j] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-1lgpj0xz4j] { max-width: 420px; }
@keyframes fadeIn-b-1lgpj0xz4j { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1lgpj0xz4j { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1lgpj0xz4j] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1lgpj0xz4j] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-1lgpj0xz4j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1lgpj0xz4j] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1lgpj0xz4j] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1lgpj0xz4j] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1lgpj0xz4j] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-1lgpj0xz4j] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1lgpj0xz4j] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1lgpj0xz4j] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1lgpj0xz4j] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1lgpj0xz4j] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1lgpj0xz4j] { flex: 2; }
.form-group label[b-1lgpj0xz4j] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1lgpj0xz4j], .form-group select[b-1lgpj0xz4j], .form-textarea[b-1lgpj0xz4j] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1lgpj0xz4j], .form-group select:focus[b-1lgpj0xz4j], .form-textarea:focus[b-1lgpj0xz4j] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1lgpj0xz4j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1lgpj0xz4j] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1lgpj0xz4j] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1lgpj0xz4j] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-1lgpj0xz4j] { margin-top: 0; }
.form-section-title i[b-1lgpj0xz4j] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-1lgpj0xz4j] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-1lgpj0xz4j] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-1lgpj0xz4j] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-1lgpj0xz4j] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-1lgpj0xz4j] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-1lgpj0xz4j] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-1lgpj0xz4j] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-1lgpj0xz4j] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1lgpj0xz4j] { padding: 0.75rem; }
    .crud-header[b-1lgpj0xz4j] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1lgpj0xz4j] { font-size: 1.1rem; }
    .btn-text[b-1lgpj0xz4j] { display: none; }
    .form-row[b-1lgpj0xz4j] { flex-direction: column; }
    .form-row-3[b-1lgpj0xz4j] { grid-template-columns: 1fr; }
    .form-row-4[b-1lgpj0xz4j] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1lgpj0xz4j] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1lgpj0xz4j] { max-width: 98vw; width: 98vw; }
    .modal-body[b-1lgpj0xz4j] { padding: 0.75rem; }
    .modal-tabs[b-1lgpj0xz4j] { overflow-x: auto; }
    .modal-tab[b-1lgpj0xz4j] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1lgpj0xz4j] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1lgpj0xz4j] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1lgpj0xz4j] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1lgpj0xz4j] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-1lgpj0xz4j] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-1lgpj0xz4j] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-1lgpj0xz4j] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-1lgpj0xz4j] { border-bottom: none; }
.help-section p[b-1lgpj0xz4j] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-1lgpj0xz4j], .help-section ol[b-1lgpj0xz4j] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-1lgpj0xz4j] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-1lgpj0xz4j] { color: var(--rg-accent,#2563eb); }
.help-tip[b-1lgpj0xz4j] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-1lgpj0xz4j] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-1lgpj0xz4j] { background: rgba(37,99,235,0.12); }
.help-table[b-1lgpj0xz4j] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-1lgpj0xz4j] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-1lgpj0xz4j] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-1lgpj0xz4j] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1lgpj0xz4j] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1lgpj0xz4j] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-1lgpj0xz4j] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-1lgpj0xz4j] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-1lgpj0xz4j] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-1lgpj0xz4j] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-1lgpj0xz4j] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-1lgpj0xz4j] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-1lgpj0xz4j] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-1lgpj0xz4j] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-1lgpj0xz4j] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-1lgpj0xz4j] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-1lgpj0xz4j] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-1lgpj0xz4j] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-1lgpj0xz4j] { font-size: 1.6rem; }
.pos-op-btn > div[b-1lgpj0xz4j] { display: flex; flex-direction: column; }
.pos-op-title[b-1lgpj0xz4j] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-1lgpj0xz4j] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-1lgpj0xz4j] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-1lgpj0xz4j] { color: var(--rg-success); }
.pos-op-ret[b-1lgpj0xz4j] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-1lgpj0xz4j] { color: var(--rg-danger); }

.pos-cuenta-search[b-1lgpj0xz4j] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-1lgpj0xz4j] { flex: 1; }

.pos-cuenta-card[b-1lgpj0xz4j] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-1lgpj0xz4j] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-1lgpj0xz4j] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-1lgpj0xz4j] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-1lgpj0xz4j] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-1lgpj0xz4j], .pos-res-saldos > div[b-1lgpj0xz4j] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-1lgpj0xz4j] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-1lgpj0xz4j] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-1lgpj0xz4j] { color: var(--rg-success); }
.pos-cuenta-aviso[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-1lgpj0xz4j] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-1lgpj0xz4j] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-1lgpj0xz4j] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-1lgpj0xz4j] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-1lgpj0xz4j]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-1lgpj0xz4j] { z-index: 2001 !important; }

.badge-warn[b-1lgpj0xz4j] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1lgpj0xz4j] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-1lgpj0xz4j] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-1lgpj0xz4j] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-1lgpj0xz4j] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-1lgpj0xz4j] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-1lgpj0xz4j] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-1lgpj0xz4j] { margin-bottom: 0; }
.dv-periodo input[b-1lgpj0xz4j], .dv-periodo select[b-1lgpj0xz4j] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-1lgpj0xz4j] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-1lgpj0xz4j] { text-align: right; }
.badge-warn[b-1lgpj0xz4j] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1lgpj0xz4j] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-1lgpj0xz4j] { flex-direction: column; align-items: stretch; } .dv-periodo[b-1lgpj0xz4j], .dv-acciones[b-1lgpj0xz4j] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-1lgpj0xz4j] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-1lgpj0xz4j] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-1lgpj0xz4j] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1lgpj0xz4j] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1lgpj0xz4j] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-1lgpj0xz4j] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-1lgpj0xz4j] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-1lgpj0xz4j] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-1lgpj0xz4j] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-1lgpj0xz4j] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-1lgpj0xz4j] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-1lgpj0xz4j] { border-bottom: none; }
.config-toggle-label[b-1lgpj0xz4j] { flex: 1; }
.config-toggle-name[b-1lgpj0xz4j] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-1lgpj0xz4j] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-1lgpj0xz4j] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-1lgpj0xz4j] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1lgpj0xz4j] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-1lgpj0xz4j] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1lgpj0xz4j], .form-group select[b-1lgpj0xz4j] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_AuditoriaInteres.razor.rz.scp.css */
/* ── Contenedor principal ────────────────────────────────────── */
.crud-container[b-m5miguvnia] {
    padding: 1.25rem 1.5rem;
    animation: slideUp-b-m5miguvnia 0.25s ease;
}

@keyframes slideUp-b-m5miguvnia {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ──────────────────────────────────────────────────── */
.crud-header[b-m5miguvnia] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.crud-header-left[b-m5miguvnia] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.crud-header-icon[b-m5miguvnia] {
    font-size: 1.6rem;
    color: var(--rg-primary);
}

.crud-title[b-m5miguvnia] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0;
}

.crud-subtitle[b-m5miguvnia] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
}

.crud-header-actions[b-m5miguvnia] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

/* ── Botones estándar ─────────────────────────────────────────── */
.btn-crud[b-m5miguvnia] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s;
    white-space: nowrap;
}

.btn-crud:disabled[b-m5miguvnia] { opacity: 0.55; cursor: not-allowed; }

.btn-primary[b-m5miguvnia] {
    background: var(--rg-primary);
    color: #fff;
    border-color: var(--rg-primary);
}
.btn-primary:hover:not(:disabled)[b-m5miguvnia] { filter: brightness(1.12); }

.btn-outline[b-m5miguvnia] {
    background: transparent;
    color: var(--rg-text-primary);
    border-color: var(--rg-border);
}
.btn-outline:hover:not(:disabled)[b-m5miguvnia] { background: var(--rg-bg-hover); }

.btn-help[b-m5miguvnia] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37,99,235,0.25);
    padding: 0.45rem 0.65rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
}
.btn-help:hover[b-m5miguvnia] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-m5miguvnia] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-m5miguvnia] { background: rgba(37,99,235,0.25); }

/* ── Alerta flash ─────────────────────────────────────────────── */
.crud-alert[b-m5miguvnia] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}
.crud-alert.success[b-m5miguvnia] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-m5miguvnia]   { background: rgba(220,38,38,0.1);  color: #991b1b; border: 1px solid rgba(220,38,38,0.25); }
[data-mode="dark"] .crud-alert.success[b-m5miguvnia] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-m5miguvnia]   { color: #fca5a5; }
.crud-alert-close[b-m5miguvnia] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.7; }
.crud-alert-close:hover[b-m5miguvnia] { opacity: 1; }

/* ── Filtros ─────────────────────────────────────────────────── */
.ai-filtros[b-m5miguvnia] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 0.85rem 1rem;
    margin-bottom: 1rem;
}

.ai-filtro-group[b-m5miguvnia] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ai-filtro-label[b-m5miguvnia] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.ai-filtro-input[b-m5miguvnia],
.ai-filtro-select[b-m5miguvnia] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    min-width: 100px;
}
.ai-filtro-input:focus[b-m5miguvnia],
.ai-filtro-select:focus[b-m5miguvnia] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(26,58,92,0.12);
}

.ai-search-inline[b-m5miguvnia] {
    display: flex;
    align-items: center;
    gap: 0;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    overflow: hidden;
    background: var(--rg-bg-input);
}
.ai-search-inline .crud-search-btn[b-m5miguvnia] {
    border: none;
    background: transparent;
    color: var(--rg-text-muted);
    padding: 0.4rem 0.55rem;
    cursor: pointer;
    font-size: 0.85rem;
}
.ai-search-inline .crud-search-btn:hover[b-m5miguvnia] { color: var(--rg-primary); }
.ai-search-inline .ai-filtro-input[b-m5miguvnia] {
    border: none;
    background: transparent;
    border-radius: 0;
    min-width: 180px;
}
.ai-search-inline .ai-filtro-input:focus[b-m5miguvnia] { box-shadow: none; }

.ai-clear-btn[b-m5miguvnia] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    padding: 0.4rem 0.4rem;
    font-size: 0.8rem;
}
.ai-clear-btn:hover[b-m5miguvnia] { color: var(--rg-danger); }

.ai-btn-buscar[b-m5miguvnia] { align-self: flex-end; }

/* ── Totales ─────────────────────────────────────────────────── */
.ai-totales[b-m5miguvnia] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.ai-total-card[b-m5miguvnia] {
    flex: 1;
    min-width: 140px;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.65rem;
    padding: 0.65rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ai-total-label[b-m5miguvnia] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.ai-total-value[b-m5miguvnia] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
}

.ai-total-ok[b-m5miguvnia]     { border-left: 3px solid var(--rg-success); }
.ai-total-ok .ai-total-value[b-m5miguvnia]   { color: var(--rg-success); }
.ai-total-warn[b-m5miguvnia]   { border-left: 3px solid var(--rg-warning); }
.ai-total-warn .ai-total-value[b-m5miguvnia] { color: var(--rg-warning); }
.ai-total-count[b-m5miguvnia]  { border-left: 3px solid var(--rg-primary); }
.ai-total-count .ai-total-value[b-m5miguvnia] { color: var(--rg-primary); }

/* ── Grid ────────────────────────────────────────────────────── */
.crud-grid-wrapper[b-m5miguvnia] {
    overflow-x: auto;
    border-radius: 0.75rem;
    border: 1px solid var(--rg-border);
    max-height: calc(100vh - 360px);
    overflow-y: auto;
}

.crud-table[b-m5miguvnia] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
}

.crud-table thead[b-m5miguvnia] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.crud-table th[b-m5miguvnia] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.55rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
}

.crud-table td[b-m5miguvnia] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}

.crud-table tbody tr:hover[b-m5miguvnia] { background: var(--rg-bg-hover); }
.crud-table tbody tr:last-child td[b-m5miguvnia] { border-bottom: none; }

.text-right[b-m5miguvnia]  { text-align: right !important; }
.text-center[b-m5miguvnia] { text-align: center !important; }
.font-mono[b-m5miguvnia]   { font-family: 'Courier New', Courier, monospace; font-size: 0.82rem; }

/* ── Columnas especiales ─────────────────────────────────────── */
.ai-isr[b-m5miguvnia]  { color: var(--rg-warning) !important; }
.ai-neto[b-m5miguvnia] { color: var(--rg-success) !important; font-weight: 600; }
.ai-fecha[b-m5miguvnia] { color: var(--rg-text-secondary); font-size: 0.78rem; white-space: nowrap; }

.ai-badge-moneda[b-m5miguvnia] {
    display: inline-block;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.72rem;
    font-weight: 700;
    background: rgba(26,58,92,0.1);
    color: var(--rg-primary);
    border: 1px solid rgba(26,58,92,0.2);
}
[data-mode="dark"] .ai-badge-moneda[b-m5miguvnia] { background: rgba(37,99,235,0.2); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

/* ── Badges ──────────────────────────────────────────────────── */
.badge[b-m5miguvnia] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.72rem;
    font-weight: 700;
}
.badge-yes[b-m5miguvnia] {
    background: rgba(34,197,94,0.12);
    color: #166534;
    border: 1px solid rgba(34,197,94,0.3);
}
.badge-pending[b-m5miguvnia] {
    background: rgba(217,119,6,0.12);
    color: #92400e;
    border: 1px solid rgba(217,119,6,0.3);
}
[data-mode="dark"] .badge-yes[b-m5miguvnia]     { color: #86efac; }
[data-mode="dark"] .badge-pending[b-m5miguvnia] { color: #fcd34d; }

/* ── Estados vacío / cargando ────────────────────────────────── */
.crud-loading[b-m5miguvnia] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted);
}

.crud-spinner[b-m5miguvnia] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: spin-b-m5miguvnia 0.8s linear infinite;
}

@keyframes spin-b-m5miguvnia { to { transform: rotate(360deg); } }

.crud-empty-state[b-m5miguvnia] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3.5rem 1rem;
    gap: 0.5rem;
    color: var(--rg-text-muted);
}

.crud-empty-state i[b-m5miguvnia]   { font-size: 2.5rem; opacity: 0.4; }
.crud-empty-state p[b-m5miguvnia]   { font-size: 0.95rem; font-weight: 600; margin: 0; }
.crud-empty-state span[b-m5miguvnia] { font-size: 0.82rem; }

.spin[b-m5miguvnia] { animation: spin-b-m5miguvnia 0.8s linear infinite; }

/* ── Modal ───────────────────────────────────────────────────── */
.modal-backdrop[b-m5miguvnia] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
}
.modal-container[b-m5miguvnia] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.modal-dialog[b-m5miguvnia] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 680px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.modal-header[b-m5miguvnia] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.modal-header h2[b-m5miguvnia] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-close[b-m5miguvnia] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-m5miguvnia] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-m5miguvnia] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-m5miguvnia] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Contenido del modal de ayuda ────────────────────────────── */
.help-icon-header[b-m5miguvnia]  { color: var(--rg-accent, #2563eb); margin-right: 0.25rem; }
.help-body[b-m5miguvnia]         { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-m5miguvnia]      { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-m5miguvnia] { border-bottom: none; }
.help-section p[b-m5miguvnia]    { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-m5miguvnia]   { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-m5miguvnia]   { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-m5miguvnia] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin-bottom: 0.65rem;
}
.help-section-title i[b-m5miguvnia] { color: var(--rg-accent, #2563eb); }
.help-tip[b-m5miguvnia] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    background: rgba(37,99,235,0.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.65rem 0.8rem;
    margin-top: 0.5rem;
    font-size: 0.82rem;
    color: var(--rg-text-secondary, #475569);
}
.help-tip i[b-m5miguvnia] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-m5miguvnia] { background: rgba(37,99,235,0.12); }
.help-table[b-m5miguvnia] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
    margin-top: 0.25rem;
}
.help-table th[b-m5miguvnia] {
    background: var(--rg-bg-subtle, #f8fafc);
    font-weight: 600;
    text-align: left;
    padding: 0.4rem 0.6rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    font-size: 0.72rem;
    text-transform: uppercase;
    color: var(--rg-text-muted, #94a3b8);
}
.help-table td[b-m5miguvnia] {
    padding: 0.4rem 0.6rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
    vertical-align: top;
}
[data-mode="dark"] .help-table th[b-m5miguvnia] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BalanceConsolidado.razor.rz.scp.css */
/* ── Contenedor principal ────────────────────────────────────── */
.crud-container[b-lxtkb9mb6h] {
    padding: 1.25rem 1.5rem;
    animation: slideUp-b-lxtkb9mb6h 0.25s ease;
}

@keyframes slideUp-b-lxtkb9mb6h {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ──────────────────────────────────────────────────── */
.crud-header[b-lxtkb9mb6h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.crud-header-left[b-lxtkb9mb6h] { display: flex; align-items: center; gap: 0.75rem; }

.crud-header-icon[b-lxtkb9mb6h] { font-size: 1.6rem; color: var(--rg-primary); }

.crud-title[b-lxtkb9mb6h] {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0;
}

.crud-subtitle[b-lxtkb9mb6h] { font-size: 0.78rem; color: var(--rg-text-muted); }

.crud-header-actions[b-lxtkb9mb6h] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* ── Botones ─────────────────────────────────────────────────── */
.btn-crud[b-lxtkb9mb6h] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s;
    white-space: nowrap;
}
.btn-crud:disabled[b-lxtkb9mb6h] { opacity: 0.55; cursor: not-allowed; }

.btn-primary[b-lxtkb9mb6h] { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }
.btn-primary:hover:not(:disabled)[b-lxtkb9mb6h] { filter: brightness(1.12); }

.btn-outline[b-lxtkb9mb6h] { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-lxtkb9mb6h] { background: var(--rg-bg-hover); }

.btn-help[b-lxtkb9mb6h] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37,99,235,0.25);
    padding: 0.45rem 0.65rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
}
.btn-help:hover[b-lxtkb9mb6h] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-lxtkb9mb6h] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-lxtkb9mb6h] { background: rgba(37,99,235,0.25); }

/* ── Alerta flash ─────────────────────────────────────────────── */
.crud-alert[b-lxtkb9mb6h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}
.crud-alert.success[b-lxtkb9mb6h] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-lxtkb9mb6h]   { background: rgba(220,38,38,0.1);  color: #991b1b; border: 1px solid rgba(220,38,38,0.25); }
[data-mode="dark"] .crud-alert.success[b-lxtkb9mb6h] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-lxtkb9mb6h]   { color: #fca5a5; }
.crud-alert-close[b-lxtkb9mb6h] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.7; }
.crud-alert-close:hover[b-lxtkb9mb6h] { opacity: 1; }

/* ── Fecha de corte ──────────────────────────────────────────── */
.bc-corte[b-lxtkb9mb6h] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.3rem 0.75rem;
    margin-bottom: 1rem;
}

/* ── Cards resumen ───────────────────────────────────────────── */
.bc-cards[b-lxtkb9mb6h] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.bc-card[b-lxtkb9mb6h] {
    flex: 1;
    min-width: 160px;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 1rem 1.1rem;
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.bc-card-icon[b-lxtkb9mb6h] { font-size: 1.5rem; opacity: 0.75; }

.bc-card-primary .bc-card-icon[b-lxtkb9mb6h] { color: var(--rg-primary); }
.bc-card-dop .bc-card-icon[b-lxtkb9mb6h]     { color: var(--rg-success); }
.bc-card-usd .bc-card-icon[b-lxtkb9mb6h]     { color: #2563eb; }

.bc-card-primary[b-lxtkb9mb6h] { border-left: 4px solid var(--rg-primary); }
.bc-card-dop[b-lxtkb9mb6h]     { border-left: 4px solid var(--rg-success); }
.bc-card-usd[b-lxtkb9mb6h]     { border-left: 4px solid #2563eb; }

.bc-card-body[b-lxtkb9mb6h] { display: flex; flex-direction: column; gap: 0.1rem; }

.bc-card-label[b-lxtkb9mb6h] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.bc-card-value[b-lxtkb9mb6h] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
}

.bc-card-sub[b-lxtkb9mb6h] { font-size: 0.75rem; color: var(--rg-text-secondary); }

/* ── Grupos por moneda ───────────────────────────────────────── */
.bc-grupo[b-lxtkb9mb6h] { margin-bottom: 1.5rem; }

.bc-grupo-header[b-lxtkb9mb6h] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.5rem;
}

.bc-moneda-badge[b-lxtkb9mb6h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 800;
    background: var(--rg-primary);
    color: #fff;
    letter-spacing: 0.02em;
}

.bc-grupo-title[b-lxtkb9mb6h] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}

.bc-grupo-count[b-lxtkb9mb6h] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 1rem;
    padding: 0.15rem 0.6rem;
    margin-left: auto;
}

/* ── Grid ────────────────────────────────────────────────────── */
.crud-grid-wrapper[b-lxtkb9mb6h] {
    overflow-x: auto;
    border-radius: 0.75rem;
    border: 1px solid var(--rg-border);
}

.crud-table[b-lxtkb9mb6h] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
}

.crud-table th[b-lxtkb9mb6h] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.55rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
}

.crud-table td[b-lxtkb9mb6h] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}

.crud-table tbody tr:hover[b-lxtkb9mb6h] { background: var(--rg-bg-hover); }
.crud-table tbody tr:last-child td[b-lxtkb9mb6h] { border-bottom: none; }

.text-right[b-lxtkb9mb6h]  { text-align: right !important; }
.text-center[b-lxtkb9mb6h] { text-align: center !important; }
.font-mono[b-lxtkb9mb6h]   { font-family: 'Courier New', Courier, monospace; font-size: 0.82rem; }

/* ── Pie totales ──────────────────────────────────────────────── */
.bc-subtotal td[b-lxtkb9mb6h] {
    background: var(--rg-bg-subtle);
    border-top: 2px solid var(--rg-border);
    border-bottom: none !important;
    font-size: 0.83rem;
}

/* ── Columnas especiales ─────────────────────────────────────── */
.bc-intereses[b-lxtkb9mb6h] { color: var(--rg-accent, #2563eb) !important; }
.bc-congelado[b-lxtkb9mb6h] { color: var(--rg-warning) !important; }
.bc-disponible[b-lxtkb9mb6h] { color: var(--rg-success) !important; font-weight: 600; }

.bc-num-ok[b-lxtkb9mb6h]    { color: var(--rg-success); font-weight: 600; }
.bc-num-warn[b-lxtkb9mb6h]  { color: var(--rg-warning); }
.bc-num-muted[b-lxtkb9mb6h] { color: var(--rg-text-muted); }

/* ── Producto en celda ───────────────────────────────────────── */
.bc-producto[b-lxtkb9mb6h] { display: flex; flex-direction: column; gap: 0.1rem; }
.bc-producto-codigo[b-lxtkb9mb6h] { font-size: 0.78rem; color: var(--rg-text-muted); }
.bc-producto-desc[b-lxtkb9mb6h]   { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary); }

/* ── Estados vacío / cargando ────────────────────────────────── */
.crud-loading[b-lxtkb9mb6h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted);
}

.crud-spinner[b-lxtkb9mb6h] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: spin-b-lxtkb9mb6h 0.8s linear infinite;
}

@keyframes spin-b-lxtkb9mb6h { to { transform: rotate(360deg); } }

.crud-empty-state[b-lxtkb9mb6h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3.5rem 1rem;
    gap: 0.5rem;
    color: var(--rg-text-muted);
}
.crud-empty-state i[b-lxtkb9mb6h]   { font-size: 2.5rem; opacity: 0.4; }
.crud-empty-state p[b-lxtkb9mb6h]   { font-size: 0.95rem; font-weight: 600; margin: 0; }
.crud-empty-state span[b-lxtkb9mb6h] { font-size: 0.82rem; }

.spin[b-lxtkb9mb6h] { animation: spin-b-lxtkb9mb6h 0.8s linear infinite; }

/* ── Modal ───────────────────────────────────────────────────── */
.modal-backdrop[b-lxtkb9mb6h] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
}
.modal-container[b-lxtkb9mb6h] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001; pointer-events: none;
}
.modal-dialog[b-lxtkb9mb6h] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%; max-width: 680px; max-height: 90vh;
    overflow: hidden; display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.modal-header[b-lxtkb9mb6h] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.modal-header h2[b-lxtkb9mb6h] {
    margin: 0; font-size: 1rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex; align-items: center; gap: 0.5rem;
}
.modal-close[b-lxtkb9mb6h] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem;
}
.modal-close:hover[b-lxtkb9mb6h] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-lxtkb9mb6h] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-lxtkb9mb6h] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Ayuda ───────────────────────────────────────────────────── */
.help-icon-header[b-lxtkb9mb6h]  { color: var(--rg-accent, #2563eb); margin-right: 0.25rem; }
.help-body[b-lxtkb9mb6h]         { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-lxtkb9mb6h]      { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-lxtkb9mb6h] { border-bottom: none; }
.help-section p[b-lxtkb9mb6h]    { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-lxtkb9mb6h]   { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-lxtkb9mb6h]   { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-lxtkb9mb6h] {
    display: flex; align-items: center; gap: 0.45rem;
    font-size: 0.88rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin-bottom: 0.65rem;
}
.help-section-title i[b-lxtkb9mb6h] { color: var(--rg-accent, #2563eb); }
.help-tip[b-lxtkb9mb6h] {
    display: flex; gap: 0.6rem; align-items: flex-start;
    background: rgba(37,99,235,0.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.65rem 0.8rem; margin-top: 0.5rem;
    font-size: 0.82rem; color: var(--rg-text-secondary, #475569);
}
.help-tip i[b-lxtkb9mb6h] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-lxtkb9mb6h] { background: rgba(37,99,235,0.12); }
.help-table[b-lxtkb9mb6h] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-lxtkb9mb6h] {
    background: var(--rg-bg-subtle, #f8fafc); font-weight: 600; text-align: left;
    padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border, #e2e8f0);
    font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted, #94a3b8);
}
.help-table td[b-lxtkb9mb6h] {
    padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569); vertical-align: top;
}
[data-mode="dark"] .help-table th[b-lxtkb9mb6h] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Bancos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-tk90fty8ia] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tk90fty8ia 0.3s ease-out; }
@keyframes slideUp-b-tk90fty8ia { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tk90fty8ia] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tk90fty8ia] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tk90fty8ia] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tk90fty8ia] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tk90fty8ia] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tk90fty8ia] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tk90fty8ia] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tk90fty8ia] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tk90fty8ia] { filter: brightness(1.1); }
.btn-outline[b-tk90fty8ia] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tk90fty8ia] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tk90fty8ia] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tk90fty8ia] { filter: brightness(1.1); }
.btn-icon[b-tk90fty8ia] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tk90fty8ia] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tk90fty8ia] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tk90fty8ia] { color: #ef4444; }
.btn-delete:hover[b-tk90fty8ia] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-tk90fty8ia] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-tk90fty8ia] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-tk90fty8ia] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tk90fty8ia] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tk90fty8ia] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tk90fty8ia] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tk90fty8ia] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tk90fty8ia] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-tk90fty8ia] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-tk90fty8ia] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tk90fty8ia] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-tk90fty8ia] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-tk90fty8ia] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tk90fty8ia] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tk90fty8ia] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tk90fty8ia] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tk90fty8ia] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tk90fty8ia] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tk90fty8ia] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-tk90fty8ia] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-tk90fty8ia] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-tk90fty8ia] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tk90fty8ia] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tk90fty8ia] { background: #f1f5f9; color: #64748b; }
.badge-info[b-tk90fty8ia] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-tk90fty8ia] { background: #fffbeb; color: #92400e; }
.badge-danger[b-tk90fty8ia] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-tk90fty8ia] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-tk90fty8ia] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-tk90fty8ia] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-tk90fty8ia] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-tk90fty8ia] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-tk90fty8ia] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-tk90fty8ia] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-tk90fty8ia] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tk90fty8ia] { text-align: center; }
.text-muted[b-tk90fty8ia] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tk90fty8ia], .crud-empty-state[b-tk90fty8ia] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tk90fty8ia] { font-size: 2rem; }
.crud-spinner[b-tk90fty8ia] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tk90fty8ia 0.6s linear infinite; }
.crud-spinner-sm[b-tk90fty8ia] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tk90fty8ia 0.6s linear infinite; }
@keyframes spin-b-tk90fty8ia { to { transform: rotate(360deg); } }
.spin[b-tk90fty8ia] { animation: spin-b-tk90fty8ia 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-tk90fty8ia] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tk90fty8ia 0.15s ease-out; }
.modal-container[b-tk90fty8ia] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tk90fty8ia] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tk90fty8ia 0.2s ease-out; }
.modal-lg[b-tk90fty8ia] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-tk90fty8ia] { max-width: 420px; }
@keyframes fadeIn-b-tk90fty8ia { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tk90fty8ia { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tk90fty8ia] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tk90fty8ia] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-tk90fty8ia] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tk90fty8ia] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tk90fty8ia] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tk90fty8ia] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tk90fty8ia] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-tk90fty8ia] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tk90fty8ia] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tk90fty8ia] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tk90fty8ia] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-tk90fty8ia] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tk90fty8ia] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tk90fty8ia] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tk90fty8ia] { flex: 2; }
.form-group label[b-tk90fty8ia] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tk90fty8ia], .form-group select[b-tk90fty8ia], .form-textarea[b-tk90fty8ia] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tk90fty8ia], .form-group select:focus[b-tk90fty8ia], .form-textarea:focus[b-tk90fty8ia] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tk90fty8ia] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tk90fty8ia] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tk90fty8ia] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tk90fty8ia] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-tk90fty8ia] { margin-top: 0; }
.form-section-title i[b-tk90fty8ia] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-tk90fty8ia] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-tk90fty8ia] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-tk90fty8ia] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-tk90fty8ia] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-tk90fty8ia] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-tk90fty8ia] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-tk90fty8ia] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-tk90fty8ia] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tk90fty8ia] { padding: 0.75rem; }
    .crud-header[b-tk90fty8ia] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tk90fty8ia] { font-size: 1.1rem; }
    .btn-text[b-tk90fty8ia] { display: none; }
    .form-row[b-tk90fty8ia] { flex-direction: column; }
    .form-row-3[b-tk90fty8ia] { grid-template-columns: 1fr; }
    .form-row-4[b-tk90fty8ia] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tk90fty8ia] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tk90fty8ia] { max-width: 98vw; width: 98vw; }
    .modal-body[b-tk90fty8ia] { padding: 0.75rem; }
    .modal-tabs[b-tk90fty8ia] { overflow-x: auto; }
    .modal-tab[b-tk90fty8ia] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-tk90fty8ia] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tk90fty8ia] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tk90fty8ia] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tk90fty8ia] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-tk90fty8ia] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-tk90fty8ia] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-tk90fty8ia] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-tk90fty8ia] { border-bottom: none; }
.help-section p[b-tk90fty8ia] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-tk90fty8ia], .help-section ol[b-tk90fty8ia] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-tk90fty8ia] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-tk90fty8ia] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-tk90fty8ia] { color: var(--rg-accent,#2563eb); }
.help-tip[b-tk90fty8ia] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-tk90fty8ia] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-tk90fty8ia] { background: rgba(37,99,235,0.12); }
.help-table[b-tk90fty8ia] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-tk90fty8ia] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-tk90fty8ia] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-tk90fty8ia] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BandejaCasos.razor.rz.scp.css */
/* ============================================================
   FrmAho_BandejaCasos — Estilos CRUD Bandeja de Casos
   ============================================================ */

.crud-container[b-6yg6efjezh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6yg6efjezh 0.3s ease-out; }
@keyframes slideUp-b-6yg6efjezh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6yg6efjezh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6yg6efjezh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6yg6efjezh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6yg6efjezh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6yg6efjezh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6yg6efjezh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6yg6efjezh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6yg6efjezh] { opacity: 0.6; cursor: not-allowed; }
.btn-sm[b-6yg6efjezh] { padding: 0.35rem 0.65rem; font-size: 0.75rem; }
.btn-primary[b-6yg6efjezh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6yg6efjezh] { filter: brightness(1.1); }
.btn-outline[b-6yg6efjezh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6yg6efjezh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6yg6efjezh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6yg6efjezh] { filter: brightness(1.1); }
.btn-icon[b-6yg6efjezh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6yg6efjezh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6yg6efjezh] { background: rgba(79, 70, 229, 0.1); }

/* Botón Ayuda */
.btn-help[b-6yg6efjezh] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-6yg6efjezh] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-6yg6efjezh] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-6yg6efjezh] { background: rgba(37,99,235,0.25); }

/* Alert */
.crud-alert[b-6yg6efjezh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6yg6efjezh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6yg6efjezh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
[data-mode="dark"] .crud-alert.success[b-6yg6efjezh] { background: rgba(6,95,70,0.15); color: #86efac; border-color: rgba(134,239,172,0.3); }
[data-mode="dark"] .crud-alert.error[b-6yg6efjezh] { background: rgba(153,27,27,0.15); color: #fca5a5; border-color: rgba(252,165,165,0.3); }
.crud-alert-close[b-6yg6efjezh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtro bar */
.casos-filter-bar[b-6yg6efjezh] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.casos-estado-filter[b-6yg6efjezh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; min-width: 150px; }
.casos-estado-filter:focus[b-6yg6efjezh] { border-color: var(--rg-accent, #4f46e5); }

/* Search */
.crud-search-bar[b-6yg6efjezh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-6yg6efjezh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: flex; align-items: center; padding: 0.1rem; }
.crud-search-btn:hover[b-6yg6efjezh] { color: var(--rg-accent, #4f46e5); }
.crud-search-bar input[b-6yg6efjezh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6yg6efjezh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6yg6efjezh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6yg6efjezh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 310px); }
.crud-table[b-6yg6efjezh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6yg6efjezh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6yg6efjezh] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6yg6efjezh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6yg6efjezh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6yg6efjezh] { width: 60px; text-align: center; white-space: nowrap; }

/* Avatar caso */
.caso-avatar[b-6yg6efjezh] { width: 32px; height: 32px; border-radius: 50%; background: rgba(79,70,229,0.1); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1rem; }

/* Paginación */
.casos-paginacion[b-6yg6efjezh] { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 0.5rem; font-size: 0.78rem; color: var(--rg-text-muted, #94a3b8); border-top: 1px solid var(--rg-border, #e2e8f0); }

/* Badges de estado */
.badge[b-6yg6efjezh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6yg6efjezh] { background: rgba(22,163,74,0.12); color: #166534; }
.badge-no[b-6yg6efjezh]  { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
/* Estado */
.badge-abr[b-6yg6efjezh] { background: rgba(37,99,235,0.12); color: #1d4ed8; border: 1px solid rgba(37,99,235,0.2); }
.badge-enp[b-6yg6efjezh] { background: rgba(217,119,6,0.12); color: #92400e; border: 1px solid rgba(217,119,6,0.2); }
.badge-cer[b-6yg6efjezh] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.2); }
.badge-anu[b-6yg6efjezh] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-abr[b-6yg6efjezh] { color: #93c5fd; }
[data-mode="dark"] .badge-enp[b-6yg6efjezh] { color: #fcd34d; }
[data-mode="dark"] .badge-cer[b-6yg6efjezh] { color: #86efac; }
/* Prioridad */
.badge-prio-alta[b-6yg6efjezh]   { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.2); }
.badge-prio-normal[b-6yg6efjezh] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); }
.badge-prio-baja[b-6yg6efjezh]   { background: rgba(100,116,139,0.1); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-prio-alta[b-6yg6efjezh] { color: #fca5a5; }

/* Utilities */
.font-mono[b-6yg6efjezh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6yg6efjezh] { text-align: center; }
.text-muted[b-6yg6efjezh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6yg6efjezh], .crud-empty-state[b-6yg6efjezh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6yg6efjezh] { font-size: 2rem; }
.crud-spinner[b-6yg6efjezh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6yg6efjezh 0.6s linear infinite; }
@keyframes spin-b-6yg6efjezh { to { transform: rotate(360deg); } }
.spin[b-6yg6efjezh] { animation: spin-b-6yg6efjezh 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-6yg6efjezh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6yg6efjezh 0.15s ease-out; }
.modal-container[b-6yg6efjezh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6yg6efjezh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6yg6efjezh 0.2s ease-out; }
.modal-caso[b-6yg6efjezh] { max-width: 720px; }
.modal-lg[b-6yg6efjezh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6yg6efjezh] { max-width: 420px; }
@keyframes fadeIn-b-6yg6efjezh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6yg6efjezh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-6yg6efjezh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6yg6efjezh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-6yg6efjezh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6yg6efjezh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6yg6efjezh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6yg6efjezh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Modales anidados */
.modal-backdrop-nested[b-6yg6efjezh]  { z-index: 2000 !important; }
.modal-container-nested[b-6yg6efjezh] { z-index: 2001 !important; }

/* Form */
.form-row[b-6yg6efjezh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6yg6efjezh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-6yg6efjezh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6yg6efjezh], .form-group select[b-6yg6efjezh], .form-textarea[b-6yg6efjezh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6yg6efjezh], .form-group select:focus[b-6yg6efjezh], .form-textarea:focus[b-6yg6efjezh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input:disabled[b-6yg6efjezh] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6yg6efjezh] { width: 100%; resize: vertical; font-family: inherit; }

/* Resolución */
.casos-resolucion-bar[b-6yg6efjezh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.5rem 0; border-top: 1px solid var(--rg-border, #e2e8f0); margin-top: 0.75rem; }
.casos-resolucion-box[b-6yg6efjezh] { background: rgba(22,163,74,0.06); border: 1px solid rgba(22,163,74,0.2); border-radius: 0.5rem; padding: 0.75rem; margin-top: 0.5rem; }
.casos-resolucion-label[b-6yg6efjezh] { font-size: 0.75rem; font-weight: 700; color: #166534; display: flex; align-items: center; gap: 0.35rem; margin-bottom: 0.35rem; }
.casos-resolucion-box p[b-6yg6efjezh] { font-size: 0.82rem; color: var(--rg-text-secondary, #475569); margin: 0 0 0.35rem; }
[data-mode="dark"] .casos-resolucion-box[b-6yg6efjezh] { background: rgba(22,163,74,0.1); border-color: rgba(22,163,74,0.25); }
[data-mode="dark"] .casos-resolucion-label[b-6yg6efjezh] { color: #86efac; }

/* Ayuda */
.help-icon-header[b-6yg6efjezh] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-6yg6efjezh] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-6yg6efjezh] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-6yg6efjezh] { border-bottom: none; }
.help-section p[b-6yg6efjezh] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-6yg6efjezh] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-6yg6efjezh] { color: var(--rg-accent,#2563eb); }
.help-tip[b-6yg6efjezh] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-6yg6efjezh] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-6yg6efjezh] { background: rgba(37,99,235,0.12); }
.help-table[b-6yg6efjezh] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-6yg6efjezh] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-6yg6efjezh] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: middle; }
[data-mode="dark"] .help-table th[b-6yg6efjezh] { background: rgba(255,255,255,0.04); }
.help-badge[b-6yg6efjezh] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-6yg6efjezh]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-6yg6efjezh]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-6yg6efjezh]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-6yg6efjezh] { background: rgba(220,38,38,0.12);  color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-6yg6efjezh]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-6yg6efjezh]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-6yg6efjezh]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-6yg6efjezh] { color: #fca5a5; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6yg6efjezh] { padding: 0.75rem; }
    .crud-header[b-6yg6efjezh] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-6yg6efjezh] { display: none; }
    .casos-filter-bar[b-6yg6efjezh] { flex-direction: column; align-items: stretch; }
    .form-row[b-6yg6efjezh] { flex-direction: column; }
    .modal-dialog[b-6yg6efjezh] { width: 98%; }
    .modal-lg[b-6yg6efjezh] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BandejaNotificaciones.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-pglfccg82z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pglfccg82z 0.3s ease-out; }
@keyframes slideUp-b-pglfccg82z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pglfccg82z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pglfccg82z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pglfccg82z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pglfccg82z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pglfccg82z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pglfccg82z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pglfccg82z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pglfccg82z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pglfccg82z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pglfccg82z] { filter: brightness(1.1); }
.btn-outline[b-pglfccg82z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pglfccg82z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pglfccg82z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pglfccg82z] { filter: brightness(1.1); }
.btn-icon[b-pglfccg82z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pglfccg82z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pglfccg82z] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pglfccg82z] { color: #ef4444; }
.btn-delete:hover[b-pglfccg82z] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-pglfccg82z] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-pglfccg82z] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-pglfccg82z] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pglfccg82z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pglfccg82z] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pglfccg82z] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pglfccg82z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pglfccg82z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pglfccg82z] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pglfccg82z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-pglfccg82z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-pglfccg82z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pglfccg82z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-pglfccg82z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-pglfccg82z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pglfccg82z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pglfccg82z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pglfccg82z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pglfccg82z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pglfccg82z] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pglfccg82z] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-pglfccg82z] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-pglfccg82z] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-pglfccg82z] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pglfccg82z] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pglfccg82z] { background: #f1f5f9; color: #64748b; }
.badge-info[b-pglfccg82z] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-pglfccg82z] { background: #fffbeb; color: #92400e; }
.badge-danger[b-pglfccg82z] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-pglfccg82z] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-pglfccg82z] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-pglfccg82z] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-pglfccg82z] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-pglfccg82z] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-pglfccg82z] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-pglfccg82z] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-pglfccg82z] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pglfccg82z] { text-align: center; }
.text-muted[b-pglfccg82z] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pglfccg82z], .crud-empty-state[b-pglfccg82z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pglfccg82z] { font-size: 2rem; }
.crud-spinner[b-pglfccg82z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pglfccg82z 0.6s linear infinite; }
.crud-spinner-sm[b-pglfccg82z] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pglfccg82z 0.6s linear infinite; }
@keyframes spin-b-pglfccg82z { to { transform: rotate(360deg); } }
.spin[b-pglfccg82z] { animation: spin-b-pglfccg82z 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-pglfccg82z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pglfccg82z 0.15s ease-out; }
.modal-container[b-pglfccg82z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pglfccg82z] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pglfccg82z 0.2s ease-out; }
.modal-lg[b-pglfccg82z] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-pglfccg82z] { max-width: 420px; }
@keyframes fadeIn-b-pglfccg82z { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pglfccg82z { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pglfccg82z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pglfccg82z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-pglfccg82z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pglfccg82z] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pglfccg82z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pglfccg82z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pglfccg82z] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-pglfccg82z] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pglfccg82z] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pglfccg82z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pglfccg82z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-pglfccg82z] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pglfccg82z] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pglfccg82z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pglfccg82z] { flex: 2; }
.form-group label[b-pglfccg82z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pglfccg82z], .form-group select[b-pglfccg82z], .form-textarea[b-pglfccg82z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pglfccg82z], .form-group select:focus[b-pglfccg82z], .form-textarea:focus[b-pglfccg82z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pglfccg82z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pglfccg82z] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pglfccg82z] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-pglfccg82z] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pglfccg82z] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-pglfccg82z] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-pglfccg82z] { margin-top: 0; }
.form-section-title i[b-pglfccg82z] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-pglfccg82z] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-pglfccg82z] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-pglfccg82z] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-pglfccg82z] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-pglfccg82z] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-pglfccg82z] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-pglfccg82z] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-pglfccg82z] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-pglfccg82z] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pglfccg82z] { padding: 0.75rem; }
    .crud-header[b-pglfccg82z] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pglfccg82z] { font-size: 1.1rem; }
    .btn-text[b-pglfccg82z] { display: none; }
    .form-row[b-pglfccg82z] { flex-direction: column; }
    .form-row-3[b-pglfccg82z] { grid-template-columns: 1fr; }
    .form-row-4[b-pglfccg82z] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pglfccg82z] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pglfccg82z] { max-width: 98vw; width: 98vw; }
    .modal-body[b-pglfccg82z] { padding: 0.75rem; }
    .modal-tabs[b-pglfccg82z] { overflow-x: auto; }
    .modal-tab[b-pglfccg82z] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-pglfccg82z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pglfccg82z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pglfccg82z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pglfccg82z] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-pglfccg82z] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-pglfccg82z] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-pglfccg82z] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-pglfccg82z] { border-bottom: none; }
.help-section p[b-pglfccg82z] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-pglfccg82z], .help-section ol[b-pglfccg82z] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-pglfccg82z] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-pglfccg82z] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-pglfccg82z] { color: var(--rg-accent,#2563eb); }
.help-tip[b-pglfccg82z] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-pglfccg82z] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-pglfccg82z] { background: rgba(37,99,235,0.12); }
.help-table[b-pglfccg82z] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-pglfccg82z] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-pglfccg82z] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-pglfccg82z] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-pglfccg82z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-pglfccg82z] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-pglfccg82z] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-pglfccg82z] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-pglfccg82z] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-pglfccg82z] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-pglfccg82z] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-pglfccg82z] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-pglfccg82z] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-pglfccg82z] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-pglfccg82z] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-pglfccg82z] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-pglfccg82z] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-pglfccg82z] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-pglfccg82z] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-pglfccg82z] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-pglfccg82z] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-pglfccg82z] { font-size: 1.6rem; }
.pos-op-btn > div[b-pglfccg82z] { display: flex; flex-direction: column; }
.pos-op-title[b-pglfccg82z] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-pglfccg82z] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-pglfccg82z] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-pglfccg82z] { color: var(--rg-success); }
.pos-op-ret[b-pglfccg82z] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-pglfccg82z] { color: var(--rg-danger); }

.pos-cuenta-search[b-pglfccg82z] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-pglfccg82z] { flex: 1; }

.pos-cuenta-card[b-pglfccg82z] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-pglfccg82z] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-pglfccg82z] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-pglfccg82z] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-pglfccg82z] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-pglfccg82z] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-pglfccg82z] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-pglfccg82z], .pos-res-saldos > div[b-pglfccg82z] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-pglfccg82z] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-pglfccg82z] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-pglfccg82z] { color: var(--rg-success); }
.pos-cuenta-aviso[b-pglfccg82z] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-pglfccg82z] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-pglfccg82z] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-pglfccg82z] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-pglfccg82z] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-pglfccg82z]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-pglfccg82z] { z-index: 2001 !important; }

.badge-warn[b-pglfccg82z] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-pglfccg82z] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-pglfccg82z] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-pglfccg82z] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-pglfccg82z] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-pglfccg82z] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-pglfccg82z] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-pglfccg82z] { margin-bottom: 0; }
.dv-periodo input[b-pglfccg82z], .dv-periodo select[b-pglfccg82z] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-pglfccg82z] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-pglfccg82z] { text-align: right; }
.badge-warn[b-pglfccg82z] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-pglfccg82z] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-pglfccg82z] { flex-direction: column; align-items: stretch; } .dv-periodo[b-pglfccg82z], .dv-acciones[b-pglfccg82z] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-pglfccg82z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-pglfccg82z] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-pglfccg82z] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-pglfccg82z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-pglfccg82z] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-pglfccg82z] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-pglfccg82z] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-pglfccg82z] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-pglfccg82z] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-pglfccg82z] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-pglfccg82z] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-pglfccg82z] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-pglfccg82z] { border-bottom: none; }
.config-toggle-label[b-pglfccg82z] { flex: 1; }
.config-toggle-name[b-pglfccg82z] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-pglfccg82z] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-pglfccg82z] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-pglfccg82z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pglfccg82z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-pglfccg82z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pglfccg82z], .form-group select[b-pglfccg82z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BandejaReversos.razor.rz.scp.css */
/* ============================================================
   FrmAho_BandejaReversos — Bandeja de Reversos de Ahorros
   ============================================================ */

.crud-container[b-ebgxfr7trw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ebgxfr7trw 0.3s ease-out; }
@keyframes slideUp-b-ebgxfr7trw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-ebgxfr7trw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ebgxfr7trw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ebgxfr7trw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ebgxfr7trw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ebgxfr7trw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ebgxfr7trw] { display: flex; gap: 0.5rem; }

.btn-crud[b-ebgxfr7trw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ebgxfr7trw] { opacity: 0.6; cursor: not-allowed; }
.btn-outline[b-ebgxfr7trw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ebgxfr7trw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ebgxfr7trw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ebgxfr7trw] { filter: brightness(1.1); }
.btn-success[b-ebgxfr7trw] { background: #10b981; color: #fff; }
.btn-success:hover:not(:disabled)[b-ebgxfr7trw] { filter: brightness(1.1); }

.crud-alert[b-ebgxfr7trw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ebgxfr7trw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ebgxfr7trw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ebgxfr7trw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-search-bar[b-ebgxfr7trw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); flex-wrap: wrap; }
.crud-search-bar i[b-ebgxfr7trw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ebgxfr7trw] { flex: 1; min-width: 150px; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-ebgxfr7trw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-ebgxfr7trw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ebgxfr7trw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-ebgxfr7trw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

.crud-grid-wrapper[b-ebgxfr7trw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ebgxfr7trw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ebgxfr7trw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ebgxfr7trw] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ebgxfr7trw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ebgxfr7trw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ebgxfr7trw] { width: 90px; text-align: center; white-space: nowrap; }

.btn-icon[b-ebgxfr7trw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-aprobar[b-ebgxfr7trw] { color: #10b981; }
.btn-aprobar:hover[b-ebgxfr7trw] { background: rgba(16,185,129,0.1); }
.btn-rechazar[b-ebgxfr7trw] { color: #ef4444; }
.btn-rechazar:hover[b-ebgxfr7trw] { background: rgba(239,68,68,0.1); }

.rev-motivo-cell[b-ebgxfr7trw] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: help; }

.badge[b-ebgxfr7trw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ebgxfr7trw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ebgxfr7trw] { background: #f1f5f9; color: #64748b; }
.badge-info[b-ebgxfr7trw] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-ebgxfr7trw] { background: #fffbeb; color: #92400e; }
.badge-danger[b-ebgxfr7trw] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-ebgxfr7trw] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-ebgxfr7trw] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-info[b-ebgxfr7trw] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-ebgxfr7trw] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-ebgxfr7trw] { background: rgba(220,38,38,0.18); color: #fca5a5; }

.font-mono[b-ebgxfr7trw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-ebgxfr7trw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

.crud-loading[b-ebgxfr7trw], .crud-empty-state[b-ebgxfr7trw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ebgxfr7trw] { font-size: 2rem; }
.crud-spinner[b-ebgxfr7trw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ebgxfr7trw 0.6s linear infinite; }
@keyframes spin-b-ebgxfr7trw { to { transform: rotate(360deg); } }
.spin[b-ebgxfr7trw] { animation: spin-b-ebgxfr7trw 0.8s linear infinite; }

.rev-motivo-input[b-ebgxfr7trw] { padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.85rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; resize: vertical; font-family: inherit; width: 100%; }
.rev-motivo-input:focus[b-ebgxfr7trw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.modal-backdrop[b-ebgxfr7trw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ebgxfr7trw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ebgxfr7trw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-ebgxfr7trw] { max-width: 880px; }
.modal-sm[b-ebgxfr7trw] { max-width: 420px; }
.modal-header[b-ebgxfr7trw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ebgxfr7trw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ebgxfr7trw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ebgxfr7trw] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-ebgxfr7trw] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-ebgxfr7trw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.btn-help[b-ebgxfr7trw] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-ebgxfr7trw] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-ebgxfr7trw] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

.help-icon-header[b-ebgxfr7trw] { color: var(--rg-accent, #2563eb); }
.help-body[b-ebgxfr7trw] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ebgxfr7trw] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-ebgxfr7trw] { border-bottom: none; }
.help-section p[b-ebgxfr7trw] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section-title[b-ebgxfr7trw] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ebgxfr7trw] { color: var(--rg-accent, #2563eb); }
.help-tip[b-ebgxfr7trw] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-ebgxfr7trw] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-ebgxfr7trw] { background: rgba(37,99,235,0.12); }
.help-table[b-ebgxfr7trw] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-ebgxfr7trw] { background: var(--rg-bg-subtle, #f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted, #94a3b8); }
.help-table td[b-ebgxfr7trw] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-secondary, #475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-ebgxfr7trw] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BandejaTransferencias.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-2mtj6rbom5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2mtj6rbom5 0.3s ease-out; }
@keyframes slideUp-b-2mtj6rbom5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2mtj6rbom5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2mtj6rbom5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2mtj6rbom5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2mtj6rbom5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2mtj6rbom5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2mtj6rbom5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2mtj6rbom5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2mtj6rbom5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2mtj6rbom5] { filter: brightness(1.1); }
.btn-outline[b-2mtj6rbom5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2mtj6rbom5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2mtj6rbom5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2mtj6rbom5] { filter: brightness(1.1); }
.btn-icon[b-2mtj6rbom5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2mtj6rbom5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2mtj6rbom5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2mtj6rbom5] { color: #ef4444; }
.btn-delete:hover[b-2mtj6rbom5] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-2mtj6rbom5] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-2mtj6rbom5] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-2mtj6rbom5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2mtj6rbom5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2mtj6rbom5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2mtj6rbom5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2mtj6rbom5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2mtj6rbom5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-2mtj6rbom5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-2mtj6rbom5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2mtj6rbom5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-2mtj6rbom5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-2mtj6rbom5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2mtj6rbom5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2mtj6rbom5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2mtj6rbom5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2mtj6rbom5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2mtj6rbom5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2mtj6rbom5] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-2mtj6rbom5] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-2mtj6rbom5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-2mtj6rbom5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2mtj6rbom5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2mtj6rbom5] { background: #f1f5f9; color: #64748b; }
.badge-info[b-2mtj6rbom5] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-2mtj6rbom5] { background: #fffbeb; color: #92400e; }
.badge-danger[b-2mtj6rbom5] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-2mtj6rbom5] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-2mtj6rbom5] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-2mtj6rbom5] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-2mtj6rbom5] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-2mtj6rbom5] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-2mtj6rbom5] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-2mtj6rbom5] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-2mtj6rbom5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2mtj6rbom5] { text-align: center; }
.text-muted[b-2mtj6rbom5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2mtj6rbom5], .crud-empty-state[b-2mtj6rbom5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2mtj6rbom5] { font-size: 2rem; }
.crud-spinner[b-2mtj6rbom5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2mtj6rbom5 0.6s linear infinite; }
.crud-spinner-sm[b-2mtj6rbom5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2mtj6rbom5 0.6s linear infinite; }
@keyframes spin-b-2mtj6rbom5 { to { transform: rotate(360deg); } }
.spin[b-2mtj6rbom5] { animation: spin-b-2mtj6rbom5 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-2mtj6rbom5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2mtj6rbom5 0.15s ease-out; }
.modal-container[b-2mtj6rbom5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2mtj6rbom5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2mtj6rbom5 0.2s ease-out; }
.modal-lg[b-2mtj6rbom5] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-2mtj6rbom5] { max-width: 420px; }
@keyframes fadeIn-b-2mtj6rbom5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2mtj6rbom5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2mtj6rbom5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2mtj6rbom5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-2mtj6rbom5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2mtj6rbom5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2mtj6rbom5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2mtj6rbom5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2mtj6rbom5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-2mtj6rbom5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2mtj6rbom5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2mtj6rbom5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2mtj6rbom5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-2mtj6rbom5] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2mtj6rbom5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2mtj6rbom5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2mtj6rbom5] { flex: 2; }
.form-group label[b-2mtj6rbom5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2mtj6rbom5], .form-group select[b-2mtj6rbom5], .form-textarea[b-2mtj6rbom5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2mtj6rbom5], .form-group select:focus[b-2mtj6rbom5], .form-textarea:focus[b-2mtj6rbom5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2mtj6rbom5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2mtj6rbom5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2mtj6rbom5] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2mtj6rbom5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-2mtj6rbom5] { margin-top: 0; }
.form-section-title i[b-2mtj6rbom5] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-2mtj6rbom5] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-2mtj6rbom5] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-2mtj6rbom5] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-2mtj6rbom5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-2mtj6rbom5] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-2mtj6rbom5] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-2mtj6rbom5] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-2mtj6rbom5] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2mtj6rbom5] { padding: 0.75rem; }
    .crud-header[b-2mtj6rbom5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2mtj6rbom5] { font-size: 1.1rem; }
    .btn-text[b-2mtj6rbom5] { display: none; }
    .form-row[b-2mtj6rbom5] { flex-direction: column; }
    .form-row-3[b-2mtj6rbom5] { grid-template-columns: 1fr; }
    .form-row-4[b-2mtj6rbom5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2mtj6rbom5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2mtj6rbom5] { max-width: 98vw; width: 98vw; }
    .modal-body[b-2mtj6rbom5] { padding: 0.75rem; }
    .modal-tabs[b-2mtj6rbom5] { overflow-x: auto; }
    .modal-tab[b-2mtj6rbom5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-2mtj6rbom5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2mtj6rbom5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2mtj6rbom5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2mtj6rbom5] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-2mtj6rbom5] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-2mtj6rbom5] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-2mtj6rbom5] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-2mtj6rbom5] { border-bottom: none; }
.help-section p[b-2mtj6rbom5] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-2mtj6rbom5], .help-section ol[b-2mtj6rbom5] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-2mtj6rbom5] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-2mtj6rbom5] { color: var(--rg-accent,#2563eb); }
.help-tip[b-2mtj6rbom5] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-2mtj6rbom5] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-2mtj6rbom5] { background: rgba(37,99,235,0.12); }
.help-table[b-2mtj6rbom5] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-2mtj6rbom5] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-2mtj6rbom5] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-2mtj6rbom5] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-2mtj6rbom5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-2mtj6rbom5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-2mtj6rbom5] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-2mtj6rbom5] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-2mtj6rbom5] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-2mtj6rbom5] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-2mtj6rbom5] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-2mtj6rbom5] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-2mtj6rbom5] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-2mtj6rbom5] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-2mtj6rbom5] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-2mtj6rbom5] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-2mtj6rbom5] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-2mtj6rbom5] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-2mtj6rbom5] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-2mtj6rbom5] { font-size: 1.6rem; }
.pos-op-btn > div[b-2mtj6rbom5] { display: flex; flex-direction: column; }
.pos-op-title[b-2mtj6rbom5] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-2mtj6rbom5] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-2mtj6rbom5] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-2mtj6rbom5] { color: var(--rg-success); }
.pos-op-ret[b-2mtj6rbom5] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-2mtj6rbom5] { color: var(--rg-danger); }

.pos-cuenta-search[b-2mtj6rbom5] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-2mtj6rbom5] { flex: 1; }

.pos-cuenta-card[b-2mtj6rbom5] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-2mtj6rbom5] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-2mtj6rbom5] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-2mtj6rbom5] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-2mtj6rbom5] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-2mtj6rbom5] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-2mtj6rbom5], .pos-res-saldos > div[b-2mtj6rbom5] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-2mtj6rbom5] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-2mtj6rbom5] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-2mtj6rbom5] { color: var(--rg-success); }
.pos-cuenta-aviso[b-2mtj6rbom5] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-2mtj6rbom5] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-2mtj6rbom5] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-2mtj6rbom5] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-2mtj6rbom5] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-2mtj6rbom5]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-2mtj6rbom5] { z-index: 2001 !important; }

.badge-warn[b-2mtj6rbom5] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-2mtj6rbom5] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-2mtj6rbom5] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-2mtj6rbom5] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-2mtj6rbom5] { grid-template-columns: 1fr; }
}

/* ── Bandeja de transferencias ─────────────────────────────────────────── */
.bt-filtros[b-2mtj6rbom5] { display: flex; gap: 0.6rem; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; }
.bt-filtros select[b-2mtj6rbom5] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 160px; }
.bt-search[b-2mtj6rbom5] { flex: 1; min-width: 240px; margin-bottom: 0; }
.bt-meta[b-2mtj6rbom5] { display: block; font-size: 0.75rem; color: var(--rg-text-muted); font-family: 'Cascadia Code','Fira Code',monospace; }
.bt-count[b-2mtj6rbom5] { text-align: right; font-size: 0.8rem; color: var(--rg-text-muted); margin-top: 0.5rem; }
.bt-tipo[b-2mtj6rbom5] { display: inline-block; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.bt-tipo-int[b-2mtj6rbom5] { background: rgba(37,99,235,0.12); color: var(--rg-accent); }
.bt-tipo-ext[b-2mtj6rbom5] { background: rgba(217,119,6,0.12); color: #92400e; }
.bt-tipo-pro[b-2mtj6rbom5] { background: rgba(139,92,246,0.12); color: #6d28d9; }
[data-mode="dark"] .bt-tipo-ext[b-2mtj6rbom5] { color: #fcd34d; }
[data-mode="dark"] .bt-tipo-pro[b-2mtj6rbom5] { color: #c4b5fd; }
.badge-warn[b-2mtj6rbom5] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-2mtj6rbom5] { color: #fcd34d; }
.text-right[b-2mtj6rbom5] { text-align: right; }

@media (max-width: 720px) { .bt-filtros[b-2mtj6rbom5] { flex-direction: column; align-items: stretch; } .bt-filtros select[b-2mtj6rbom5], .bt-search[b-2mtj6rbom5] { width: 100%; } }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_BandejaUAF.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-my5bjnv61u] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-my5bjnv61u 0.3s ease-out; }
@keyframes slideUp-b-my5bjnv61u { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-my5bjnv61u] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-my5bjnv61u] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-my5bjnv61u] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-my5bjnv61u] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-my5bjnv61u] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-my5bjnv61u] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-my5bjnv61u] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-my5bjnv61u] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-my5bjnv61u] { filter: brightness(1.1); }
.btn-outline[b-my5bjnv61u] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-my5bjnv61u] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-my5bjnv61u] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-my5bjnv61u] { filter: brightness(1.1); }
.btn-icon[b-my5bjnv61u] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-my5bjnv61u] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-my5bjnv61u] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-my5bjnv61u] { color: #ef4444; }
.btn-delete:hover[b-my5bjnv61u] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-my5bjnv61u] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-my5bjnv61u] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-my5bjnv61u] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-my5bjnv61u] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-my5bjnv61u] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-my5bjnv61u] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-my5bjnv61u] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-my5bjnv61u] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-my5bjnv61u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-my5bjnv61u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-my5bjnv61u] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-my5bjnv61u] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-my5bjnv61u] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-my5bjnv61u] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-my5bjnv61u] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-my5bjnv61u] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-my5bjnv61u] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-my5bjnv61u] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-my5bjnv61u] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-my5bjnv61u] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-my5bjnv61u] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-my5bjnv61u] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-my5bjnv61u] { background: #ecfdf5; color: #065f46; }
.badge-no[b-my5bjnv61u] { background: #f1f5f9; color: #64748b; }
.badge-info[b-my5bjnv61u] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-my5bjnv61u] { background: #fffbeb; color: #92400e; }
.badge-danger[b-my5bjnv61u] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-my5bjnv61u] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-my5bjnv61u] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-my5bjnv61u] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-my5bjnv61u] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-my5bjnv61u] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-my5bjnv61u] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-my5bjnv61u] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-my5bjnv61u] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-my5bjnv61u] { text-align: center; }
.text-muted[b-my5bjnv61u] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-my5bjnv61u], .crud-empty-state[b-my5bjnv61u] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-my5bjnv61u] { font-size: 2rem; }
.crud-spinner[b-my5bjnv61u] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-my5bjnv61u 0.6s linear infinite; }
.crud-spinner-sm[b-my5bjnv61u] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-my5bjnv61u 0.6s linear infinite; }
@keyframes spin-b-my5bjnv61u { to { transform: rotate(360deg); } }
.spin[b-my5bjnv61u] { animation: spin-b-my5bjnv61u 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-my5bjnv61u] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-my5bjnv61u 0.15s ease-out; }
.modal-container[b-my5bjnv61u] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-my5bjnv61u] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-my5bjnv61u 0.2s ease-out; }
.modal-lg[b-my5bjnv61u] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-my5bjnv61u] { max-width: 420px; }
@keyframes fadeIn-b-my5bjnv61u { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-my5bjnv61u { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-my5bjnv61u] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-my5bjnv61u] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-my5bjnv61u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-my5bjnv61u] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-my5bjnv61u] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-my5bjnv61u] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-my5bjnv61u] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-my5bjnv61u] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-my5bjnv61u] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-my5bjnv61u] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-my5bjnv61u] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-my5bjnv61u] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-my5bjnv61u] { flex: 2; }
.form-group label[b-my5bjnv61u] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-my5bjnv61u], .form-group select[b-my5bjnv61u], .form-textarea[b-my5bjnv61u] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-my5bjnv61u], .form-group select:focus[b-my5bjnv61u], .form-textarea:focus[b-my5bjnv61u] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-my5bjnv61u] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-my5bjnv61u] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-my5bjnv61u] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-my5bjnv61u] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-my5bjnv61u] { margin-top: 0; }
.form-section-title i[b-my5bjnv61u] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-my5bjnv61u] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-my5bjnv61u] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-my5bjnv61u] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-my5bjnv61u] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-my5bjnv61u] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-my5bjnv61u] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-my5bjnv61u] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-my5bjnv61u] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-my5bjnv61u] { padding: 0.75rem; }
    .crud-header[b-my5bjnv61u] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-my5bjnv61u] { font-size: 1.1rem; }
    .btn-text[b-my5bjnv61u] { display: none; }
    .form-row[b-my5bjnv61u] { flex-direction: column; }
    .form-row-3[b-my5bjnv61u] { grid-template-columns: 1fr; }
    .form-row-4[b-my5bjnv61u] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-my5bjnv61u] { width: 98%; max-height: 95vh; }
    .modal-lg[b-my5bjnv61u] { max-width: 98vw; width: 98vw; }
    .modal-body[b-my5bjnv61u] { padding: 0.75rem; }
    .modal-tabs[b-my5bjnv61u] { overflow-x: auto; }
    .modal-tab[b-my5bjnv61u] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-my5bjnv61u] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-my5bjnv61u] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-my5bjnv61u] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-my5bjnv61u] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-my5bjnv61u] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-my5bjnv61u] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-my5bjnv61u] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-my5bjnv61u] { border-bottom: none; }
.help-section p[b-my5bjnv61u] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-my5bjnv61u], .help-section ol[b-my5bjnv61u] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-my5bjnv61u] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-my5bjnv61u] { color: var(--rg-accent,#2563eb); }
.help-tip[b-my5bjnv61u] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-my5bjnv61u] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-my5bjnv61u] { background: rgba(37,99,235,0.12); }
.help-table[b-my5bjnv61u] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-my5bjnv61u] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-my5bjnv61u] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-my5bjnv61u] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-my5bjnv61u] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-my5bjnv61u] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-my5bjnv61u] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-my5bjnv61u] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-my5bjnv61u] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-my5bjnv61u] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-my5bjnv61u] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-my5bjnv61u] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-my5bjnv61u] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-my5bjnv61u] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-my5bjnv61u] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-my5bjnv61u] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-my5bjnv61u] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-my5bjnv61u] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-my5bjnv61u] { font-size: 1.6rem; }
.pos-op-btn > div[b-my5bjnv61u] { display: flex; flex-direction: column; }
.pos-op-title[b-my5bjnv61u] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-my5bjnv61u] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-my5bjnv61u] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-my5bjnv61u] { color: var(--rg-success); }
.pos-op-ret[b-my5bjnv61u] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-my5bjnv61u] { color: var(--rg-danger); }

.pos-cuenta-search[b-my5bjnv61u] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-my5bjnv61u] { flex: 1; }

.pos-cuenta-card[b-my5bjnv61u] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-my5bjnv61u] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-my5bjnv61u] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-my5bjnv61u] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-my5bjnv61u] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-my5bjnv61u], .pos-res-saldos > div[b-my5bjnv61u] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-my5bjnv61u] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-my5bjnv61u] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-my5bjnv61u] { color: var(--rg-success); }
.pos-cuenta-aviso[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-my5bjnv61u] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-my5bjnv61u] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-my5bjnv61u] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-my5bjnv61u] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-my5bjnv61u]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-my5bjnv61u] { z-index: 2001 !important; }

.badge-warn[b-my5bjnv61u] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-my5bjnv61u] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-my5bjnv61u] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-my5bjnv61u] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-my5bjnv61u] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-my5bjnv61u] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-my5bjnv61u] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-my5bjnv61u] { margin-bottom: 0; }
.dv-periodo input[b-my5bjnv61u], .dv-periodo select[b-my5bjnv61u] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-my5bjnv61u] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-my5bjnv61u] { text-align: right; }
.badge-warn[b-my5bjnv61u] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-my5bjnv61u] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-my5bjnv61u] { flex-direction: column; align-items: stretch; } .dv-periodo[b-my5bjnv61u], .dv-acciones[b-my5bjnv61u] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-my5bjnv61u] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-my5bjnv61u] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-my5bjnv61u] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-my5bjnv61u] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-my5bjnv61u] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-my5bjnv61u] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-my5bjnv61u] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-my5bjnv61u] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-my5bjnv61u] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-my5bjnv61u] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-my5bjnv61u] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-my5bjnv61u] { border-bottom: none; }
.config-toggle-label[b-my5bjnv61u] { flex: 1; }
.config-toggle-name[b-my5bjnv61u] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-my5bjnv61u] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-my5bjnv61u] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-my5bjnv61u] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-my5bjnv61u] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-my5bjnv61u] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-my5bjnv61u], .form-group select[b-my5bjnv61u] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaApertura.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-rg3vli4k26] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rg3vli4k26 0.3s ease-out; }
@keyframes slideUp-b-rg3vli4k26 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rg3vli4k26] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rg3vli4k26] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rg3vli4k26] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rg3vli4k26] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rg3vli4k26] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rg3vli4k26] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rg3vli4k26] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rg3vli4k26] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rg3vli4k26] { filter: brightness(1.1); }
.btn-outline[b-rg3vli4k26] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rg3vli4k26] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rg3vli4k26] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rg3vli4k26] { filter: brightness(1.1); }
.btn-icon[b-rg3vli4k26] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rg3vli4k26] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rg3vli4k26] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rg3vli4k26] { color: #ef4444; }
.btn-delete:hover[b-rg3vli4k26] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-rg3vli4k26] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-rg3vli4k26] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-rg3vli4k26] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rg3vli4k26] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rg3vli4k26] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rg3vli4k26] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rg3vli4k26] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rg3vli4k26] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-rg3vli4k26] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-rg3vli4k26] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rg3vli4k26] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-rg3vli4k26] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-rg3vli4k26] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rg3vli4k26] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rg3vli4k26] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rg3vli4k26] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rg3vli4k26] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rg3vli4k26] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rg3vli4k26] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-rg3vli4k26] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-rg3vli4k26] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-rg3vli4k26] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rg3vli4k26] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rg3vli4k26] { background: #f1f5f9; color: #64748b; }
.badge-info[b-rg3vli4k26] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-rg3vli4k26] { background: #fffbeb; color: #92400e; }
.badge-danger[b-rg3vli4k26] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-rg3vli4k26] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-rg3vli4k26] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-rg3vli4k26] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-rg3vli4k26] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-rg3vli4k26] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-rg3vli4k26] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-rg3vli4k26] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-rg3vli4k26] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rg3vli4k26] { text-align: center; }
.text-muted[b-rg3vli4k26] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rg3vli4k26], .crud-empty-state[b-rg3vli4k26] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rg3vli4k26] { font-size: 2rem; }
.crud-spinner[b-rg3vli4k26] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rg3vli4k26 0.6s linear infinite; }
.crud-spinner-sm[b-rg3vli4k26] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rg3vli4k26 0.6s linear infinite; }
@keyframes spin-b-rg3vli4k26 { to { transform: rotate(360deg); } }
.spin[b-rg3vli4k26] { animation: spin-b-rg3vli4k26 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-rg3vli4k26] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rg3vli4k26 0.15s ease-out; }
.modal-container[b-rg3vli4k26] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rg3vli4k26] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rg3vli4k26 0.2s ease-out; }
.modal-lg[b-rg3vli4k26] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-rg3vli4k26] { max-width: 420px; }
@keyframes fadeIn-b-rg3vli4k26 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rg3vli4k26 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rg3vli4k26] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rg3vli4k26] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-rg3vli4k26] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rg3vli4k26] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rg3vli4k26] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rg3vli4k26] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rg3vli4k26] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-rg3vli4k26] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rg3vli4k26] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rg3vli4k26] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rg3vli4k26] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-rg3vli4k26] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rg3vli4k26] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rg3vli4k26] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rg3vli4k26] { flex: 2; }
.form-group label[b-rg3vli4k26] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rg3vli4k26], .form-group select[b-rg3vli4k26], .form-textarea[b-rg3vli4k26] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rg3vli4k26], .form-group select:focus[b-rg3vli4k26], .form-textarea:focus[b-rg3vli4k26] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rg3vli4k26] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rg3vli4k26] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rg3vli4k26] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rg3vli4k26] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-rg3vli4k26] { margin-top: 0; }
.form-section-title i[b-rg3vli4k26] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-rg3vli4k26] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-rg3vli4k26] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-rg3vli4k26] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-rg3vli4k26] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-rg3vli4k26] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-rg3vli4k26] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-rg3vli4k26] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-rg3vli4k26] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rg3vli4k26] { padding: 0.75rem; }
    .crud-header[b-rg3vli4k26] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rg3vli4k26] { font-size: 1.1rem; }
    .btn-text[b-rg3vli4k26] { display: none; }
    .form-row[b-rg3vli4k26] { flex-direction: column; }
    .form-row-3[b-rg3vli4k26] { grid-template-columns: 1fr; }
    .form-row-4[b-rg3vli4k26] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rg3vli4k26] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rg3vli4k26] { max-width: 98vw; width: 98vw; }
    .modal-body[b-rg3vli4k26] { padding: 0.75rem; }
    .modal-tabs[b-rg3vli4k26] { overflow-x: auto; }
    .modal-tab[b-rg3vli4k26] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-rg3vli4k26] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rg3vli4k26] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rg3vli4k26] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rg3vli4k26] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-rg3vli4k26] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-rg3vli4k26] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-rg3vli4k26] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-rg3vli4k26] { border-bottom: none; }
.help-section p[b-rg3vli4k26] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-rg3vli4k26], .help-section ol[b-rg3vli4k26] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-rg3vli4k26] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-rg3vli4k26] { color: var(--rg-accent,#2563eb); }
.help-tip[b-rg3vli4k26] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-rg3vli4k26] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-rg3vli4k26] { background: rgba(37,99,235,0.12); }
.help-table[b-rg3vli4k26] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-rg3vli4k26] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-rg3vli4k26] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-rg3vli4k26] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-rg3vli4k26] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-rg3vli4k26] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-rg3vli4k26] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-rg3vli4k26] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-rg3vli4k26] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-rg3vli4k26] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-rg3vli4k26] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-rg3vli4k26] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-rg3vli4k26] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-rg3vli4k26] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-rg3vli4k26] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-rg3vli4k26] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-rg3vli4k26] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-rg3vli4k26] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaArqueoIntermedio.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-tqgvc5d6r3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tqgvc5d6r3 0.3s ease-out; }
@keyframes slideUp-b-tqgvc5d6r3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tqgvc5d6r3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tqgvc5d6r3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tqgvc5d6r3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tqgvc5d6r3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tqgvc5d6r3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tqgvc5d6r3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tqgvc5d6r3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tqgvc5d6r3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tqgvc5d6r3] { filter: brightness(1.1); }
.btn-outline[b-tqgvc5d6r3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tqgvc5d6r3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tqgvc5d6r3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tqgvc5d6r3] { filter: brightness(1.1); }
.btn-icon[b-tqgvc5d6r3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tqgvc5d6r3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tqgvc5d6r3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tqgvc5d6r3] { color: #ef4444; }
.btn-delete:hover[b-tqgvc5d6r3] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-tqgvc5d6r3] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-tqgvc5d6r3] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-tqgvc5d6r3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tqgvc5d6r3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tqgvc5d6r3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tqgvc5d6r3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tqgvc5d6r3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tqgvc5d6r3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-tqgvc5d6r3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-tqgvc5d6r3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tqgvc5d6r3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-tqgvc5d6r3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-tqgvc5d6r3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tqgvc5d6r3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tqgvc5d6r3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tqgvc5d6r3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tqgvc5d6r3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tqgvc5d6r3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tqgvc5d6r3] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-tqgvc5d6r3] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-tqgvc5d6r3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-tqgvc5d6r3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tqgvc5d6r3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tqgvc5d6r3] { background: #f1f5f9; color: #64748b; }
.badge-info[b-tqgvc5d6r3] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-tqgvc5d6r3] { background: #fffbeb; color: #92400e; }
.badge-danger[b-tqgvc5d6r3] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-tqgvc5d6r3] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-tqgvc5d6r3] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-tqgvc5d6r3] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-tqgvc5d6r3] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-tqgvc5d6r3] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-tqgvc5d6r3] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-tqgvc5d6r3] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-tqgvc5d6r3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tqgvc5d6r3] { text-align: center; }
.text-muted[b-tqgvc5d6r3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tqgvc5d6r3], .crud-empty-state[b-tqgvc5d6r3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tqgvc5d6r3] { font-size: 2rem; }
.crud-spinner[b-tqgvc5d6r3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tqgvc5d6r3 0.6s linear infinite; }
.crud-spinner-sm[b-tqgvc5d6r3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tqgvc5d6r3 0.6s linear infinite; }
@keyframes spin-b-tqgvc5d6r3 { to { transform: rotate(360deg); } }
.spin[b-tqgvc5d6r3] { animation: spin-b-tqgvc5d6r3 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-tqgvc5d6r3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tqgvc5d6r3 0.15s ease-out; }
.modal-container[b-tqgvc5d6r3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tqgvc5d6r3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tqgvc5d6r3 0.2s ease-out; }
.modal-lg[b-tqgvc5d6r3] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-tqgvc5d6r3] { max-width: 420px; }
@keyframes fadeIn-b-tqgvc5d6r3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tqgvc5d6r3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tqgvc5d6r3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tqgvc5d6r3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-tqgvc5d6r3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tqgvc5d6r3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tqgvc5d6r3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tqgvc5d6r3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tqgvc5d6r3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-tqgvc5d6r3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tqgvc5d6r3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tqgvc5d6r3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tqgvc5d6r3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-tqgvc5d6r3] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tqgvc5d6r3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tqgvc5d6r3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tqgvc5d6r3] { flex: 2; }
.form-group label[b-tqgvc5d6r3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tqgvc5d6r3], .form-group select[b-tqgvc5d6r3], .form-textarea[b-tqgvc5d6r3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tqgvc5d6r3], .form-group select:focus[b-tqgvc5d6r3], .form-textarea:focus[b-tqgvc5d6r3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tqgvc5d6r3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tqgvc5d6r3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tqgvc5d6r3] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tqgvc5d6r3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-tqgvc5d6r3] { margin-top: 0; }
.form-section-title i[b-tqgvc5d6r3] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-tqgvc5d6r3] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-tqgvc5d6r3] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-tqgvc5d6r3] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-tqgvc5d6r3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-tqgvc5d6r3] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-tqgvc5d6r3] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-tqgvc5d6r3] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-tqgvc5d6r3] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tqgvc5d6r3] { padding: 0.75rem; }
    .crud-header[b-tqgvc5d6r3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tqgvc5d6r3] { font-size: 1.1rem; }
    .btn-text[b-tqgvc5d6r3] { display: none; }
    .form-row[b-tqgvc5d6r3] { flex-direction: column; }
    .form-row-3[b-tqgvc5d6r3] { grid-template-columns: 1fr; }
    .form-row-4[b-tqgvc5d6r3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tqgvc5d6r3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tqgvc5d6r3] { max-width: 98vw; width: 98vw; }
    .modal-body[b-tqgvc5d6r3] { padding: 0.75rem; }
    .modal-tabs[b-tqgvc5d6r3] { overflow-x: auto; }
    .modal-tab[b-tqgvc5d6r3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-tqgvc5d6r3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tqgvc5d6r3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tqgvc5d6r3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tqgvc5d6r3] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-tqgvc5d6r3] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-tqgvc5d6r3] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-tqgvc5d6r3] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-tqgvc5d6r3] { border-bottom: none; }
.help-section p[b-tqgvc5d6r3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-tqgvc5d6r3], .help-section ol[b-tqgvc5d6r3] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-tqgvc5d6r3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-tqgvc5d6r3] { color: var(--rg-accent,#2563eb); }
.help-tip[b-tqgvc5d6r3] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-tqgvc5d6r3] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-tqgvc5d6r3] { background: rgba(37,99,235,0.12); }
.help-table[b-tqgvc5d6r3] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-tqgvc5d6r3] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-tqgvc5d6r3] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-tqgvc5d6r3] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-tqgvc5d6r3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-tqgvc5d6r3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-tqgvc5d6r3] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-tqgvc5d6r3] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-tqgvc5d6r3] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-tqgvc5d6r3] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-tqgvc5d6r3] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-tqgvc5d6r3] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-tqgvc5d6r3] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-tqgvc5d6r3] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-tqgvc5d6r3] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-tqgvc5d6r3] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-tqgvc5d6r3] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-tqgvc5d6r3] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaAsignacionUsuario.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-o0m6bur4ck] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-o0m6bur4ck 0.3s ease-out; }
@keyframes slideUp-b-o0m6bur4ck { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-o0m6bur4ck] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-o0m6bur4ck] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-o0m6bur4ck] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-o0m6bur4ck] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-o0m6bur4ck] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-o0m6bur4ck] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-o0m6bur4ck] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-o0m6bur4ck] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-o0m6bur4ck] { filter: brightness(1.1); }
.btn-outline[b-o0m6bur4ck] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-o0m6bur4ck] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-o0m6bur4ck] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-o0m6bur4ck] { filter: brightness(1.1); }
.btn-icon[b-o0m6bur4ck] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-o0m6bur4ck] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-o0m6bur4ck] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-o0m6bur4ck] { color: #ef4444; }
.btn-delete:hover[b-o0m6bur4ck] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-o0m6bur4ck] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-o0m6bur4ck] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-o0m6bur4ck] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-o0m6bur4ck] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-o0m6bur4ck] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-o0m6bur4ck] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-o0m6bur4ck] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-o0m6bur4ck] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-o0m6bur4ck] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-o0m6bur4ck] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-o0m6bur4ck] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-o0m6bur4ck] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-o0m6bur4ck] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-o0m6bur4ck] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-o0m6bur4ck] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-o0m6bur4ck] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-o0m6bur4ck] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-o0m6bur4ck] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-o0m6bur4ck] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-o0m6bur4ck] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-o0m6bur4ck] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-o0m6bur4ck] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-o0m6bur4ck] { background: #ecfdf5; color: #065f46; }
.badge-no[b-o0m6bur4ck] { background: #f1f5f9; color: #64748b; }
.badge-info[b-o0m6bur4ck] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-o0m6bur4ck] { background: #fffbeb; color: #92400e; }
.badge-danger[b-o0m6bur4ck] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-o0m6bur4ck] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-o0m6bur4ck] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-o0m6bur4ck] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-o0m6bur4ck] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-o0m6bur4ck] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-o0m6bur4ck] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-o0m6bur4ck] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-o0m6bur4ck] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-o0m6bur4ck] { text-align: center; }
.text-muted[b-o0m6bur4ck] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-o0m6bur4ck], .crud-empty-state[b-o0m6bur4ck] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-o0m6bur4ck] { font-size: 2rem; }
.crud-spinner[b-o0m6bur4ck] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-o0m6bur4ck 0.6s linear infinite; }
.crud-spinner-sm[b-o0m6bur4ck] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-o0m6bur4ck 0.6s linear infinite; }
@keyframes spin-b-o0m6bur4ck { to { transform: rotate(360deg); } }
.spin[b-o0m6bur4ck] { animation: spin-b-o0m6bur4ck 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-o0m6bur4ck] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-o0m6bur4ck 0.15s ease-out; }
.modal-container[b-o0m6bur4ck] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-o0m6bur4ck] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-o0m6bur4ck 0.2s ease-out; }
.modal-lg[b-o0m6bur4ck] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-o0m6bur4ck] { max-width: 420px; }
@keyframes fadeIn-b-o0m6bur4ck { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-o0m6bur4ck { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-o0m6bur4ck] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-o0m6bur4ck] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-o0m6bur4ck] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-o0m6bur4ck] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-o0m6bur4ck] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-o0m6bur4ck] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-o0m6bur4ck] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-o0m6bur4ck] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-o0m6bur4ck] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-o0m6bur4ck] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-o0m6bur4ck] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-o0m6bur4ck] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-o0m6bur4ck] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-o0m6bur4ck] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-o0m6bur4ck] { flex: 2; }
.form-group label[b-o0m6bur4ck] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-o0m6bur4ck], .form-group select[b-o0m6bur4ck], .form-textarea[b-o0m6bur4ck] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-o0m6bur4ck], .form-group select:focus[b-o0m6bur4ck], .form-textarea:focus[b-o0m6bur4ck] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-o0m6bur4ck] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-o0m6bur4ck] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-o0m6bur4ck] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-o0m6bur4ck] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-o0m6bur4ck] { margin-top: 0; }
.form-section-title i[b-o0m6bur4ck] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-o0m6bur4ck] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-o0m6bur4ck] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-o0m6bur4ck] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-o0m6bur4ck] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-o0m6bur4ck] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-o0m6bur4ck] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-o0m6bur4ck] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-o0m6bur4ck] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-o0m6bur4ck] { padding: 0.75rem; }
    .crud-header[b-o0m6bur4ck] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-o0m6bur4ck] { font-size: 1.1rem; }
    .btn-text[b-o0m6bur4ck] { display: none; }
    .form-row[b-o0m6bur4ck] { flex-direction: column; }
    .form-row-3[b-o0m6bur4ck] { grid-template-columns: 1fr; }
    .form-row-4[b-o0m6bur4ck] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-o0m6bur4ck] { width: 98%; max-height: 95vh; }
    .modal-lg[b-o0m6bur4ck] { max-width: 98vw; width: 98vw; }
    .modal-body[b-o0m6bur4ck] { padding: 0.75rem; }
    .modal-tabs[b-o0m6bur4ck] { overflow-x: auto; }
    .modal-tab[b-o0m6bur4ck] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-o0m6bur4ck] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-o0m6bur4ck] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-o0m6bur4ck] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-o0m6bur4ck] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-o0m6bur4ck] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-o0m6bur4ck] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-o0m6bur4ck] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-o0m6bur4ck] { border-bottom: none; }
.help-section p[b-o0m6bur4ck] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-o0m6bur4ck], .help-section ol[b-o0m6bur4ck] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-o0m6bur4ck] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-o0m6bur4ck] { color: var(--rg-accent,#2563eb); }
.help-tip[b-o0m6bur4ck] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-o0m6bur4ck] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-o0m6bur4ck] { background: rgba(37,99,235,0.12); }
.help-table[b-o0m6bur4ck] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-o0m6bur4ck] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-o0m6bur4ck] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-o0m6bur4ck] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-o0m6bur4ck] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-o0m6bur4ck] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-o0m6bur4ck] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-o0m6bur4ck] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-o0m6bur4ck] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-o0m6bur4ck] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-o0m6bur4ck] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-o0m6bur4ck] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-o0m6bur4ck] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-o0m6bur4ck] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-o0m6bur4ck] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-o0m6bur4ck] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-o0m6bur4ck] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Candado transversal (exigir caja para emitir recibos) ─────────────── */
.candado-panel[b-o0m6bur4ck] { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.75rem;
    padding: 0.85rem 1.1rem; margin-bottom: 1rem; border-left: 4px solid var(--rg-text-muted); }
.candado-panel.on[b-o0m6bur4ck] { border-left-color: var(--rg-success); background: rgba(34,197,94,0.06); }
.candado-info[b-o0m6bur4ck] { display: flex; align-items: center; gap: 0.75rem; }
.candado-info > i[b-o0m6bur4ck] { font-size: 1.4rem; color: var(--rg-text-muted); }
.candado-panel.on .candado-info > i[b-o0m6bur4ck] { color: var(--rg-success); }
.candado-info > div[b-o0m6bur4ck] { display: flex; flex-direction: column; }
.candado-titulo[b-o0m6bur4ck] { font-weight: 700; color: var(--rg-text-primary); font-size: 0.92rem; }
.candado-sub[b-o0m6bur4ck] { font-size: 0.78rem; color: var(--rg-text-secondary); max-width: 640px; }

.candado-switch[b-o0m6bur4ck] { position: relative; display: inline-block; width: 52px; height: 28px; flex-shrink: 0; }
.candado-switch input[b-o0m6bur4ck] { opacity: 0; width: 0; height: 0; }
.candado-slider[b-o0m6bur4ck] { position: absolute; cursor: pointer; inset: 0; background: var(--rg-border);
    border-radius: 28px; transition: 0.2s; }
.candado-slider[b-o0m6bur4ck]::before { content: ""; position: absolute; height: 22px; width: 22px; left: 3px; bottom: 3px;
    background: #fff; border-radius: 50%; transition: 0.2s; }
.candado-switch input:checked + .candado-slider[b-o0m6bur4ck] { background: var(--rg-success); }
.candado-switch input:checked + .candado-slider[b-o0m6bur4ck]::before { transform: translateX(24px); }
.candado-switch input:disabled + .candado-slider[b-o0m6bur4ck] { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 640px) { .candado-panel[b-o0m6bur4ck] { flex-direction: column; align-items: flex-start; } }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaBandejaTraspasos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-cqcd5poqip] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-cqcd5poqip 0.3s ease-out; }
@keyframes slideUp-b-cqcd5poqip { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-cqcd5poqip] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-cqcd5poqip] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-cqcd5poqip] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-cqcd5poqip] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-cqcd5poqip] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-cqcd5poqip] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-cqcd5poqip] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-cqcd5poqip] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-cqcd5poqip] { filter: brightness(1.1); }
.btn-outline[b-cqcd5poqip] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-cqcd5poqip] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-cqcd5poqip] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-cqcd5poqip] { filter: brightness(1.1); }
.btn-icon[b-cqcd5poqip] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-cqcd5poqip] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-cqcd5poqip] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-cqcd5poqip] { color: #ef4444; }
.btn-delete:hover[b-cqcd5poqip] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-cqcd5poqip] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-cqcd5poqip] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-cqcd5poqip] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-cqcd5poqip] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-cqcd5poqip] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-cqcd5poqip] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-cqcd5poqip] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-cqcd5poqip] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-cqcd5poqip] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-cqcd5poqip] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-cqcd5poqip] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-cqcd5poqip] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-cqcd5poqip] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-cqcd5poqip] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-cqcd5poqip] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-cqcd5poqip] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-cqcd5poqip] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-cqcd5poqip] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-cqcd5poqip] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-cqcd5poqip] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-cqcd5poqip] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-cqcd5poqip] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-cqcd5poqip] { background: #ecfdf5; color: #065f46; }
.badge-no[b-cqcd5poqip] { background: #f1f5f9; color: #64748b; }
.badge-info[b-cqcd5poqip] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-cqcd5poqip] { background: #fffbeb; color: #92400e; }
.badge-danger[b-cqcd5poqip] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-cqcd5poqip] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-cqcd5poqip] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-cqcd5poqip] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-cqcd5poqip] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-cqcd5poqip] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-cqcd5poqip] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-cqcd5poqip] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-cqcd5poqip] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-cqcd5poqip] { text-align: center; }
.text-muted[b-cqcd5poqip] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-cqcd5poqip], .crud-empty-state[b-cqcd5poqip] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-cqcd5poqip] { font-size: 2rem; }
.crud-spinner[b-cqcd5poqip] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-cqcd5poqip 0.6s linear infinite; }
.crud-spinner-sm[b-cqcd5poqip] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-cqcd5poqip 0.6s linear infinite; }
@keyframes spin-b-cqcd5poqip { to { transform: rotate(360deg); } }
.spin[b-cqcd5poqip] { animation: spin-b-cqcd5poqip 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-cqcd5poqip] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-cqcd5poqip 0.15s ease-out; }
.modal-container[b-cqcd5poqip] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-cqcd5poqip] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-cqcd5poqip 0.2s ease-out; }
.modal-lg[b-cqcd5poqip] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-cqcd5poqip] { max-width: 420px; }
@keyframes fadeIn-b-cqcd5poqip { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-cqcd5poqip { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-cqcd5poqip] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-cqcd5poqip] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-cqcd5poqip] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-cqcd5poqip] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-cqcd5poqip] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-cqcd5poqip] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-cqcd5poqip] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-cqcd5poqip] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-cqcd5poqip] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-cqcd5poqip] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-cqcd5poqip] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-cqcd5poqip] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-cqcd5poqip] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-cqcd5poqip] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-cqcd5poqip] { flex: 2; }
.form-group label[b-cqcd5poqip] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-cqcd5poqip], .form-group select[b-cqcd5poqip], .form-textarea[b-cqcd5poqip] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-cqcd5poqip], .form-group select:focus[b-cqcd5poqip], .form-textarea:focus[b-cqcd5poqip] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-cqcd5poqip] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-cqcd5poqip] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-cqcd5poqip] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-cqcd5poqip] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-cqcd5poqip] { margin-top: 0; }
.form-section-title i[b-cqcd5poqip] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-cqcd5poqip] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-cqcd5poqip] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-cqcd5poqip] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-cqcd5poqip] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-cqcd5poqip] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-cqcd5poqip] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-cqcd5poqip] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-cqcd5poqip] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-cqcd5poqip] { padding: 0.75rem; }
    .crud-header[b-cqcd5poqip] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-cqcd5poqip] { font-size: 1.1rem; }
    .btn-text[b-cqcd5poqip] { display: none; }
    .form-row[b-cqcd5poqip] { flex-direction: column; }
    .form-row-3[b-cqcd5poqip] { grid-template-columns: 1fr; }
    .form-row-4[b-cqcd5poqip] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-cqcd5poqip] { width: 98%; max-height: 95vh; }
    .modal-lg[b-cqcd5poqip] { max-width: 98vw; width: 98vw; }
    .modal-body[b-cqcd5poqip] { padding: 0.75rem; }
    .modal-tabs[b-cqcd5poqip] { overflow-x: auto; }
    .modal-tab[b-cqcd5poqip] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-cqcd5poqip] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cqcd5poqip] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cqcd5poqip] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cqcd5poqip] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-cqcd5poqip] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-cqcd5poqip] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-cqcd5poqip] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-cqcd5poqip] { border-bottom: none; }
.help-section p[b-cqcd5poqip] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-cqcd5poqip], .help-section ol[b-cqcd5poqip] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-cqcd5poqip] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-cqcd5poqip] { color: var(--rg-accent,#2563eb); }
.help-tip[b-cqcd5poqip] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-cqcd5poqip] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-cqcd5poqip] { background: rgba(37,99,235,0.12); }
.help-table[b-cqcd5poqip] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-cqcd5poqip] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-cqcd5poqip] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-cqcd5poqip] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-cqcd5poqip] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-cqcd5poqip] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-cqcd5poqip] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-cqcd5poqip] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-cqcd5poqip] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-cqcd5poqip] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-cqcd5poqip] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-cqcd5poqip] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-cqcd5poqip] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-cqcd5poqip] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-cqcd5poqip] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-cqcd5poqip] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-cqcd5poqip] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-cqcd5poqip] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaCambioBilletes.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-ko2rkmnhdo] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ko2rkmnhdo 0.3s ease-out; }
@keyframes slideUp-b-ko2rkmnhdo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ko2rkmnhdo] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ko2rkmnhdo] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ko2rkmnhdo] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ko2rkmnhdo] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ko2rkmnhdo] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ko2rkmnhdo] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ko2rkmnhdo] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ko2rkmnhdo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ko2rkmnhdo] { filter: brightness(1.1); }
.btn-outline[b-ko2rkmnhdo] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ko2rkmnhdo] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ko2rkmnhdo] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ko2rkmnhdo] { filter: brightness(1.1); }
.btn-icon[b-ko2rkmnhdo] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ko2rkmnhdo] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ko2rkmnhdo] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ko2rkmnhdo] { color: #ef4444; }
.btn-delete:hover[b-ko2rkmnhdo] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-ko2rkmnhdo] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-ko2rkmnhdo] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-ko2rkmnhdo] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ko2rkmnhdo] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ko2rkmnhdo] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ko2rkmnhdo] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ko2rkmnhdo] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ko2rkmnhdo] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-ko2rkmnhdo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-ko2rkmnhdo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ko2rkmnhdo] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-ko2rkmnhdo] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-ko2rkmnhdo] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ko2rkmnhdo] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ko2rkmnhdo] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ko2rkmnhdo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ko2rkmnhdo] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ko2rkmnhdo] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ko2rkmnhdo] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-ko2rkmnhdo] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-ko2rkmnhdo] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-ko2rkmnhdo] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ko2rkmnhdo] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ko2rkmnhdo] { background: #f1f5f9; color: #64748b; }
.badge-info[b-ko2rkmnhdo] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-ko2rkmnhdo] { background: #fffbeb; color: #92400e; }
.badge-danger[b-ko2rkmnhdo] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-ko2rkmnhdo] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-ko2rkmnhdo] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-ko2rkmnhdo] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-ko2rkmnhdo] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-ko2rkmnhdo] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-ko2rkmnhdo] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-ko2rkmnhdo] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-ko2rkmnhdo] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ko2rkmnhdo] { text-align: center; }
.text-muted[b-ko2rkmnhdo] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ko2rkmnhdo], .crud-empty-state[b-ko2rkmnhdo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ko2rkmnhdo] { font-size: 2rem; }
.crud-spinner[b-ko2rkmnhdo] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ko2rkmnhdo 0.6s linear infinite; }
.crud-spinner-sm[b-ko2rkmnhdo] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ko2rkmnhdo 0.6s linear infinite; }
@keyframes spin-b-ko2rkmnhdo { to { transform: rotate(360deg); } }
.spin[b-ko2rkmnhdo] { animation: spin-b-ko2rkmnhdo 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-ko2rkmnhdo] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ko2rkmnhdo 0.15s ease-out; }
.modal-container[b-ko2rkmnhdo] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ko2rkmnhdo] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ko2rkmnhdo 0.2s ease-out; }
.modal-lg[b-ko2rkmnhdo] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-ko2rkmnhdo] { max-width: 420px; }
@keyframes fadeIn-b-ko2rkmnhdo { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ko2rkmnhdo { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ko2rkmnhdo] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ko2rkmnhdo] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ko2rkmnhdo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ko2rkmnhdo] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ko2rkmnhdo] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ko2rkmnhdo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ko2rkmnhdo] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-ko2rkmnhdo] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ko2rkmnhdo] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ko2rkmnhdo] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ko2rkmnhdo] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-ko2rkmnhdo] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ko2rkmnhdo] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ko2rkmnhdo] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ko2rkmnhdo] { flex: 2; }
.form-group label[b-ko2rkmnhdo] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ko2rkmnhdo], .form-group select[b-ko2rkmnhdo], .form-textarea[b-ko2rkmnhdo] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ko2rkmnhdo], .form-group select:focus[b-ko2rkmnhdo], .form-textarea:focus[b-ko2rkmnhdo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ko2rkmnhdo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ko2rkmnhdo] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ko2rkmnhdo] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ko2rkmnhdo] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-ko2rkmnhdo] { margin-top: 0; }
.form-section-title i[b-ko2rkmnhdo] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-ko2rkmnhdo] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-ko2rkmnhdo] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-ko2rkmnhdo] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-ko2rkmnhdo] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-ko2rkmnhdo] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-ko2rkmnhdo] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-ko2rkmnhdo] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-ko2rkmnhdo] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ko2rkmnhdo] { padding: 0.75rem; }
    .crud-header[b-ko2rkmnhdo] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ko2rkmnhdo] { font-size: 1.1rem; }
    .btn-text[b-ko2rkmnhdo] { display: none; }
    .form-row[b-ko2rkmnhdo] { flex-direction: column; }
    .form-row-3[b-ko2rkmnhdo] { grid-template-columns: 1fr; }
    .form-row-4[b-ko2rkmnhdo] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ko2rkmnhdo] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ko2rkmnhdo] { max-width: 98vw; width: 98vw; }
    .modal-body[b-ko2rkmnhdo] { padding: 0.75rem; }
    .modal-tabs[b-ko2rkmnhdo] { overflow-x: auto; }
    .modal-tab[b-ko2rkmnhdo] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ko2rkmnhdo] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ko2rkmnhdo] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ko2rkmnhdo] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ko2rkmnhdo] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-ko2rkmnhdo] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-ko2rkmnhdo] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ko2rkmnhdo] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-ko2rkmnhdo] { border-bottom: none; }
.help-section p[b-ko2rkmnhdo] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-ko2rkmnhdo], .help-section ol[b-ko2rkmnhdo] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ko2rkmnhdo] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ko2rkmnhdo] { color: var(--rg-accent,#2563eb); }
.help-tip[b-ko2rkmnhdo] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-ko2rkmnhdo] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-ko2rkmnhdo] { background: rgba(37,99,235,0.12); }
.help-table[b-ko2rkmnhdo] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-ko2rkmnhdo] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-ko2rkmnhdo] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-ko2rkmnhdo] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-ko2rkmnhdo] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-ko2rkmnhdo] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-ko2rkmnhdo] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-ko2rkmnhdo] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-ko2rkmnhdo] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-ko2rkmnhdo] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-ko2rkmnhdo] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-ko2rkmnhdo] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-ko2rkmnhdo] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-ko2rkmnhdo] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-ko2rkmnhdo] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-ko2rkmnhdo] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-ko2rkmnhdo] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-ko2rkmnhdo] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaCierre.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-rcavkev95j] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rcavkev95j 0.3s ease-out; }
@keyframes slideUp-b-rcavkev95j { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rcavkev95j] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rcavkev95j] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rcavkev95j] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rcavkev95j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rcavkev95j] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rcavkev95j] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rcavkev95j] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rcavkev95j] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rcavkev95j] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rcavkev95j] { filter: brightness(1.1); }
.btn-outline[b-rcavkev95j] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rcavkev95j] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rcavkev95j] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rcavkev95j] { filter: brightness(1.1); }
.btn-icon[b-rcavkev95j] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rcavkev95j] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rcavkev95j] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rcavkev95j] { color: #ef4444; }
.btn-delete:hover[b-rcavkev95j] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-rcavkev95j] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-rcavkev95j] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-rcavkev95j] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rcavkev95j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rcavkev95j] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rcavkev95j] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rcavkev95j] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rcavkev95j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rcavkev95j] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rcavkev95j] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-rcavkev95j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-rcavkev95j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rcavkev95j] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-rcavkev95j] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-rcavkev95j] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rcavkev95j] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rcavkev95j] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rcavkev95j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rcavkev95j] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rcavkev95j] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rcavkev95j] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-rcavkev95j] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-rcavkev95j] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-rcavkev95j] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rcavkev95j] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rcavkev95j] { background: #f1f5f9; color: #64748b; }
.badge-info[b-rcavkev95j] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-rcavkev95j] { background: #fffbeb; color: #92400e; }
.badge-danger[b-rcavkev95j] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-rcavkev95j] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-rcavkev95j] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-rcavkev95j] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-rcavkev95j] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-rcavkev95j] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-rcavkev95j] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-rcavkev95j] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-rcavkev95j] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rcavkev95j] { text-align: center; }
.text-muted[b-rcavkev95j] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rcavkev95j], .crud-empty-state[b-rcavkev95j] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rcavkev95j] { font-size: 2rem; }
.crud-spinner[b-rcavkev95j] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rcavkev95j 0.6s linear infinite; }
.crud-spinner-sm[b-rcavkev95j] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rcavkev95j 0.6s linear infinite; }
@keyframes spin-b-rcavkev95j { to { transform: rotate(360deg); } }
.spin[b-rcavkev95j] { animation: spin-b-rcavkev95j 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-rcavkev95j] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rcavkev95j 0.15s ease-out; }
.modal-container[b-rcavkev95j] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rcavkev95j] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rcavkev95j 0.2s ease-out; }
.modal-lg[b-rcavkev95j] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-rcavkev95j] { max-width: 420px; }
@keyframes fadeIn-b-rcavkev95j { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rcavkev95j { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rcavkev95j] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rcavkev95j] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-rcavkev95j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rcavkev95j] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rcavkev95j] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rcavkev95j] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rcavkev95j] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-rcavkev95j] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rcavkev95j] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rcavkev95j] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rcavkev95j] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-rcavkev95j] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rcavkev95j] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rcavkev95j] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rcavkev95j] { flex: 2; }
.form-group label[b-rcavkev95j] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rcavkev95j], .form-group select[b-rcavkev95j], .form-textarea[b-rcavkev95j] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rcavkev95j], .form-group select:focus[b-rcavkev95j], .form-textarea:focus[b-rcavkev95j] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rcavkev95j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rcavkev95j] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rcavkev95j] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-rcavkev95j] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rcavkev95j] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-rcavkev95j] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-rcavkev95j] { margin-top: 0; }
.form-section-title i[b-rcavkev95j] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-rcavkev95j] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-rcavkev95j] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-rcavkev95j] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-rcavkev95j] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-rcavkev95j] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-rcavkev95j] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-rcavkev95j] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-rcavkev95j] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-rcavkev95j] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rcavkev95j] { padding: 0.75rem; }
    .crud-header[b-rcavkev95j] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rcavkev95j] { font-size: 1.1rem; }
    .btn-text[b-rcavkev95j] { display: none; }
    .form-row[b-rcavkev95j] { flex-direction: column; }
    .form-row-3[b-rcavkev95j] { grid-template-columns: 1fr; }
    .form-row-4[b-rcavkev95j] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rcavkev95j] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rcavkev95j] { max-width: 98vw; width: 98vw; }
    .modal-body[b-rcavkev95j] { padding: 0.75rem; }
    .modal-tabs[b-rcavkev95j] { overflow-x: auto; }
    .modal-tab[b-rcavkev95j] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-rcavkev95j] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rcavkev95j] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rcavkev95j] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rcavkev95j] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-rcavkev95j] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-rcavkev95j] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-rcavkev95j] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-rcavkev95j] { border-bottom: none; }
.help-section p[b-rcavkev95j] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-rcavkev95j], .help-section ol[b-rcavkev95j] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-rcavkev95j] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-rcavkev95j] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-rcavkev95j] { color: var(--rg-accent,#2563eb); }
.help-tip[b-rcavkev95j] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-rcavkev95j] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-rcavkev95j] { background: rgba(37,99,235,0.12); }
.help-table[b-rcavkev95j] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-rcavkev95j] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-rcavkev95j] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-rcavkev95j] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-rcavkev95j] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-rcavkev95j] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-rcavkev95j] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-rcavkev95j] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-rcavkev95j] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-rcavkev95j] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-rcavkev95j] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-rcavkev95j] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-rcavkev95j] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-rcavkev95j] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-rcavkev95j] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-rcavkev95j] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-rcavkev95j] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-rcavkev95j] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── 🪙 Resumen del cuadre (facturación multimoneda + crédito) ─────────── */
.cq-hint[b-rcavkev95j] {
    font-size: .78rem; color: var(--rg-text-secondary, #475569);
    background: rgba(37,99,235,.06); border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0; padding: .5rem .75rem; margin: .35rem 0 .65rem;
}
.cq-hint i[b-rcavkev95j] { color: var(--rg-accent, #2563eb); }
[data-mode="dark"] .cq-hint[b-rcavkev95j] { background: rgba(37,99,235,.12); }

.cq-moneda[b-rcavkev95j] {
    display: inline-block; min-width: 2.4rem; text-align: center;
    font-weight: 700; font-size: .7rem; letter-spacing: .04em;
    padding: .1rem .45rem; margin-right: .4rem; border-radius: 999px;
    background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-primary, #1e293b);
    border: 1px solid var(--rg-border, #e2e8f0);
}

.cq-tag[b-rcavkev95j] {
    display: inline-block; margin-left: .5rem; font-size: .66rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .03em; padding: .1rem .45rem; border-radius: 999px;
}
.cq-tag-cash[b-rcavkev95j]    { background: rgba(22,163,74,.12);  color: #166534; }
.cq-tag-banco[b-rcavkev95j]   { background: rgba(37,99,235,.12);  color: #1e40af; }
.cq-tag-credito[b-rcavkev95j] { background: rgba(217,119,6,.14);  color: #9a3412; }
[data-mode="dark"] .cq-tag-cash[b-rcavkev95j]    { color: #86efac; }
[data-mode="dark"] .cq-tag-banco[b-rcavkev95j]   { color: #93c5fd; }
[data-mode="dark"] .cq-tag-credito[b-rcavkev95j] { color: #fdba74; }

.cq-row-cash[b-rcavkev95j]    { background: rgba(22,163,74,.04); }
.cq-row-credito[b-rcavkev95j] { background: rgba(217,119,6,.05); }
[data-mode="dark"] .cq-row-cash[b-rcavkev95j]    { background: rgba(22,163,74,.10); }
[data-mode="dark"] .cq-row-credito[b-rcavkev95j] { background: rgba(217,119,6,.12); }

.cq-foot-cash td[b-rcavkev95j]    { color: var(--rg-success, #16a34a); font-weight: 600; }
.cq-foot-credito td[b-rcavkev95j] { color: var(--rg-warning, #d97706); font-weight: 600; }

/* ── 🪙 Cuadre por ORIGEN + anulaciones ───────────────────────────────── */
.cq-origen-card[b-rcavkev95j] {
    border: 1px solid var(--rg-border, #e2e8f0); border-radius: .6rem;
    margin-bottom: .85rem; overflow: hidden; background: var(--rg-bg-card, #fff);
}
.cq-origen-head[b-rcavkev95j] {
    display: flex; align-items: center; gap: .55rem;
    padding: .5rem .8rem; background: var(--rg-bg-subtle, #f1f5f9);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.cq-origen-head > i[b-rcavkev95j] { color: var(--rg-accent, #2563eb); font-size: 1.05rem; }
.cq-origen-name[b-rcavkev95j] { font-weight: 700; color: var(--rg-text-primary, #1e293b); font-size: .9rem; }
.cq-origen-total[b-rcavkev95j] { margin-left: auto; display: flex; gap: .4rem; flex-wrap: wrap; }
.cq-origen-mon[b-rcavkev95j] {
    font-family: 'Cascadia Code','Fira Code',monospace; font-size: .78rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 999px; padding: .12rem .55rem;
}
.cq-origen-card .crud-table[b-rcavkev95j] { margin: 0; }

.cq-anulado[b-rcavkev95j] { color: var(--rg-danger, #dc2626) !important; }

.cq-tot-grid[b-rcavkev95j] { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: .35rem; }
.cq-tot-card[b-rcavkev95j] {
    flex: 1 1 180px; display: flex; flex-direction: column; gap: .15rem;
    padding: .65rem .8rem; border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .6rem; background: var(--rg-bg-subtle, #f8fafc);
}
.cq-tot-lbl[b-rcavkev95j] { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.cq-tot-val[b-rcavkev95j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code','Fira Code',monospace; }
.cq-tot-sub[b-rcavkev95j] { font-size: .74rem; color: var(--rg-text-secondary, #475569); display: flex; align-items: center; gap: .3rem; }
[data-mode="dark"] .cq-tot-card[b-rcavkev95j] { background: rgba(255,255,255,.03); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaCierreSupervisor.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-k8jb3laoe6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-k8jb3laoe6 0.3s ease-out; }
@keyframes slideUp-b-k8jb3laoe6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-k8jb3laoe6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-k8jb3laoe6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-k8jb3laoe6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-k8jb3laoe6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-k8jb3laoe6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-k8jb3laoe6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-k8jb3laoe6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-k8jb3laoe6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-k8jb3laoe6] { filter: brightness(1.1); }
.btn-outline[b-k8jb3laoe6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-k8jb3laoe6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-k8jb3laoe6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-k8jb3laoe6] { filter: brightness(1.1); }
.btn-icon[b-k8jb3laoe6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-k8jb3laoe6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-k8jb3laoe6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-k8jb3laoe6] { color: #ef4444; }
.btn-delete:hover[b-k8jb3laoe6] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-k8jb3laoe6] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-k8jb3laoe6] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-k8jb3laoe6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-k8jb3laoe6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-k8jb3laoe6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-k8jb3laoe6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-k8jb3laoe6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-k8jb3laoe6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-k8jb3laoe6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-k8jb3laoe6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-k8jb3laoe6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-k8jb3laoe6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-k8jb3laoe6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-k8jb3laoe6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-k8jb3laoe6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-k8jb3laoe6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-k8jb3laoe6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-k8jb3laoe6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-k8jb3laoe6] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-k8jb3laoe6] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-k8jb3laoe6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-k8jb3laoe6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-k8jb3laoe6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-k8jb3laoe6] { background: #f1f5f9; color: #64748b; }
.badge-info[b-k8jb3laoe6] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-k8jb3laoe6] { background: #fffbeb; color: #92400e; }
.badge-danger[b-k8jb3laoe6] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-k8jb3laoe6] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-k8jb3laoe6] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-k8jb3laoe6] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-k8jb3laoe6] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-k8jb3laoe6] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-k8jb3laoe6] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-k8jb3laoe6] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-k8jb3laoe6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-k8jb3laoe6] { text-align: center; }
.text-muted[b-k8jb3laoe6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-k8jb3laoe6], .crud-empty-state[b-k8jb3laoe6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-k8jb3laoe6] { font-size: 2rem; }
.crud-spinner[b-k8jb3laoe6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-k8jb3laoe6 0.6s linear infinite; }
.crud-spinner-sm[b-k8jb3laoe6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-k8jb3laoe6 0.6s linear infinite; }
@keyframes spin-b-k8jb3laoe6 { to { transform: rotate(360deg); } }
.spin[b-k8jb3laoe6] { animation: spin-b-k8jb3laoe6 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-k8jb3laoe6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-k8jb3laoe6 0.15s ease-out; }
.modal-container[b-k8jb3laoe6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-k8jb3laoe6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-k8jb3laoe6 0.2s ease-out; }
.modal-lg[b-k8jb3laoe6] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-k8jb3laoe6] { max-width: 420px; }
@keyframes fadeIn-b-k8jb3laoe6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-k8jb3laoe6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-k8jb3laoe6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-k8jb3laoe6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-k8jb3laoe6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-k8jb3laoe6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-k8jb3laoe6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-k8jb3laoe6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-k8jb3laoe6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-k8jb3laoe6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-k8jb3laoe6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-k8jb3laoe6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-k8jb3laoe6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-k8jb3laoe6] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-k8jb3laoe6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-k8jb3laoe6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-k8jb3laoe6] { flex: 2; }
.form-group label[b-k8jb3laoe6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-k8jb3laoe6], .form-group select[b-k8jb3laoe6], .form-textarea[b-k8jb3laoe6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-k8jb3laoe6], .form-group select:focus[b-k8jb3laoe6], .form-textarea:focus[b-k8jb3laoe6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-k8jb3laoe6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-k8jb3laoe6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-k8jb3laoe6] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-k8jb3laoe6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-k8jb3laoe6] { margin-top: 0; }
.form-section-title i[b-k8jb3laoe6] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-k8jb3laoe6] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-k8jb3laoe6] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-k8jb3laoe6] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-k8jb3laoe6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-k8jb3laoe6] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-k8jb3laoe6] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-k8jb3laoe6] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-k8jb3laoe6] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-k8jb3laoe6] { padding: 0.75rem; }
    .crud-header[b-k8jb3laoe6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-k8jb3laoe6] { font-size: 1.1rem; }
    .btn-text[b-k8jb3laoe6] { display: none; }
    .form-row[b-k8jb3laoe6] { flex-direction: column; }
    .form-row-3[b-k8jb3laoe6] { grid-template-columns: 1fr; }
    .form-row-4[b-k8jb3laoe6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-k8jb3laoe6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-k8jb3laoe6] { max-width: 98vw; width: 98vw; }
    .modal-body[b-k8jb3laoe6] { padding: 0.75rem; }
    .modal-tabs[b-k8jb3laoe6] { overflow-x: auto; }
    .modal-tab[b-k8jb3laoe6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-k8jb3laoe6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-k8jb3laoe6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-k8jb3laoe6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-k8jb3laoe6] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-k8jb3laoe6] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-k8jb3laoe6] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-k8jb3laoe6] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-k8jb3laoe6] { border-bottom: none; }
.help-section p[b-k8jb3laoe6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-k8jb3laoe6], .help-section ol[b-k8jb3laoe6] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-k8jb3laoe6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-k8jb3laoe6] { color: var(--rg-accent,#2563eb); }
.help-tip[b-k8jb3laoe6] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-k8jb3laoe6] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-k8jb3laoe6] { background: rgba(37,99,235,0.12); }
.help-table[b-k8jb3laoe6] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-k8jb3laoe6] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-k8jb3laoe6] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-k8jb3laoe6] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-k8jb3laoe6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-k8jb3laoe6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-k8jb3laoe6] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-k8jb3laoe6] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-k8jb3laoe6] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-k8jb3laoe6] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-k8jb3laoe6] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-k8jb3laoe6] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-k8jb3laoe6] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-k8jb3laoe6] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-k8jb3laoe6] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-k8jb3laoe6] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-k8jb3laoe6] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-k8jb3laoe6] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaConsolidadoEmpresa.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-ugq7li97mm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ugq7li97mm 0.3s ease-out; }
@keyframes slideUp-b-ugq7li97mm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ugq7li97mm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ugq7li97mm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ugq7li97mm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ugq7li97mm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ugq7li97mm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ugq7li97mm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ugq7li97mm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ugq7li97mm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ugq7li97mm] { filter: brightness(1.1); }
.btn-outline[b-ugq7li97mm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ugq7li97mm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ugq7li97mm] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ugq7li97mm] { filter: brightness(1.1); }
.btn-icon[b-ugq7li97mm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ugq7li97mm] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ugq7li97mm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ugq7li97mm] { color: #ef4444; }
.btn-delete:hover[b-ugq7li97mm] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-ugq7li97mm] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-ugq7li97mm] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-ugq7li97mm] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ugq7li97mm] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ugq7li97mm] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ugq7li97mm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ugq7li97mm] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ugq7li97mm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-ugq7li97mm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-ugq7li97mm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ugq7li97mm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-ugq7li97mm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-ugq7li97mm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ugq7li97mm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ugq7li97mm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ugq7li97mm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ugq7li97mm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ugq7li97mm] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ugq7li97mm] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-ugq7li97mm] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-ugq7li97mm] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-ugq7li97mm] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ugq7li97mm] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ugq7li97mm] { background: #f1f5f9; color: #64748b; }
.badge-info[b-ugq7li97mm] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-ugq7li97mm] { background: #fffbeb; color: #92400e; }
.badge-danger[b-ugq7li97mm] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-ugq7li97mm] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-ugq7li97mm] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-ugq7li97mm] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-ugq7li97mm] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-ugq7li97mm] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-ugq7li97mm] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-ugq7li97mm] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-ugq7li97mm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ugq7li97mm] { text-align: center; }
.text-muted[b-ugq7li97mm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ugq7li97mm], .crud-empty-state[b-ugq7li97mm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ugq7li97mm] { font-size: 2rem; }
.crud-spinner[b-ugq7li97mm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ugq7li97mm 0.6s linear infinite; }
.crud-spinner-sm[b-ugq7li97mm] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ugq7li97mm 0.6s linear infinite; }
@keyframes spin-b-ugq7li97mm { to { transform: rotate(360deg); } }
.spin[b-ugq7li97mm] { animation: spin-b-ugq7li97mm 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-ugq7li97mm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ugq7li97mm 0.15s ease-out; }
.modal-container[b-ugq7li97mm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ugq7li97mm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ugq7li97mm 0.2s ease-out; }
.modal-lg[b-ugq7li97mm] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-ugq7li97mm] { max-width: 420px; }
@keyframes fadeIn-b-ugq7li97mm { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ugq7li97mm { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ugq7li97mm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ugq7li97mm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ugq7li97mm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ugq7li97mm] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ugq7li97mm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ugq7li97mm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ugq7li97mm] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-ugq7li97mm] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ugq7li97mm] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ugq7li97mm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ugq7li97mm] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-ugq7li97mm] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ugq7li97mm] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ugq7li97mm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ugq7li97mm] { flex: 2; }
.form-group label[b-ugq7li97mm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ugq7li97mm], .form-group select[b-ugq7li97mm], .form-textarea[b-ugq7li97mm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ugq7li97mm], .form-group select:focus[b-ugq7li97mm], .form-textarea:focus[b-ugq7li97mm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ugq7li97mm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ugq7li97mm] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ugq7li97mm] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ugq7li97mm] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-ugq7li97mm] { margin-top: 0; }
.form-section-title i[b-ugq7li97mm] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-ugq7li97mm] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-ugq7li97mm] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-ugq7li97mm] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-ugq7li97mm] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-ugq7li97mm] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-ugq7li97mm] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-ugq7li97mm] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-ugq7li97mm] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ugq7li97mm] { padding: 0.75rem; }
    .crud-header[b-ugq7li97mm] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ugq7li97mm] { font-size: 1.1rem; }
    .btn-text[b-ugq7li97mm] { display: none; }
    .form-row[b-ugq7li97mm] { flex-direction: column; }
    .form-row-3[b-ugq7li97mm] { grid-template-columns: 1fr; }
    .form-row-4[b-ugq7li97mm] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ugq7li97mm] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ugq7li97mm] { max-width: 98vw; width: 98vw; }
    .modal-body[b-ugq7li97mm] { padding: 0.75rem; }
    .modal-tabs[b-ugq7li97mm] { overflow-x: auto; }
    .modal-tab[b-ugq7li97mm] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ugq7li97mm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ugq7li97mm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ugq7li97mm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ugq7li97mm] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-ugq7li97mm] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-ugq7li97mm] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ugq7li97mm] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-ugq7li97mm] { border-bottom: none; }
.help-section p[b-ugq7li97mm] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-ugq7li97mm], .help-section ol[b-ugq7li97mm] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ugq7li97mm] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ugq7li97mm] { color: var(--rg-accent,#2563eb); }
.help-tip[b-ugq7li97mm] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-ugq7li97mm] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-ugq7li97mm] { background: rgba(37,99,235,0.12); }
.help-table[b-ugq7li97mm] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-ugq7li97mm] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-ugq7li97mm] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-ugq7li97mm] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-ugq7li97mm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-ugq7li97mm] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-ugq7li97mm] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-ugq7li97mm] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-ugq7li97mm] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-ugq7li97mm] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-ugq7li97mm] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-ugq7li97mm] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-ugq7li97mm] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-ugq7li97mm] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-ugq7li97mm] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-ugq7li97mm] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-ugq7li97mm] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-ugq7li97mm] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaConsolidadoSucursal.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-vxfhr7vy7b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vxfhr7vy7b 0.3s ease-out; }
@keyframes slideUp-b-vxfhr7vy7b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vxfhr7vy7b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vxfhr7vy7b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vxfhr7vy7b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vxfhr7vy7b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vxfhr7vy7b] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vxfhr7vy7b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vxfhr7vy7b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vxfhr7vy7b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vxfhr7vy7b] { filter: brightness(1.1); }
.btn-outline[b-vxfhr7vy7b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vxfhr7vy7b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vxfhr7vy7b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vxfhr7vy7b] { filter: brightness(1.1); }
.btn-icon[b-vxfhr7vy7b] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vxfhr7vy7b] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vxfhr7vy7b] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vxfhr7vy7b] { color: #ef4444; }
.btn-delete:hover[b-vxfhr7vy7b] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-vxfhr7vy7b] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-vxfhr7vy7b] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-vxfhr7vy7b] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vxfhr7vy7b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vxfhr7vy7b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vxfhr7vy7b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vxfhr7vy7b] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vxfhr7vy7b] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-vxfhr7vy7b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-vxfhr7vy7b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vxfhr7vy7b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-vxfhr7vy7b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-vxfhr7vy7b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vxfhr7vy7b] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vxfhr7vy7b] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vxfhr7vy7b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vxfhr7vy7b] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vxfhr7vy7b] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vxfhr7vy7b] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-vxfhr7vy7b] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-vxfhr7vy7b] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-vxfhr7vy7b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vxfhr7vy7b] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vxfhr7vy7b] { background: #f1f5f9; color: #64748b; }
.badge-info[b-vxfhr7vy7b] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-vxfhr7vy7b] { background: #fffbeb; color: #92400e; }
.badge-danger[b-vxfhr7vy7b] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-vxfhr7vy7b] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-vxfhr7vy7b] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-vxfhr7vy7b] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-vxfhr7vy7b] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-vxfhr7vy7b] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-vxfhr7vy7b] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-vxfhr7vy7b] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-vxfhr7vy7b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vxfhr7vy7b] { text-align: center; }
.text-muted[b-vxfhr7vy7b] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vxfhr7vy7b], .crud-empty-state[b-vxfhr7vy7b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vxfhr7vy7b] { font-size: 2rem; }
.crud-spinner[b-vxfhr7vy7b] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vxfhr7vy7b 0.6s linear infinite; }
.crud-spinner-sm[b-vxfhr7vy7b] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vxfhr7vy7b 0.6s linear infinite; }
@keyframes spin-b-vxfhr7vy7b { to { transform: rotate(360deg); } }
.spin[b-vxfhr7vy7b] { animation: spin-b-vxfhr7vy7b 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-vxfhr7vy7b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vxfhr7vy7b 0.15s ease-out; }
.modal-container[b-vxfhr7vy7b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vxfhr7vy7b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vxfhr7vy7b 0.2s ease-out; }
.modal-lg[b-vxfhr7vy7b] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-vxfhr7vy7b] { max-width: 420px; }
@keyframes fadeIn-b-vxfhr7vy7b { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vxfhr7vy7b { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vxfhr7vy7b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vxfhr7vy7b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-vxfhr7vy7b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vxfhr7vy7b] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vxfhr7vy7b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vxfhr7vy7b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vxfhr7vy7b] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-vxfhr7vy7b] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vxfhr7vy7b] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vxfhr7vy7b] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vxfhr7vy7b] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-vxfhr7vy7b] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vxfhr7vy7b] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vxfhr7vy7b] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vxfhr7vy7b] { flex: 2; }
.form-group label[b-vxfhr7vy7b] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vxfhr7vy7b], .form-group select[b-vxfhr7vy7b], .form-textarea[b-vxfhr7vy7b] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vxfhr7vy7b], .form-group select:focus[b-vxfhr7vy7b], .form-textarea:focus[b-vxfhr7vy7b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vxfhr7vy7b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vxfhr7vy7b] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vxfhr7vy7b] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vxfhr7vy7b] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-vxfhr7vy7b] { margin-top: 0; }
.form-section-title i[b-vxfhr7vy7b] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-vxfhr7vy7b] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-vxfhr7vy7b] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-vxfhr7vy7b] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-vxfhr7vy7b] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-vxfhr7vy7b] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-vxfhr7vy7b] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-vxfhr7vy7b] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-vxfhr7vy7b] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vxfhr7vy7b] { padding: 0.75rem; }
    .crud-header[b-vxfhr7vy7b] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vxfhr7vy7b] { font-size: 1.1rem; }
    .btn-text[b-vxfhr7vy7b] { display: none; }
    .form-row[b-vxfhr7vy7b] { flex-direction: column; }
    .form-row-3[b-vxfhr7vy7b] { grid-template-columns: 1fr; }
    .form-row-4[b-vxfhr7vy7b] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vxfhr7vy7b] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vxfhr7vy7b] { max-width: 98vw; width: 98vw; }
    .modal-body[b-vxfhr7vy7b] { padding: 0.75rem; }
    .modal-tabs[b-vxfhr7vy7b] { overflow-x: auto; }
    .modal-tab[b-vxfhr7vy7b] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-vxfhr7vy7b] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vxfhr7vy7b] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vxfhr7vy7b] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vxfhr7vy7b] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-vxfhr7vy7b] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-vxfhr7vy7b] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-vxfhr7vy7b] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-vxfhr7vy7b] { border-bottom: none; }
.help-section p[b-vxfhr7vy7b] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-vxfhr7vy7b], .help-section ol[b-vxfhr7vy7b] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-vxfhr7vy7b] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-vxfhr7vy7b] { color: var(--rg-accent,#2563eb); }
.help-tip[b-vxfhr7vy7b] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-vxfhr7vy7b] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-vxfhr7vy7b] { background: rgba(37,99,235,0.12); }
.help-table[b-vxfhr7vy7b] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-vxfhr7vy7b] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-vxfhr7vy7b] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-vxfhr7vy7b] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-vxfhr7vy7b] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-vxfhr7vy7b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-vxfhr7vy7b] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-vxfhr7vy7b] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-vxfhr7vy7b] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-vxfhr7vy7b] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-vxfhr7vy7b] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-vxfhr7vy7b] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-vxfhr7vy7b] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-vxfhr7vy7b] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-vxfhr7vy7b] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-vxfhr7vy7b] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-vxfhr7vy7b] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-vxfhr7vy7b] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaDashboard.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-62wxbwvg7w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-62wxbwvg7w 0.3s ease-out; }
@keyframes slideUp-b-62wxbwvg7w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-62wxbwvg7w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-62wxbwvg7w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-62wxbwvg7w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-62wxbwvg7w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-62wxbwvg7w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-62wxbwvg7w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-62wxbwvg7w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-62wxbwvg7w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-62wxbwvg7w] { filter: brightness(1.1); }
.btn-outline[b-62wxbwvg7w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-62wxbwvg7w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-62wxbwvg7w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-62wxbwvg7w] { filter: brightness(1.1); }
.btn-icon[b-62wxbwvg7w] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-62wxbwvg7w] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-62wxbwvg7w] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-62wxbwvg7w] { color: #ef4444; }
.btn-delete:hover[b-62wxbwvg7w] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-62wxbwvg7w] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-62wxbwvg7w] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-62wxbwvg7w] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-62wxbwvg7w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-62wxbwvg7w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-62wxbwvg7w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-62wxbwvg7w] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-62wxbwvg7w] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-62wxbwvg7w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-62wxbwvg7w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-62wxbwvg7w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-62wxbwvg7w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-62wxbwvg7w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-62wxbwvg7w] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-62wxbwvg7w] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-62wxbwvg7w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-62wxbwvg7w] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-62wxbwvg7w] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-62wxbwvg7w] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-62wxbwvg7w] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-62wxbwvg7w] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-62wxbwvg7w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-62wxbwvg7w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-62wxbwvg7w] { background: #f1f5f9; color: #64748b; }
.badge-info[b-62wxbwvg7w] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-62wxbwvg7w] { background: #fffbeb; color: #92400e; }
.badge-danger[b-62wxbwvg7w] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-62wxbwvg7w] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-62wxbwvg7w] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-62wxbwvg7w] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-62wxbwvg7w] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-62wxbwvg7w] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-62wxbwvg7w] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-62wxbwvg7w] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-62wxbwvg7w] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-62wxbwvg7w] { text-align: center; }
.text-muted[b-62wxbwvg7w] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-62wxbwvg7w], .crud-empty-state[b-62wxbwvg7w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-62wxbwvg7w] { font-size: 2rem; }
.crud-spinner[b-62wxbwvg7w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-62wxbwvg7w 0.6s linear infinite; }
.crud-spinner-sm[b-62wxbwvg7w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-62wxbwvg7w 0.6s linear infinite; }
@keyframes spin-b-62wxbwvg7w { to { transform: rotate(360deg); } }
.spin[b-62wxbwvg7w] { animation: spin-b-62wxbwvg7w 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-62wxbwvg7w] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-62wxbwvg7w 0.15s ease-out; }
.modal-container[b-62wxbwvg7w] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-62wxbwvg7w] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-62wxbwvg7w 0.2s ease-out; }
.modal-lg[b-62wxbwvg7w] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-62wxbwvg7w] { max-width: 420px; }
@keyframes fadeIn-b-62wxbwvg7w { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-62wxbwvg7w { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-62wxbwvg7w] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-62wxbwvg7w] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-62wxbwvg7w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-62wxbwvg7w] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-62wxbwvg7w] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-62wxbwvg7w] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-62wxbwvg7w] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-62wxbwvg7w] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-62wxbwvg7w] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-62wxbwvg7w] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-62wxbwvg7w] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-62wxbwvg7w] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-62wxbwvg7w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-62wxbwvg7w] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-62wxbwvg7w] { flex: 2; }
.form-group label[b-62wxbwvg7w] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-62wxbwvg7w], .form-group select[b-62wxbwvg7w], .form-textarea[b-62wxbwvg7w] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-62wxbwvg7w], .form-group select:focus[b-62wxbwvg7w], .form-textarea:focus[b-62wxbwvg7w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-62wxbwvg7w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-62wxbwvg7w] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-62wxbwvg7w] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-62wxbwvg7w] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-62wxbwvg7w] { margin-top: 0; }
.form-section-title i[b-62wxbwvg7w] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-62wxbwvg7w] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-62wxbwvg7w] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-62wxbwvg7w] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-62wxbwvg7w] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-62wxbwvg7w] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-62wxbwvg7w] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-62wxbwvg7w] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-62wxbwvg7w] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-62wxbwvg7w] { padding: 0.75rem; }
    .crud-header[b-62wxbwvg7w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-62wxbwvg7w] { font-size: 1.1rem; }
    .btn-text[b-62wxbwvg7w] { display: none; }
    .form-row[b-62wxbwvg7w] { flex-direction: column; }
    .form-row-3[b-62wxbwvg7w] { grid-template-columns: 1fr; }
    .form-row-4[b-62wxbwvg7w] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-62wxbwvg7w] { width: 98%; max-height: 95vh; }
    .modal-lg[b-62wxbwvg7w] { max-width: 98vw; width: 98vw; }
    .modal-body[b-62wxbwvg7w] { padding: 0.75rem; }
    .modal-tabs[b-62wxbwvg7w] { overflow-x: auto; }
    .modal-tab[b-62wxbwvg7w] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-62wxbwvg7w] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-62wxbwvg7w] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-62wxbwvg7w] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-62wxbwvg7w] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-62wxbwvg7w] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-62wxbwvg7w] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-62wxbwvg7w] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-62wxbwvg7w] { border-bottom: none; }
.help-section p[b-62wxbwvg7w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-62wxbwvg7w], .help-section ol[b-62wxbwvg7w] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-62wxbwvg7w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-62wxbwvg7w] { color: var(--rg-accent,#2563eb); }
.help-tip[b-62wxbwvg7w] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-62wxbwvg7w] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-62wxbwvg7w] { background: rgba(37,99,235,0.12); }
.help-table[b-62wxbwvg7w] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-62wxbwvg7w] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-62wxbwvg7w] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-62wxbwvg7w] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-62wxbwvg7w] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-62wxbwvg7w] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-62wxbwvg7w] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-62wxbwvg7w] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-62wxbwvg7w] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-62wxbwvg7w] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-62wxbwvg7w] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-62wxbwvg7w] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-62wxbwvg7w] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-62wxbwvg7w] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-62wxbwvg7w] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-62wxbwvg7w] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-62wxbwvg7w] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-62wxbwvg7w] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaDenominaciones.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-1tkl5miyrk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1tkl5miyrk 0.3s ease-out; }
@keyframes slideUp-b-1tkl5miyrk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1tkl5miyrk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1tkl5miyrk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1tkl5miyrk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1tkl5miyrk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1tkl5miyrk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1tkl5miyrk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1tkl5miyrk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1tkl5miyrk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1tkl5miyrk] { filter: brightness(1.1); }
.btn-outline[b-1tkl5miyrk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1tkl5miyrk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1tkl5miyrk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1tkl5miyrk] { filter: brightness(1.1); }
.btn-icon[b-1tkl5miyrk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1tkl5miyrk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1tkl5miyrk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1tkl5miyrk] { color: #ef4444; }
.btn-delete:hover[b-1tkl5miyrk] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-1tkl5miyrk] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-1tkl5miyrk] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-1tkl5miyrk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1tkl5miyrk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1tkl5miyrk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1tkl5miyrk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1tkl5miyrk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1tkl5miyrk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-1tkl5miyrk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-1tkl5miyrk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1tkl5miyrk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-1tkl5miyrk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-1tkl5miyrk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1tkl5miyrk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1tkl5miyrk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1tkl5miyrk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1tkl5miyrk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1tkl5miyrk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1tkl5miyrk] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-1tkl5miyrk] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-1tkl5miyrk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-1tkl5miyrk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1tkl5miyrk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1tkl5miyrk] { background: #f1f5f9; color: #64748b; }
.badge-info[b-1tkl5miyrk] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-1tkl5miyrk] { background: #fffbeb; color: #92400e; }
.badge-danger[b-1tkl5miyrk] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-1tkl5miyrk] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-1tkl5miyrk] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-1tkl5miyrk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-1tkl5miyrk] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-1tkl5miyrk] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-1tkl5miyrk] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-1tkl5miyrk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-1tkl5miyrk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1tkl5miyrk] { text-align: center; }
.text-muted[b-1tkl5miyrk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1tkl5miyrk], .crud-empty-state[b-1tkl5miyrk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1tkl5miyrk] { font-size: 2rem; }
.crud-spinner[b-1tkl5miyrk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1tkl5miyrk 0.6s linear infinite; }
.crud-spinner-sm[b-1tkl5miyrk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1tkl5miyrk 0.6s linear infinite; }
@keyframes spin-b-1tkl5miyrk { to { transform: rotate(360deg); } }
.spin[b-1tkl5miyrk] { animation: spin-b-1tkl5miyrk 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-1tkl5miyrk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1tkl5miyrk 0.15s ease-out; }
.modal-container[b-1tkl5miyrk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1tkl5miyrk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1tkl5miyrk 0.2s ease-out; }
.modal-lg[b-1tkl5miyrk] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-1tkl5miyrk] { max-width: 420px; }
@keyframes fadeIn-b-1tkl5miyrk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1tkl5miyrk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1tkl5miyrk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1tkl5miyrk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-1tkl5miyrk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1tkl5miyrk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1tkl5miyrk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1tkl5miyrk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1tkl5miyrk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-1tkl5miyrk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1tkl5miyrk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1tkl5miyrk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1tkl5miyrk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-1tkl5miyrk] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1tkl5miyrk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1tkl5miyrk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1tkl5miyrk] { flex: 2; }
.form-group label[b-1tkl5miyrk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1tkl5miyrk], .form-group select[b-1tkl5miyrk], .form-textarea[b-1tkl5miyrk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1tkl5miyrk], .form-group select:focus[b-1tkl5miyrk], .form-textarea:focus[b-1tkl5miyrk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1tkl5miyrk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1tkl5miyrk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1tkl5miyrk] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1tkl5miyrk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-1tkl5miyrk] { margin-top: 0; }
.form-section-title i[b-1tkl5miyrk] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-1tkl5miyrk] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-1tkl5miyrk] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-1tkl5miyrk] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-1tkl5miyrk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-1tkl5miyrk] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-1tkl5miyrk] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-1tkl5miyrk] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-1tkl5miyrk] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1tkl5miyrk] { padding: 0.75rem; }
    .crud-header[b-1tkl5miyrk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1tkl5miyrk] { font-size: 1.1rem; }
    .btn-text[b-1tkl5miyrk] { display: none; }
    .form-row[b-1tkl5miyrk] { flex-direction: column; }
    .form-row-3[b-1tkl5miyrk] { grid-template-columns: 1fr; }
    .form-row-4[b-1tkl5miyrk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1tkl5miyrk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1tkl5miyrk] { max-width: 98vw; width: 98vw; }
    .modal-body[b-1tkl5miyrk] { padding: 0.75rem; }
    .modal-tabs[b-1tkl5miyrk] { overflow-x: auto; }
    .modal-tab[b-1tkl5miyrk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1tkl5miyrk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1tkl5miyrk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1tkl5miyrk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1tkl5miyrk] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-1tkl5miyrk] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-1tkl5miyrk] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-1tkl5miyrk] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-1tkl5miyrk] { border-bottom: none; }
.help-section p[b-1tkl5miyrk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-1tkl5miyrk], .help-section ol[b-1tkl5miyrk] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-1tkl5miyrk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-1tkl5miyrk] { color: var(--rg-accent,#2563eb); }
.help-tip[b-1tkl5miyrk] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-1tkl5miyrk] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-1tkl5miyrk] { background: rgba(37,99,235,0.12); }
.help-table[b-1tkl5miyrk] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-1tkl5miyrk] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-1tkl5miyrk] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-1tkl5miyrk] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-1tkl5miyrk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1tkl5miyrk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1tkl5miyrk] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-1tkl5miyrk] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-1tkl5miyrk] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-1tkl5miyrk] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-1tkl5miyrk] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-1tkl5miyrk] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-1tkl5miyrk] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-1tkl5miyrk] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-1tkl5miyrk] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-1tkl5miyrk] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-1tkl5miyrk] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-1tkl5miyrk] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaHistorialAsignaciones.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-d9ltpv23zs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-d9ltpv23zs 0.3s ease-out; }
@keyframes slideUp-b-d9ltpv23zs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-d9ltpv23zs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-d9ltpv23zs] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-d9ltpv23zs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-d9ltpv23zs] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-d9ltpv23zs] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-d9ltpv23zs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-d9ltpv23zs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-d9ltpv23zs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-d9ltpv23zs] { filter: brightness(1.1); }
.btn-outline[b-d9ltpv23zs] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-d9ltpv23zs] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-d9ltpv23zs] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-d9ltpv23zs] { filter: brightness(1.1); }
.btn-icon[b-d9ltpv23zs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-d9ltpv23zs] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-d9ltpv23zs] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-d9ltpv23zs] { color: #ef4444; }
.btn-delete:hover[b-d9ltpv23zs] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-d9ltpv23zs] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-d9ltpv23zs] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-d9ltpv23zs] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-d9ltpv23zs] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-d9ltpv23zs] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-d9ltpv23zs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-d9ltpv23zs] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-d9ltpv23zs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-d9ltpv23zs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-d9ltpv23zs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-d9ltpv23zs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-d9ltpv23zs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-d9ltpv23zs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-d9ltpv23zs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-d9ltpv23zs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-d9ltpv23zs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-d9ltpv23zs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-d9ltpv23zs] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-d9ltpv23zs] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-d9ltpv23zs] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-d9ltpv23zs] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-d9ltpv23zs] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-d9ltpv23zs] { background: #ecfdf5; color: #065f46; }
.badge-no[b-d9ltpv23zs] { background: #f1f5f9; color: #64748b; }
.badge-info[b-d9ltpv23zs] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-d9ltpv23zs] { background: #fffbeb; color: #92400e; }
.badge-danger[b-d9ltpv23zs] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-d9ltpv23zs] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-d9ltpv23zs] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-d9ltpv23zs] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-d9ltpv23zs] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-d9ltpv23zs] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-d9ltpv23zs] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-d9ltpv23zs] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-d9ltpv23zs] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-d9ltpv23zs] { text-align: center; }
.text-muted[b-d9ltpv23zs] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-d9ltpv23zs], .crud-empty-state[b-d9ltpv23zs] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-d9ltpv23zs] { font-size: 2rem; }
.crud-spinner[b-d9ltpv23zs] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-d9ltpv23zs 0.6s linear infinite; }
.crud-spinner-sm[b-d9ltpv23zs] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-d9ltpv23zs 0.6s linear infinite; }
@keyframes spin-b-d9ltpv23zs { to { transform: rotate(360deg); } }
.spin[b-d9ltpv23zs] { animation: spin-b-d9ltpv23zs 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-d9ltpv23zs] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-d9ltpv23zs 0.15s ease-out; }
.modal-container[b-d9ltpv23zs] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-d9ltpv23zs] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-d9ltpv23zs 0.2s ease-out; }
.modal-lg[b-d9ltpv23zs] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-d9ltpv23zs] { max-width: 420px; }
@keyframes fadeIn-b-d9ltpv23zs { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-d9ltpv23zs { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-d9ltpv23zs] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-d9ltpv23zs] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-d9ltpv23zs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-d9ltpv23zs] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-d9ltpv23zs] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-d9ltpv23zs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-d9ltpv23zs] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-d9ltpv23zs] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-d9ltpv23zs] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-d9ltpv23zs] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-d9ltpv23zs] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-d9ltpv23zs] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-d9ltpv23zs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-d9ltpv23zs] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-d9ltpv23zs] { flex: 2; }
.form-group label[b-d9ltpv23zs] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-d9ltpv23zs], .form-group select[b-d9ltpv23zs], .form-textarea[b-d9ltpv23zs] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-d9ltpv23zs], .form-group select:focus[b-d9ltpv23zs], .form-textarea:focus[b-d9ltpv23zs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-d9ltpv23zs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-d9ltpv23zs] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-d9ltpv23zs] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-d9ltpv23zs] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-d9ltpv23zs] { margin-top: 0; }
.form-section-title i[b-d9ltpv23zs] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-d9ltpv23zs] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-d9ltpv23zs] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-d9ltpv23zs] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-d9ltpv23zs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-d9ltpv23zs] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-d9ltpv23zs] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-d9ltpv23zs] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-d9ltpv23zs] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-d9ltpv23zs] { padding: 0.75rem; }
    .crud-header[b-d9ltpv23zs] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-d9ltpv23zs] { font-size: 1.1rem; }
    .btn-text[b-d9ltpv23zs] { display: none; }
    .form-row[b-d9ltpv23zs] { flex-direction: column; }
    .form-row-3[b-d9ltpv23zs] { grid-template-columns: 1fr; }
    .form-row-4[b-d9ltpv23zs] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-d9ltpv23zs] { width: 98%; max-height: 95vh; }
    .modal-lg[b-d9ltpv23zs] { max-width: 98vw; width: 98vw; }
    .modal-body[b-d9ltpv23zs] { padding: 0.75rem; }
    .modal-tabs[b-d9ltpv23zs] { overflow-x: auto; }
    .modal-tab[b-d9ltpv23zs] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-d9ltpv23zs] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-d9ltpv23zs] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-d9ltpv23zs] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-d9ltpv23zs] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-d9ltpv23zs] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-d9ltpv23zs] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-d9ltpv23zs] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-d9ltpv23zs] { border-bottom: none; }
.help-section p[b-d9ltpv23zs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-d9ltpv23zs], .help-section ol[b-d9ltpv23zs] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-d9ltpv23zs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-d9ltpv23zs] { color: var(--rg-accent,#2563eb); }
.help-tip[b-d9ltpv23zs] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-d9ltpv23zs] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-d9ltpv23zs] { background: rgba(37,99,235,0.12); }
.help-table[b-d9ltpv23zs] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-d9ltpv23zs] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-d9ltpv23zs] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-d9ltpv23zs] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-d9ltpv23zs] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-d9ltpv23zs] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-d9ltpv23zs] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-d9ltpv23zs] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-d9ltpv23zs] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-d9ltpv23zs] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-d9ltpv23zs] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-d9ltpv23zs] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-d9ltpv23zs] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-d9ltpv23zs] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-d9ltpv23zs] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-d9ltpv23zs] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-d9ltpv23zs] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-d9ltpv23zs] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaKardex.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-dlebdx2fmi] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-dlebdx2fmi 0.3s ease-out; }
@keyframes slideUp-b-dlebdx2fmi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-dlebdx2fmi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dlebdx2fmi] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-dlebdx2fmi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-dlebdx2fmi] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-dlebdx2fmi] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-dlebdx2fmi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dlebdx2fmi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dlebdx2fmi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dlebdx2fmi] { filter: brightness(1.1); }
.btn-outline[b-dlebdx2fmi] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dlebdx2fmi] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dlebdx2fmi] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dlebdx2fmi] { filter: brightness(1.1); }
.btn-icon[b-dlebdx2fmi] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-dlebdx2fmi] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-dlebdx2fmi] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-dlebdx2fmi] { color: #ef4444; }
.btn-delete:hover[b-dlebdx2fmi] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-dlebdx2fmi] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-dlebdx2fmi] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-dlebdx2fmi] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-dlebdx2fmi] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-dlebdx2fmi] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-dlebdx2fmi] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-dlebdx2fmi] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-dlebdx2fmi] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-dlebdx2fmi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-dlebdx2fmi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-dlebdx2fmi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-dlebdx2fmi] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-dlebdx2fmi] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-dlebdx2fmi] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-dlebdx2fmi] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dlebdx2fmi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-dlebdx2fmi] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-dlebdx2fmi] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-dlebdx2fmi] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-dlebdx2fmi] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-dlebdx2fmi] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-dlebdx2fmi] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-dlebdx2fmi] { background: #ecfdf5; color: #065f46; }
.badge-no[b-dlebdx2fmi] { background: #f1f5f9; color: #64748b; }
.badge-info[b-dlebdx2fmi] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-dlebdx2fmi] { background: #fffbeb; color: #92400e; }
.badge-danger[b-dlebdx2fmi] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-dlebdx2fmi] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-dlebdx2fmi] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-dlebdx2fmi] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-dlebdx2fmi] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-dlebdx2fmi] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-dlebdx2fmi] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-dlebdx2fmi] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-dlebdx2fmi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-dlebdx2fmi] { text-align: center; }
.text-muted[b-dlebdx2fmi] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-dlebdx2fmi], .crud-empty-state[b-dlebdx2fmi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-dlebdx2fmi] { font-size: 2rem; }
.crud-spinner[b-dlebdx2fmi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-dlebdx2fmi 0.6s linear infinite; }
.crud-spinner-sm[b-dlebdx2fmi] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-dlebdx2fmi 0.6s linear infinite; }
@keyframes spin-b-dlebdx2fmi { to { transform: rotate(360deg); } }
.spin[b-dlebdx2fmi] { animation: spin-b-dlebdx2fmi 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-dlebdx2fmi] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-dlebdx2fmi 0.15s ease-out; }
.modal-container[b-dlebdx2fmi] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-dlebdx2fmi] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-dlebdx2fmi 0.2s ease-out; }
.modal-lg[b-dlebdx2fmi] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-dlebdx2fmi] { max-width: 420px; }
@keyframes fadeIn-b-dlebdx2fmi { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-dlebdx2fmi { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-dlebdx2fmi] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-dlebdx2fmi] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-dlebdx2fmi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-dlebdx2fmi] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-dlebdx2fmi] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-dlebdx2fmi] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-dlebdx2fmi] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-dlebdx2fmi] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-dlebdx2fmi] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-dlebdx2fmi] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-dlebdx2fmi] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-dlebdx2fmi] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-dlebdx2fmi] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dlebdx2fmi] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-dlebdx2fmi] { flex: 2; }
.form-group label[b-dlebdx2fmi] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dlebdx2fmi], .form-group select[b-dlebdx2fmi], .form-textarea[b-dlebdx2fmi] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-dlebdx2fmi], .form-group select:focus[b-dlebdx2fmi], .form-textarea:focus[b-dlebdx2fmi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-dlebdx2fmi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-dlebdx2fmi] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-dlebdx2fmi] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-dlebdx2fmi] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-dlebdx2fmi] { margin-top: 0; }
.form-section-title i[b-dlebdx2fmi] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-dlebdx2fmi] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-dlebdx2fmi] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-dlebdx2fmi] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-dlebdx2fmi] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-dlebdx2fmi] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-dlebdx2fmi] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-dlebdx2fmi] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-dlebdx2fmi] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-dlebdx2fmi] { padding: 0.75rem; }
    .crud-header[b-dlebdx2fmi] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-dlebdx2fmi] { font-size: 1.1rem; }
    .btn-text[b-dlebdx2fmi] { display: none; }
    .form-row[b-dlebdx2fmi] { flex-direction: column; }
    .form-row-3[b-dlebdx2fmi] { grid-template-columns: 1fr; }
    .form-row-4[b-dlebdx2fmi] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-dlebdx2fmi] { width: 98%; max-height: 95vh; }
    .modal-lg[b-dlebdx2fmi] { max-width: 98vw; width: 98vw; }
    .modal-body[b-dlebdx2fmi] { padding: 0.75rem; }
    .modal-tabs[b-dlebdx2fmi] { overflow-x: auto; }
    .modal-tab[b-dlebdx2fmi] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-dlebdx2fmi] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-dlebdx2fmi] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-dlebdx2fmi] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-dlebdx2fmi] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-dlebdx2fmi] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-dlebdx2fmi] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-dlebdx2fmi] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-dlebdx2fmi] { border-bottom: none; }
.help-section p[b-dlebdx2fmi] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-dlebdx2fmi], .help-section ol[b-dlebdx2fmi] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-dlebdx2fmi] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-dlebdx2fmi] { color: var(--rg-accent,#2563eb); }
.help-tip[b-dlebdx2fmi] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-dlebdx2fmi] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-dlebdx2fmi] { background: rgba(37,99,235,0.12); }
.help-table[b-dlebdx2fmi] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-dlebdx2fmi] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-dlebdx2fmi] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-dlebdx2fmi] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-dlebdx2fmi] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-dlebdx2fmi] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-dlebdx2fmi] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-dlebdx2fmi] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-dlebdx2fmi] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-dlebdx2fmi] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-dlebdx2fmi] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-dlebdx2fmi] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-dlebdx2fmi] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-dlebdx2fmi] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-dlebdx2fmi] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-dlebdx2fmi] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-dlebdx2fmi] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-dlebdx2fmi] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaMaestra.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-7ukhbzi2wz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7ukhbzi2wz 0.3s ease-out; }
@keyframes slideUp-b-7ukhbzi2wz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7ukhbzi2wz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7ukhbzi2wz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7ukhbzi2wz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7ukhbzi2wz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7ukhbzi2wz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7ukhbzi2wz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7ukhbzi2wz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7ukhbzi2wz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7ukhbzi2wz] { filter: brightness(1.1); }
.btn-outline[b-7ukhbzi2wz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7ukhbzi2wz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7ukhbzi2wz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7ukhbzi2wz] { filter: brightness(1.1); }
.btn-icon[b-7ukhbzi2wz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7ukhbzi2wz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7ukhbzi2wz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7ukhbzi2wz] { color: #ef4444; }
.btn-delete:hover[b-7ukhbzi2wz] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-7ukhbzi2wz] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-7ukhbzi2wz] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-7ukhbzi2wz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7ukhbzi2wz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7ukhbzi2wz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7ukhbzi2wz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7ukhbzi2wz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7ukhbzi2wz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-7ukhbzi2wz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-7ukhbzi2wz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7ukhbzi2wz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-7ukhbzi2wz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-7ukhbzi2wz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7ukhbzi2wz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7ukhbzi2wz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7ukhbzi2wz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7ukhbzi2wz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7ukhbzi2wz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7ukhbzi2wz] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-7ukhbzi2wz] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-7ukhbzi2wz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-7ukhbzi2wz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7ukhbzi2wz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7ukhbzi2wz] { background: #f1f5f9; color: #64748b; }
.badge-info[b-7ukhbzi2wz] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-7ukhbzi2wz] { background: #fffbeb; color: #92400e; }
.badge-danger[b-7ukhbzi2wz] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-7ukhbzi2wz] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-7ukhbzi2wz] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-7ukhbzi2wz] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-7ukhbzi2wz] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-7ukhbzi2wz] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-7ukhbzi2wz] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-7ukhbzi2wz] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-7ukhbzi2wz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7ukhbzi2wz] { text-align: center; }
.text-muted[b-7ukhbzi2wz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7ukhbzi2wz], .crud-empty-state[b-7ukhbzi2wz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7ukhbzi2wz] { font-size: 2rem; }
.crud-spinner[b-7ukhbzi2wz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7ukhbzi2wz 0.6s linear infinite; }
.crud-spinner-sm[b-7ukhbzi2wz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7ukhbzi2wz 0.6s linear infinite; }
@keyframes spin-b-7ukhbzi2wz { to { transform: rotate(360deg); } }
.spin[b-7ukhbzi2wz] { animation: spin-b-7ukhbzi2wz 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7ukhbzi2wz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7ukhbzi2wz 0.15s ease-out; }
.modal-container[b-7ukhbzi2wz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7ukhbzi2wz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7ukhbzi2wz 0.2s ease-out; }
.modal-lg[b-7ukhbzi2wz] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-7ukhbzi2wz] { max-width: 420px; }
@keyframes fadeIn-b-7ukhbzi2wz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7ukhbzi2wz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7ukhbzi2wz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7ukhbzi2wz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7ukhbzi2wz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7ukhbzi2wz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7ukhbzi2wz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7ukhbzi2wz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7ukhbzi2wz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-7ukhbzi2wz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7ukhbzi2wz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7ukhbzi2wz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7ukhbzi2wz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-7ukhbzi2wz] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7ukhbzi2wz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7ukhbzi2wz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7ukhbzi2wz] { flex: 2; }
.form-group label[b-7ukhbzi2wz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7ukhbzi2wz], .form-group select[b-7ukhbzi2wz], .form-textarea[b-7ukhbzi2wz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7ukhbzi2wz], .form-group select:focus[b-7ukhbzi2wz], .form-textarea:focus[b-7ukhbzi2wz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7ukhbzi2wz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7ukhbzi2wz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7ukhbzi2wz] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7ukhbzi2wz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-7ukhbzi2wz] { margin-top: 0; }
.form-section-title i[b-7ukhbzi2wz] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-7ukhbzi2wz] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-7ukhbzi2wz] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-7ukhbzi2wz] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-7ukhbzi2wz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-7ukhbzi2wz] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-7ukhbzi2wz] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-7ukhbzi2wz] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-7ukhbzi2wz] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7ukhbzi2wz] { padding: 0.75rem; }
    .crud-header[b-7ukhbzi2wz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7ukhbzi2wz] { font-size: 1.1rem; }
    .btn-text[b-7ukhbzi2wz] { display: none; }
    .form-row[b-7ukhbzi2wz] { flex-direction: column; }
    .form-row-3[b-7ukhbzi2wz] { grid-template-columns: 1fr; }
    .form-row-4[b-7ukhbzi2wz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7ukhbzi2wz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7ukhbzi2wz] { max-width: 98vw; width: 98vw; }
    .modal-body[b-7ukhbzi2wz] { padding: 0.75rem; }
    .modal-tabs[b-7ukhbzi2wz] { overflow-x: auto; }
    .modal-tab[b-7ukhbzi2wz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-7ukhbzi2wz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7ukhbzi2wz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7ukhbzi2wz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7ukhbzi2wz] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-7ukhbzi2wz] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7ukhbzi2wz] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7ukhbzi2wz] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7ukhbzi2wz] { border-bottom: none; }
.help-section p[b-7ukhbzi2wz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-7ukhbzi2wz], .help-section ol[b-7ukhbzi2wz] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-7ukhbzi2wz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7ukhbzi2wz] { color: var(--rg-accent,#2563eb); }
.help-tip[b-7ukhbzi2wz] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7ukhbzi2wz] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7ukhbzi2wz] { background: rgba(37,99,235,0.12); }
.help-table[b-7ukhbzi2wz] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-7ukhbzi2wz] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-7ukhbzi2wz] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-7ukhbzi2wz] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-7ukhbzi2wz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-7ukhbzi2wz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-7ukhbzi2wz] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-7ukhbzi2wz] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-7ukhbzi2wz] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-7ukhbzi2wz] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-7ukhbzi2wz] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-7ukhbzi2wz] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-7ukhbzi2wz] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-7ukhbzi2wz] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-7ukhbzi2wz] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-7ukhbzi2wz] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-7ukhbzi2wz] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-7ukhbzi2wz] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaMisCajas.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-g0t1gv9u6b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-g0t1gv9u6b 0.3s ease-out; }
@keyframes slideUp-b-g0t1gv9u6b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-g0t1gv9u6b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-g0t1gv9u6b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-g0t1gv9u6b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-g0t1gv9u6b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-g0t1gv9u6b] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-g0t1gv9u6b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-g0t1gv9u6b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-g0t1gv9u6b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-g0t1gv9u6b] { filter: brightness(1.1); }
.btn-outline[b-g0t1gv9u6b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-g0t1gv9u6b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-g0t1gv9u6b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-g0t1gv9u6b] { filter: brightness(1.1); }
.btn-icon[b-g0t1gv9u6b] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-g0t1gv9u6b] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-g0t1gv9u6b] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-g0t1gv9u6b] { color: #ef4444; }
.btn-delete:hover[b-g0t1gv9u6b] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-g0t1gv9u6b] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-g0t1gv9u6b] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-g0t1gv9u6b] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-g0t1gv9u6b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-g0t1gv9u6b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-g0t1gv9u6b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-g0t1gv9u6b] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-g0t1gv9u6b] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-g0t1gv9u6b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-g0t1gv9u6b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-g0t1gv9u6b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-g0t1gv9u6b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-g0t1gv9u6b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-g0t1gv9u6b] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-g0t1gv9u6b] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-g0t1gv9u6b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-g0t1gv9u6b] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-g0t1gv9u6b] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-g0t1gv9u6b] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-g0t1gv9u6b] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-g0t1gv9u6b] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-g0t1gv9u6b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-g0t1gv9u6b] { background: #ecfdf5; color: #065f46; }
.badge-no[b-g0t1gv9u6b] { background: #f1f5f9; color: #64748b; }
.badge-info[b-g0t1gv9u6b] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-g0t1gv9u6b] { background: #fffbeb; color: #92400e; }
.badge-danger[b-g0t1gv9u6b] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-g0t1gv9u6b] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-g0t1gv9u6b] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-g0t1gv9u6b] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-g0t1gv9u6b] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-g0t1gv9u6b] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-g0t1gv9u6b] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-g0t1gv9u6b] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-g0t1gv9u6b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-g0t1gv9u6b] { text-align: center; }
.text-muted[b-g0t1gv9u6b] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-g0t1gv9u6b], .crud-empty-state[b-g0t1gv9u6b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-g0t1gv9u6b] { font-size: 2rem; }
.crud-spinner[b-g0t1gv9u6b] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-g0t1gv9u6b 0.6s linear infinite; }
.crud-spinner-sm[b-g0t1gv9u6b] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-g0t1gv9u6b 0.6s linear infinite; }
@keyframes spin-b-g0t1gv9u6b { to { transform: rotate(360deg); } }
.spin[b-g0t1gv9u6b] { animation: spin-b-g0t1gv9u6b 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-g0t1gv9u6b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-g0t1gv9u6b 0.15s ease-out; }
.modal-container[b-g0t1gv9u6b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-g0t1gv9u6b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-g0t1gv9u6b 0.2s ease-out; }
.modal-lg[b-g0t1gv9u6b] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-g0t1gv9u6b] { max-width: 420px; }
@keyframes fadeIn-b-g0t1gv9u6b { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-g0t1gv9u6b { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-g0t1gv9u6b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-g0t1gv9u6b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-g0t1gv9u6b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-g0t1gv9u6b] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-g0t1gv9u6b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-g0t1gv9u6b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-g0t1gv9u6b] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-g0t1gv9u6b] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-g0t1gv9u6b] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-g0t1gv9u6b] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-g0t1gv9u6b] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-g0t1gv9u6b] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-g0t1gv9u6b] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-g0t1gv9u6b] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-g0t1gv9u6b] { flex: 2; }
.form-group label[b-g0t1gv9u6b] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-g0t1gv9u6b], .form-group select[b-g0t1gv9u6b], .form-textarea[b-g0t1gv9u6b] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-g0t1gv9u6b], .form-group select:focus[b-g0t1gv9u6b], .form-textarea:focus[b-g0t1gv9u6b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-g0t1gv9u6b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-g0t1gv9u6b] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-g0t1gv9u6b] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-g0t1gv9u6b] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-g0t1gv9u6b] { margin-top: 0; }
.form-section-title i[b-g0t1gv9u6b] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-g0t1gv9u6b] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-g0t1gv9u6b] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-g0t1gv9u6b] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-g0t1gv9u6b] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-g0t1gv9u6b] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-g0t1gv9u6b] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-g0t1gv9u6b] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-g0t1gv9u6b] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-g0t1gv9u6b] { padding: 0.75rem; }
    .crud-header[b-g0t1gv9u6b] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-g0t1gv9u6b] { font-size: 1.1rem; }
    .btn-text[b-g0t1gv9u6b] { display: none; }
    .form-row[b-g0t1gv9u6b] { flex-direction: column; }
    .form-row-3[b-g0t1gv9u6b] { grid-template-columns: 1fr; }
    .form-row-4[b-g0t1gv9u6b] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-g0t1gv9u6b] { width: 98%; max-height: 95vh; }
    .modal-lg[b-g0t1gv9u6b] { max-width: 98vw; width: 98vw; }
    .modal-body[b-g0t1gv9u6b] { padding: 0.75rem; }
    .modal-tabs[b-g0t1gv9u6b] { overflow-x: auto; }
    .modal-tab[b-g0t1gv9u6b] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-g0t1gv9u6b] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-g0t1gv9u6b] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-g0t1gv9u6b] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-g0t1gv9u6b] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-g0t1gv9u6b] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-g0t1gv9u6b] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-g0t1gv9u6b] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-g0t1gv9u6b] { border-bottom: none; }
.help-section p[b-g0t1gv9u6b] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-g0t1gv9u6b], .help-section ol[b-g0t1gv9u6b] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-g0t1gv9u6b] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-g0t1gv9u6b] { color: var(--rg-accent,#2563eb); }
.help-tip[b-g0t1gv9u6b] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-g0t1gv9u6b] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-g0t1gv9u6b] { background: rgba(37,99,235,0.12); }
.help-table[b-g0t1gv9u6b] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-g0t1gv9u6b] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-g0t1gv9u6b] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-g0t1gv9u6b] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-g0t1gv9u6b] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-g0t1gv9u6b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-g0t1gv9u6b] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-g0t1gv9u6b] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-g0t1gv9u6b] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-g0t1gv9u6b] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-g0t1gv9u6b] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-g0t1gv9u6b] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-g0t1gv9u6b] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-g0t1gv9u6b] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-g0t1gv9u6b] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-g0t1gv9u6b] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-g0t1gv9u6b] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-g0t1gv9u6b] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaPos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-jjwfffi8cp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jjwfffi8cp 0.3s ease-out; }
@keyframes slideUp-b-jjwfffi8cp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jjwfffi8cp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jjwfffi8cp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jjwfffi8cp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jjwfffi8cp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jjwfffi8cp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jjwfffi8cp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jjwfffi8cp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jjwfffi8cp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jjwfffi8cp] { filter: brightness(1.1); }
.btn-outline[b-jjwfffi8cp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jjwfffi8cp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jjwfffi8cp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jjwfffi8cp] { filter: brightness(1.1); }
.btn-icon[b-jjwfffi8cp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jjwfffi8cp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jjwfffi8cp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jjwfffi8cp] { color: #ef4444; }
.btn-delete:hover[b-jjwfffi8cp] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-jjwfffi8cp] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-jjwfffi8cp] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-jjwfffi8cp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jjwfffi8cp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jjwfffi8cp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jjwfffi8cp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jjwfffi8cp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jjwfffi8cp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-jjwfffi8cp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-jjwfffi8cp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jjwfffi8cp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-jjwfffi8cp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-jjwfffi8cp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jjwfffi8cp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jjwfffi8cp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jjwfffi8cp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jjwfffi8cp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jjwfffi8cp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jjwfffi8cp] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-jjwfffi8cp] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-jjwfffi8cp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-jjwfffi8cp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jjwfffi8cp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jjwfffi8cp] { background: #f1f5f9; color: #64748b; }
.badge-info[b-jjwfffi8cp] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-jjwfffi8cp] { background: #fffbeb; color: #92400e; }
.badge-danger[b-jjwfffi8cp] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-jjwfffi8cp] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-jjwfffi8cp] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-jjwfffi8cp] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-jjwfffi8cp] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-jjwfffi8cp] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-jjwfffi8cp] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-jjwfffi8cp] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-jjwfffi8cp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jjwfffi8cp] { text-align: center; }
.text-muted[b-jjwfffi8cp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jjwfffi8cp], .crud-empty-state[b-jjwfffi8cp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jjwfffi8cp] { font-size: 2rem; }
.crud-spinner[b-jjwfffi8cp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jjwfffi8cp 0.6s linear infinite; }
.crud-spinner-sm[b-jjwfffi8cp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jjwfffi8cp 0.6s linear infinite; }
@keyframes spin-b-jjwfffi8cp { to { transform: rotate(360deg); } }
.spin[b-jjwfffi8cp] { animation: spin-b-jjwfffi8cp 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-jjwfffi8cp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jjwfffi8cp 0.15s ease-out; }
.modal-container[b-jjwfffi8cp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jjwfffi8cp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jjwfffi8cp 0.2s ease-out; }
.modal-lg[b-jjwfffi8cp] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-jjwfffi8cp] { max-width: 420px; }
@keyframes fadeIn-b-jjwfffi8cp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jjwfffi8cp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jjwfffi8cp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jjwfffi8cp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-jjwfffi8cp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jjwfffi8cp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jjwfffi8cp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jjwfffi8cp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jjwfffi8cp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-jjwfffi8cp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jjwfffi8cp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jjwfffi8cp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jjwfffi8cp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-jjwfffi8cp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jjwfffi8cp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jjwfffi8cp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jjwfffi8cp] { flex: 2; }
.form-group label[b-jjwfffi8cp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jjwfffi8cp], .form-group select[b-jjwfffi8cp], .form-textarea[b-jjwfffi8cp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jjwfffi8cp], .form-group select:focus[b-jjwfffi8cp], .form-textarea:focus[b-jjwfffi8cp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jjwfffi8cp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jjwfffi8cp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jjwfffi8cp] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jjwfffi8cp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-jjwfffi8cp] { margin-top: 0; }
.form-section-title i[b-jjwfffi8cp] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-jjwfffi8cp] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-jjwfffi8cp] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-jjwfffi8cp] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-jjwfffi8cp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-jjwfffi8cp] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-jjwfffi8cp] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-jjwfffi8cp] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-jjwfffi8cp] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jjwfffi8cp] { padding: 0.75rem; }
    .crud-header[b-jjwfffi8cp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jjwfffi8cp] { font-size: 1.1rem; }
    .btn-text[b-jjwfffi8cp] { display: none; }
    .form-row[b-jjwfffi8cp] { flex-direction: column; }
    .form-row-3[b-jjwfffi8cp] { grid-template-columns: 1fr; }
    .form-row-4[b-jjwfffi8cp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jjwfffi8cp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jjwfffi8cp] { max-width: 98vw; width: 98vw; }
    .modal-body[b-jjwfffi8cp] { padding: 0.75rem; }
    .modal-tabs[b-jjwfffi8cp] { overflow-x: auto; }
    .modal-tab[b-jjwfffi8cp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-jjwfffi8cp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jjwfffi8cp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jjwfffi8cp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jjwfffi8cp] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-jjwfffi8cp] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-jjwfffi8cp] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-jjwfffi8cp] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-jjwfffi8cp] { border-bottom: none; }
.help-section p[b-jjwfffi8cp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-jjwfffi8cp], .help-section ol[b-jjwfffi8cp] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-jjwfffi8cp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-jjwfffi8cp] { color: var(--rg-accent,#2563eb); }
.help-tip[b-jjwfffi8cp] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-jjwfffi8cp] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-jjwfffi8cp] { background: rgba(37,99,235,0.12); }
.help-table[b-jjwfffi8cp] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-jjwfffi8cp] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-jjwfffi8cp] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-jjwfffi8cp] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-jjwfffi8cp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-jjwfffi8cp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-jjwfffi8cp] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-jjwfffi8cp] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-jjwfffi8cp] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-jjwfffi8cp] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-jjwfffi8cp] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-jjwfffi8cp] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-jjwfffi8cp] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-jjwfffi8cp] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-jjwfffi8cp] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-jjwfffi8cp] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-jjwfffi8cp] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-jjwfffi8cp] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-jjwfffi8cp] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-jjwfffi8cp] { font-size: 1.6rem; }
.pos-op-btn > div[b-jjwfffi8cp] { display: flex; flex-direction: column; }
.pos-op-title[b-jjwfffi8cp] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-jjwfffi8cp] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-jjwfffi8cp] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-jjwfffi8cp] { color: var(--rg-success); }
.pos-op-ret[b-jjwfffi8cp] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-jjwfffi8cp] { color: var(--rg-danger); }

.pos-cuenta-search[b-jjwfffi8cp] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-jjwfffi8cp] { flex: 1; }

.pos-cuenta-card[b-jjwfffi8cp] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-jjwfffi8cp] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-jjwfffi8cp] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-jjwfffi8cp] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-jjwfffi8cp] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-jjwfffi8cp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-jjwfffi8cp], .pos-res-saldos > div[b-jjwfffi8cp] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-jjwfffi8cp] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-jjwfffi8cp] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-jjwfffi8cp] { color: var(--rg-success); }
.pos-cuenta-aviso[b-jjwfffi8cp] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-jjwfffi8cp] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-jjwfffi8cp] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-jjwfffi8cp] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-jjwfffi8cp] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-jjwfffi8cp]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-jjwfffi8cp] { z-index: 2001 !important; }

.badge-warn[b-jjwfffi8cp] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-jjwfffi8cp] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-jjwfffi8cp] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-jjwfffi8cp] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-jjwfffi8cp] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaReporteFaltantesSobrantes.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-4lf78oobrs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4lf78oobrs 0.3s ease-out; }
@keyframes slideUp-b-4lf78oobrs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4lf78oobrs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4lf78oobrs] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4lf78oobrs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4lf78oobrs] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4lf78oobrs] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4lf78oobrs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4lf78oobrs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4lf78oobrs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4lf78oobrs] { filter: brightness(1.1); }
.btn-outline[b-4lf78oobrs] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4lf78oobrs] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4lf78oobrs] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4lf78oobrs] { filter: brightness(1.1); }
.btn-icon[b-4lf78oobrs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4lf78oobrs] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4lf78oobrs] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4lf78oobrs] { color: #ef4444; }
.btn-delete:hover[b-4lf78oobrs] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-4lf78oobrs] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-4lf78oobrs] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-4lf78oobrs] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4lf78oobrs] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4lf78oobrs] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4lf78oobrs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4lf78oobrs] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4lf78oobrs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-4lf78oobrs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-4lf78oobrs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4lf78oobrs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-4lf78oobrs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-4lf78oobrs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4lf78oobrs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4lf78oobrs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4lf78oobrs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4lf78oobrs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4lf78oobrs] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4lf78oobrs] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-4lf78oobrs] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-4lf78oobrs] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-4lf78oobrs] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4lf78oobrs] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4lf78oobrs] { background: #f1f5f9; color: #64748b; }
.badge-info[b-4lf78oobrs] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-4lf78oobrs] { background: #fffbeb; color: #92400e; }
.badge-danger[b-4lf78oobrs] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-4lf78oobrs] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-4lf78oobrs] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-4lf78oobrs] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-4lf78oobrs] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-4lf78oobrs] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-4lf78oobrs] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-4lf78oobrs] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-4lf78oobrs] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4lf78oobrs] { text-align: center; }
.text-muted[b-4lf78oobrs] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4lf78oobrs], .crud-empty-state[b-4lf78oobrs] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4lf78oobrs] { font-size: 2rem; }
.crud-spinner[b-4lf78oobrs] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4lf78oobrs 0.6s linear infinite; }
.crud-spinner-sm[b-4lf78oobrs] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4lf78oobrs 0.6s linear infinite; }
@keyframes spin-b-4lf78oobrs { to { transform: rotate(360deg); } }
.spin[b-4lf78oobrs] { animation: spin-b-4lf78oobrs 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-4lf78oobrs] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4lf78oobrs 0.15s ease-out; }
.modal-container[b-4lf78oobrs] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4lf78oobrs] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4lf78oobrs 0.2s ease-out; }
.modal-lg[b-4lf78oobrs] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-4lf78oobrs] { max-width: 420px; }
@keyframes fadeIn-b-4lf78oobrs { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4lf78oobrs { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4lf78oobrs] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4lf78oobrs] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-4lf78oobrs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4lf78oobrs] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4lf78oobrs] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4lf78oobrs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4lf78oobrs] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-4lf78oobrs] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4lf78oobrs] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4lf78oobrs] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4lf78oobrs] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-4lf78oobrs] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4lf78oobrs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4lf78oobrs] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4lf78oobrs] { flex: 2; }
.form-group label[b-4lf78oobrs] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4lf78oobrs], .form-group select[b-4lf78oobrs], .form-textarea[b-4lf78oobrs] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4lf78oobrs], .form-group select:focus[b-4lf78oobrs], .form-textarea:focus[b-4lf78oobrs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4lf78oobrs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4lf78oobrs] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4lf78oobrs] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4lf78oobrs] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-4lf78oobrs] { margin-top: 0; }
.form-section-title i[b-4lf78oobrs] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-4lf78oobrs] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-4lf78oobrs] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-4lf78oobrs] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-4lf78oobrs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-4lf78oobrs] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-4lf78oobrs] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-4lf78oobrs] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-4lf78oobrs] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4lf78oobrs] { padding: 0.75rem; }
    .crud-header[b-4lf78oobrs] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4lf78oobrs] { font-size: 1.1rem; }
    .btn-text[b-4lf78oobrs] { display: none; }
    .form-row[b-4lf78oobrs] { flex-direction: column; }
    .form-row-3[b-4lf78oobrs] { grid-template-columns: 1fr; }
    .form-row-4[b-4lf78oobrs] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4lf78oobrs] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4lf78oobrs] { max-width: 98vw; width: 98vw; }
    .modal-body[b-4lf78oobrs] { padding: 0.75rem; }
    .modal-tabs[b-4lf78oobrs] { overflow-x: auto; }
    .modal-tab[b-4lf78oobrs] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-4lf78oobrs] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4lf78oobrs] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4lf78oobrs] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4lf78oobrs] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-4lf78oobrs] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-4lf78oobrs] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-4lf78oobrs] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-4lf78oobrs] { border-bottom: none; }
.help-section p[b-4lf78oobrs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-4lf78oobrs], .help-section ol[b-4lf78oobrs] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-4lf78oobrs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-4lf78oobrs] { color: var(--rg-accent,#2563eb); }
.help-tip[b-4lf78oobrs] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-4lf78oobrs] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-4lf78oobrs] { background: rgba(37,99,235,0.12); }
.help-table[b-4lf78oobrs] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-4lf78oobrs] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-4lf78oobrs] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-4lf78oobrs] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-4lf78oobrs] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-4lf78oobrs] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-4lf78oobrs] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-4lf78oobrs] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-4lf78oobrs] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-4lf78oobrs] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-4lf78oobrs] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-4lf78oobrs] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-4lf78oobrs] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-4lf78oobrs] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-4lf78oobrs] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-4lf78oobrs] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-4lf78oobrs] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-4lf78oobrs] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CajaTraspaso.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-b91tr5am5o] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-b91tr5am5o 0.3s ease-out; }
@keyframes slideUp-b-b91tr5am5o { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-b91tr5am5o] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-b91tr5am5o] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-b91tr5am5o] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-b91tr5am5o] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-b91tr5am5o] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-b91tr5am5o] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-b91tr5am5o] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-b91tr5am5o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-b91tr5am5o] { filter: brightness(1.1); }
.btn-outline[b-b91tr5am5o] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-b91tr5am5o] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-b91tr5am5o] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-b91tr5am5o] { filter: brightness(1.1); }
.btn-icon[b-b91tr5am5o] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-b91tr5am5o] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-b91tr5am5o] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-b91tr5am5o] { color: #ef4444; }
.btn-delete:hover[b-b91tr5am5o] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-b91tr5am5o] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-b91tr5am5o] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-b91tr5am5o] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-b91tr5am5o] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-b91tr5am5o] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-b91tr5am5o] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-b91tr5am5o] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-b91tr5am5o] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-b91tr5am5o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-b91tr5am5o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-b91tr5am5o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-b91tr5am5o] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-b91tr5am5o] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-b91tr5am5o] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-b91tr5am5o] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-b91tr5am5o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-b91tr5am5o] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-b91tr5am5o] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-b91tr5am5o] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-b91tr5am5o] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-b91tr5am5o] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-b91tr5am5o] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-b91tr5am5o] { background: #ecfdf5; color: #065f46; }
.badge-no[b-b91tr5am5o] { background: #f1f5f9; color: #64748b; }
.badge-info[b-b91tr5am5o] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-b91tr5am5o] { background: #fffbeb; color: #92400e; }
.badge-danger[b-b91tr5am5o] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-b91tr5am5o] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-b91tr5am5o] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-b91tr5am5o] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-b91tr5am5o] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-b91tr5am5o] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-b91tr5am5o] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-b91tr5am5o] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-b91tr5am5o] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-b91tr5am5o] { text-align: center; }
.text-muted[b-b91tr5am5o] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-b91tr5am5o], .crud-empty-state[b-b91tr5am5o] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-b91tr5am5o] { font-size: 2rem; }
.crud-spinner[b-b91tr5am5o] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-b91tr5am5o 0.6s linear infinite; }
.crud-spinner-sm[b-b91tr5am5o] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-b91tr5am5o 0.6s linear infinite; }
@keyframes spin-b-b91tr5am5o { to { transform: rotate(360deg); } }
.spin[b-b91tr5am5o] { animation: spin-b-b91tr5am5o 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-b91tr5am5o] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-b91tr5am5o 0.15s ease-out; }
.modal-container[b-b91tr5am5o] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-b91tr5am5o] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-b91tr5am5o 0.2s ease-out; }
.modal-lg[b-b91tr5am5o] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-b91tr5am5o] { max-width: 420px; }
@keyframes fadeIn-b-b91tr5am5o { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-b91tr5am5o { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-b91tr5am5o] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-b91tr5am5o] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-b91tr5am5o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-b91tr5am5o] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-b91tr5am5o] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-b91tr5am5o] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-b91tr5am5o] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-b91tr5am5o] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-b91tr5am5o] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-b91tr5am5o] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-b91tr5am5o] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-b91tr5am5o] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-b91tr5am5o] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-b91tr5am5o] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-b91tr5am5o] { flex: 2; }
.form-group label[b-b91tr5am5o] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-b91tr5am5o], .form-group select[b-b91tr5am5o], .form-textarea[b-b91tr5am5o] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-b91tr5am5o], .form-group select:focus[b-b91tr5am5o], .form-textarea:focus[b-b91tr5am5o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-b91tr5am5o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-b91tr5am5o] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-b91tr5am5o] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-b91tr5am5o] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-b91tr5am5o] { margin-top: 0; }
.form-section-title i[b-b91tr5am5o] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-b91tr5am5o] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-b91tr5am5o] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-b91tr5am5o] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-b91tr5am5o] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-b91tr5am5o] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-b91tr5am5o] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-b91tr5am5o] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-b91tr5am5o] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-b91tr5am5o] { padding: 0.75rem; }
    .crud-header[b-b91tr5am5o] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-b91tr5am5o] { font-size: 1.1rem; }
    .btn-text[b-b91tr5am5o] { display: none; }
    .form-row[b-b91tr5am5o] { flex-direction: column; }
    .form-row-3[b-b91tr5am5o] { grid-template-columns: 1fr; }
    .form-row-4[b-b91tr5am5o] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-b91tr5am5o] { width: 98%; max-height: 95vh; }
    .modal-lg[b-b91tr5am5o] { max-width: 98vw; width: 98vw; }
    .modal-body[b-b91tr5am5o] { padding: 0.75rem; }
    .modal-tabs[b-b91tr5am5o] { overflow-x: auto; }
    .modal-tab[b-b91tr5am5o] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-b91tr5am5o] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-b91tr5am5o] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-b91tr5am5o] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-b91tr5am5o] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-b91tr5am5o] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-b91tr5am5o] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-b91tr5am5o] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-b91tr5am5o] { border-bottom: none; }
.help-section p[b-b91tr5am5o] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-b91tr5am5o], .help-section ol[b-b91tr5am5o] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-b91tr5am5o] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-b91tr5am5o] { color: var(--rg-accent,#2563eb); }
.help-tip[b-b91tr5am5o] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-b91tr5am5o] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-b91tr5am5o] { background: rgba(37,99,235,0.12); }
.help-table[b-b91tr5am5o] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-b91tr5am5o] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-b91tr5am5o] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-b91tr5am5o] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-b91tr5am5o] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-b91tr5am5o] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-b91tr5am5o] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-b91tr5am5o] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-b91tr5am5o] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-b91tr5am5o] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-b91tr5am5o] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-b91tr5am5o] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-b91tr5am5o] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-b91tr5am5o] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-b91tr5am5o] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-b91tr5am5o] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-b91tr5am5o] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-b91tr5am5o] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Certificacion.razor.rz.scp.css */
/* ── Contenedor principal ────────────────────────────────────── */
.crud-container[b-e38vlsmko7] {
    padding: 1.25rem 1.5rem;
    animation: slideUp-b-e38vlsmko7 0.25s ease;
}

@keyframes slideUp-b-e38vlsmko7 {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ──────────────────────────────────────────────────── */
.crud-header[b-e38vlsmko7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.crud-header-left[b-e38vlsmko7] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-e38vlsmko7] { font-size: 1.6rem; color: var(--rg-primary); }
.crud-title[b-e38vlsmko7] { font-size: 1.3rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-e38vlsmko7] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-e38vlsmko7] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }

/* ── Botones ─────────────────────────────────────────────────── */
.btn-crud[b-e38vlsmko7] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s;
    white-space: nowrap;
}
.btn-crud:disabled[b-e38vlsmko7] { opacity: 0.55; cursor: not-allowed; }

.btn-primary[b-e38vlsmko7] { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }
.btn-primary:hover:not(:disabled)[b-e38vlsmko7] { filter: brightness(1.12); }

.btn-outline[b-e38vlsmko7] { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-e38vlsmko7] { background: var(--rg-bg-hover); }

.btn-help[b-e38vlsmko7] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37,99,235,0.25);
    padding: 0.45rem 0.65rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
}
.btn-help:hover[b-e38vlsmko7] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-e38vlsmko7] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-e38vlsmko7] { background: rgba(37,99,235,0.25); }

/* ── Alerta flash ─────────────────────────────────────────────── */
.crud-alert[b-e38vlsmko7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}
.crud-alert.success[b-e38vlsmko7] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-e38vlsmko7]   { background: rgba(220,38,38,0.1);  color: #991b1b; border: 1px solid rgba(220,38,38,0.25); }
[data-mode="dark"] .crud-alert.success[b-e38vlsmko7] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-e38vlsmko7]   { color: #fca5a5; }
.crud-alert-close[b-e38vlsmko7] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.7; }
.crud-alert-close:hover[b-e38vlsmko7] { opacity: 1; }

/* ── Panel de búsqueda ───────────────────────────────────────── */
.cert-search-panel[b-e38vlsmko7] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.85rem;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

.cert-search-inner[b-e38vlsmko7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.cert-search-icon[b-e38vlsmko7] {
    font-size: 1.3rem;
    color: var(--rg-text-muted);
    flex-shrink: 0;
}

.cert-search-input[b-e38vlsmko7] {
    flex: 1;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.55rem 0.85rem;
    font-size: 0.95rem;
    letter-spacing: 0.04em;
}
.cert-search-input:focus[b-e38vlsmko7] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(26,58,92,0.12);
}

.cert-search-hint[b-e38vlsmko7] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    margin: 0.5rem 0 0 0;
}

/* ── Botones de acciones ─────────────────────────────────────── */
.cert-acciones[b-e38vlsmko7] {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 1.25rem;
}

/* ── Documento de certificación ──────────────────────────────── */
.cert-documento[b-e38vlsmko7] {
    max-width: 800px;
    margin: 0 auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 2.5rem 3rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    font-family: Georgia, 'Times New Roman', serif;
}

/* Encabezado institucional */
.cert-encabezado[b-e38vlsmko7] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

.cert-logo-area[b-e38vlsmko7] { flex-shrink: 0; }

.cert-logo-placeholder[b-e38vlsmko7] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--rg-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.6rem;
}

.cert-inst-info[b-e38vlsmko7] { flex: 1; }

.cert-inst-nombre[b-e38vlsmko7] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-family: 'Arial', sans-serif;
    letter-spacing: 0.02em;
}

.cert-inst-meta[b-e38vlsmko7] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    font-family: 'Arial', sans-serif;
    margin-top: 0.15rem;
}

.cert-numero-cert[b-e38vlsmko7] {
    text-align: right;
    flex-shrink: 0;
}

.cert-numero-label[b-e38vlsmko7] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rg-text-muted);
    font-family: 'Arial', sans-serif;
}

.cert-numero-valor[b-e38vlsmko7] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-primary);
    font-family: 'Courier New', Courier, monospace;
    margin-top: 0.15rem;
}

/* Divisor */
.cert-linea-divider[b-e38vlsmko7] {
    height: 2px;
    background: linear-gradient(to right, var(--rg-primary), transparent);
    margin: 1rem 0;
    border-radius: 1px;
}

/* Título del documento */
.cert-titulo[b-e38vlsmko7] {
    text-align: center;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--rg-primary);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin: 1.25rem 0;
    font-family: 'Arial', sans-serif;
}

/* Cuerpo */
.cert-cuerpo[b-e38vlsmko7] { margin-bottom: 1.25rem; }

.cert-parrafo[b-e38vlsmko7] {
    font-size: 0.88rem;
    color: var(--rg-text-secondary);
    line-height: 1.7;
    margin-bottom: 1rem;
    text-align: justify;
}

/* Tabla de datos del socio */
.cert-tabla-datos[b-e38vlsmko7] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    margin: 1rem 0;
}

.cert-dato-row[b-e38vlsmko7] {
    display: flex;
    align-items: baseline;
    border-bottom: 1px solid var(--rg-border);
    padding: 0.55rem 1rem;
}
.cert-dato-row:last-child[b-e38vlsmko7] { border-bottom: none; }

.cert-dato-label[b-e38vlsmko7] {
    width: 180px;
    flex-shrink: 0;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    font-family: 'Arial', sans-serif;
}

.cert-dato-valor[b-e38vlsmko7] {
    font-size: 0.88rem;
    color: var(--rg-text-primary);
    font-family: Georgia, serif;
}

/* Fila de saldo destacada */
.cert-dato-saldo[b-e38vlsmko7] {
    background: rgba(26,58,92,0.06);
}
[data-mode="dark"] .cert-dato-saldo[b-e38vlsmko7] { background: rgba(37,99,235,0.1); }

.cert-saldo-monto[b-e38vlsmko7] {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: var(--rg-primary) !important;
    font-family: 'Courier New', Courier, monospace !important;
}

.cert-clausula[b-e38vlsmko7] {
    font-size: 0.8rem !important;
    font-style: italic;
    color: var(--rg-text-muted) !important;
}

/* Pie del documento */
.cert-pie[b-e38vlsmko7] { margin-top: 1.5rem; }

.cert-fecha[b-e38vlsmko7] {
    font-size: 0.85rem;
    color: var(--rg-text-secondary);
    text-align: center;
    margin-bottom: 2.5rem;
}

.cert-firmas[b-e38vlsmko7] {
    display: flex;
    justify-content: space-around;
    gap: 2rem;
    margin-bottom: 1.5rem;
}

.cert-firma-col[b-e38vlsmko7] { flex: 1; text-align: center; }

.cert-firma-linea[b-e38vlsmko7] {
    height: 1px;
    background: var(--rg-border);
    margin-bottom: 0.5rem;
}

.cert-firma-nombre[b-e38vlsmko7] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-family: 'Arial', sans-serif;
}

.cert-firma-cargo[b-e38vlsmko7] {
    font-size: 0.73rem;
    color: var(--rg-text-muted);
    font-style: italic;
}

.cert-sello-area[b-e38vlsmko7] {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
}

.cert-sello[b-e38vlsmko7] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px dashed var(--rg-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    color: var(--rg-text-muted);
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cert-sello i[b-e38vlsmko7] { font-size: 1.4rem; }

.cert-aviso-legal[b-e38vlsmko7] {
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    text-align: center;
    font-style: italic;
    margin-top: 0.75rem;
    border-top: 1px solid var(--rg-border);
    padding-top: 0.75rem;
}

/* ── Font mono ───────────────────────────────────────────────── */
.font-mono[b-e38vlsmko7] { font-family: 'Courier New', Courier, monospace; }

/* ── Estados vacío / cargando ────────────────────────────────── */
.crud-empty-state[b-e38vlsmko7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3.5rem 1rem;
    gap: 0.5rem;
    color: var(--rg-text-muted);
}
.crud-empty-state i[b-e38vlsmko7]   { font-size: 3rem; opacity: 0.3; }
.crud-empty-state p[b-e38vlsmko7]   { font-size: 0.95rem; font-weight: 600; margin: 0; }
.crud-empty-state span[b-e38vlsmko7] { font-size: 0.82rem; }

.spin[b-e38vlsmko7] { animation: spin-b-e38vlsmko7 0.8s linear infinite; }
@keyframes spin-b-e38vlsmko7 { to { transform: rotate(360deg); } }

/* ── Modal ───────────────────────────────────────────────────── */
.modal-backdrop[b-e38vlsmko7] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
}
.modal-container[b-e38vlsmko7] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001; pointer-events: none;
}
.modal-dialog[b-e38vlsmko7] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%; max-width: 680px; max-height: 90vh;
    overflow: hidden; display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.modal-header[b-e38vlsmko7] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.modal-header h2[b-e38vlsmko7] {
    margin: 0; font-size: 1rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex; align-items: center; gap: 0.5rem;
}
.modal-close[b-e38vlsmko7] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem;
}
.modal-close:hover[b-e38vlsmko7] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-e38vlsmko7] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-e38vlsmko7] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Ayuda ───────────────────────────────────────────────────── */
.help-icon-header[b-e38vlsmko7]  { color: var(--rg-accent, #2563eb); margin-right: 0.25rem; }
.help-body[b-e38vlsmko7]         { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-e38vlsmko7]      { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-e38vlsmko7] { border-bottom: none; }
.help-section p[b-e38vlsmko7]    { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-e38vlsmko7]   { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-e38vlsmko7]   { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-e38vlsmko7] {
    display: flex; align-items: center; gap: 0.45rem;
    font-size: 0.88rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin-bottom: 0.65rem;
}
.help-section-title i[b-e38vlsmko7] { color: var(--rg-accent, #2563eb); }
.help-tip[b-e38vlsmko7] {
    display: flex; gap: 0.6rem; align-items: flex-start;
    background: rgba(37,99,235,0.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.65rem 0.8rem; margin-top: 0.5rem;
    font-size: 0.82rem; color: var(--rg-text-secondary, #475569);
}
.help-tip i[b-e38vlsmko7] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-e38vlsmko7] { background: rgba(37,99,235,0.12); }
.help-steps[b-e38vlsmko7] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-e38vlsmko7] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-e38vlsmko7] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 1.5rem; height: 1.5rem;
    background: var(--rg-accent, #2563eb); color: #fff;
    border-radius: 50%; font-size: 0.72rem; font-weight: 700;
    flex-shrink: 0; margin-top: 0.1rem;
}
.help-step div[b-e38vlsmko7] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); padding-top: 0.1rem; }

/* ================================================================
   IMPRESIÓN — @media print
   Oculta UI de la app, muestra solo el documento
   ================================================================ */
@media print {
    /* Ocultar todo excepto el documento */
    .no-print[b-e38vlsmko7],
    .crud-header[b-e38vlsmko7],
    .crud-alert[b-e38vlsmko7],
    .cert-search-panel[b-e38vlsmko7],
    .cert-acciones[b-e38vlsmko7],
    .crud-empty-state[b-e38vlsmko7],
    .modal-backdrop[b-e38vlsmko7],
    .modal-container[b-e38vlsmko7] {
        display: none !important;
    }

    /* Quitar fondo de página */
    body[b-e38vlsmko7], .crud-container[b-e38vlsmko7] {
        background: #fff !important;
        color: #000 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* El documento ocupa toda la página */
    .cert-documento[b-e38vlsmko7] {
        border: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding: 1.5cm 2cm !important;
        max-width: none !important;
        margin: 0 !important;
        background: #fff !important;
        color: #000 !important;
    }

    /* Colores planos para impresión */
    .cert-titulo[b-e38vlsmko7] { color: #1a3a5c !important; }
    .cert-inst-nombre[b-e38vlsmko7] { color: #000 !important; }
    .cert-numero-valor[b-e38vlsmko7] { color: #1a3a5c !important; }
    .cert-dato-label[b-e38vlsmko7] { color: #555 !important; }
    .cert-dato-valor[b-e38vlsmko7] { color: #000 !important; }
    .cert-saldo-monto[b-e38vlsmko7] { color: #1a3a5c !important; }
    .cert-logo-placeholder[b-e38vlsmko7] { background: #1a3a5c !important; }
    .cert-linea-divider[b-e38vlsmko7] { background: #1a3a5c !important; }

    /* Asegurar que tabla de datos se vea bien */
    .cert-tabla-datos[b-e38vlsmko7] { background: #f8f8f8 !important; border-color: #ddd !important; }
    .cert-dato-row[b-e38vlsmko7] { border-bottom-color: #ddd !important; }
    .cert-dato-saldo[b-e38vlsmko7] { background: #eef4ff !important; }

    /* Evitar salto de página dentro del documento */
    .cert-documento[b-e38vlsmko7] { page-break-inside: avoid; }
    .cert-tabla-datos[b-e38vlsmko7] { page-break-inside: avoid; }
    .cert-pie[b-e38vlsmko7] { page-break-inside: avoid; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Conceptos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-xa13jwii2w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xa13jwii2w 0.3s ease-out; }
@keyframes slideUp-b-xa13jwii2w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xa13jwii2w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xa13jwii2w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xa13jwii2w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xa13jwii2w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xa13jwii2w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xa13jwii2w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xa13jwii2w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xa13jwii2w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xa13jwii2w] { filter: brightness(1.1); }
.btn-outline[b-xa13jwii2w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xa13jwii2w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xa13jwii2w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xa13jwii2w] { filter: brightness(1.1); }
.btn-icon[b-xa13jwii2w] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xa13jwii2w] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xa13jwii2w] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xa13jwii2w] { color: #ef4444; }
.btn-delete:hover[b-xa13jwii2w] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-xa13jwii2w] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-xa13jwii2w] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-xa13jwii2w] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xa13jwii2w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xa13jwii2w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xa13jwii2w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xa13jwii2w] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xa13jwii2w] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-xa13jwii2w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-xa13jwii2w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xa13jwii2w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-xa13jwii2w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-xa13jwii2w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xa13jwii2w] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xa13jwii2w] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xa13jwii2w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xa13jwii2w] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xa13jwii2w] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xa13jwii2w] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-xa13jwii2w] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-xa13jwii2w] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-xa13jwii2w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xa13jwii2w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xa13jwii2w] { background: #f1f5f9; color: #64748b; }
.badge-info[b-xa13jwii2w] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-xa13jwii2w] { background: #fffbeb; color: #92400e; }
.badge-danger[b-xa13jwii2w] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-xa13jwii2w] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-xa13jwii2w] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-xa13jwii2w] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-xa13jwii2w] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-xa13jwii2w] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-xa13jwii2w] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-xa13jwii2w] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-xa13jwii2w] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xa13jwii2w] { text-align: center; }
.text-muted[b-xa13jwii2w] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xa13jwii2w], .crud-empty-state[b-xa13jwii2w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xa13jwii2w] { font-size: 2rem; }
.crud-spinner[b-xa13jwii2w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xa13jwii2w 0.6s linear infinite; }
.crud-spinner-sm[b-xa13jwii2w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xa13jwii2w 0.6s linear infinite; }
@keyframes spin-b-xa13jwii2w { to { transform: rotate(360deg); } }
.spin[b-xa13jwii2w] { animation: spin-b-xa13jwii2w 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-xa13jwii2w] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xa13jwii2w 0.15s ease-out; }
.modal-container[b-xa13jwii2w] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xa13jwii2w] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xa13jwii2w 0.2s ease-out; }
.modal-lg[b-xa13jwii2w] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-xa13jwii2w] { max-width: 420px; }
@keyframes fadeIn-b-xa13jwii2w { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xa13jwii2w { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xa13jwii2w] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xa13jwii2w] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-xa13jwii2w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xa13jwii2w] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xa13jwii2w] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xa13jwii2w] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xa13jwii2w] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-xa13jwii2w] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xa13jwii2w] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xa13jwii2w] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xa13jwii2w] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-xa13jwii2w] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xa13jwii2w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xa13jwii2w] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xa13jwii2w] { flex: 2; }
.form-group label[b-xa13jwii2w] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xa13jwii2w], .form-group select[b-xa13jwii2w], .form-textarea[b-xa13jwii2w] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xa13jwii2w], .form-group select:focus[b-xa13jwii2w], .form-textarea:focus[b-xa13jwii2w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xa13jwii2w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xa13jwii2w] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xa13jwii2w] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xa13jwii2w] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-xa13jwii2w] { margin-top: 0; }
.form-section-title i[b-xa13jwii2w] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-xa13jwii2w] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-xa13jwii2w] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-xa13jwii2w] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-xa13jwii2w] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-xa13jwii2w] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-xa13jwii2w] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-xa13jwii2w] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-xa13jwii2w] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xa13jwii2w] { padding: 0.75rem; }
    .crud-header[b-xa13jwii2w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xa13jwii2w] { font-size: 1.1rem; }
    .btn-text[b-xa13jwii2w] { display: none; }
    .form-row[b-xa13jwii2w] { flex-direction: column; }
    .form-row-3[b-xa13jwii2w] { grid-template-columns: 1fr; }
    .form-row-4[b-xa13jwii2w] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xa13jwii2w] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xa13jwii2w] { max-width: 98vw; width: 98vw; }
    .modal-body[b-xa13jwii2w] { padding: 0.75rem; }
    .modal-tabs[b-xa13jwii2w] { overflow-x: auto; }
    .modal-tab[b-xa13jwii2w] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-xa13jwii2w] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xa13jwii2w] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xa13jwii2w] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xa13jwii2w] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-xa13jwii2w] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-xa13jwii2w] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-xa13jwii2w] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-xa13jwii2w] { border-bottom: none; }
.help-section p[b-xa13jwii2w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-xa13jwii2w], .help-section ol[b-xa13jwii2w] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-xa13jwii2w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-xa13jwii2w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-xa13jwii2w] { color: var(--rg-accent,#2563eb); }
.help-tip[b-xa13jwii2w] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-xa13jwii2w] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-xa13jwii2w] { background: rgba(37,99,235,0.12); }
.help-table[b-xa13jwii2w] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-xa13jwii2w] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-xa13jwii2w] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-xa13jwii2w] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_ConfigGlobalNotif.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-7oj8vkamyk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7oj8vkamyk 0.3s ease-out; }
@keyframes slideUp-b-7oj8vkamyk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7oj8vkamyk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7oj8vkamyk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7oj8vkamyk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7oj8vkamyk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7oj8vkamyk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7oj8vkamyk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7oj8vkamyk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7oj8vkamyk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7oj8vkamyk] { filter: brightness(1.1); }
.btn-outline[b-7oj8vkamyk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7oj8vkamyk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7oj8vkamyk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7oj8vkamyk] { filter: brightness(1.1); }
.btn-icon[b-7oj8vkamyk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7oj8vkamyk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7oj8vkamyk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7oj8vkamyk] { color: #ef4444; }
.btn-delete:hover[b-7oj8vkamyk] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-7oj8vkamyk] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-7oj8vkamyk] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-7oj8vkamyk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7oj8vkamyk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7oj8vkamyk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7oj8vkamyk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7oj8vkamyk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7oj8vkamyk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-7oj8vkamyk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-7oj8vkamyk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7oj8vkamyk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-7oj8vkamyk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-7oj8vkamyk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7oj8vkamyk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7oj8vkamyk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7oj8vkamyk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7oj8vkamyk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7oj8vkamyk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7oj8vkamyk] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-7oj8vkamyk] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-7oj8vkamyk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-7oj8vkamyk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7oj8vkamyk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7oj8vkamyk] { background: #f1f5f9; color: #64748b; }
.badge-info[b-7oj8vkamyk] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-7oj8vkamyk] { background: #fffbeb; color: #92400e; }
.badge-danger[b-7oj8vkamyk] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-7oj8vkamyk] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-7oj8vkamyk] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-7oj8vkamyk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-7oj8vkamyk] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-7oj8vkamyk] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-7oj8vkamyk] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-7oj8vkamyk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-7oj8vkamyk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7oj8vkamyk] { text-align: center; }
.text-muted[b-7oj8vkamyk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7oj8vkamyk], .crud-empty-state[b-7oj8vkamyk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7oj8vkamyk] { font-size: 2rem; }
.crud-spinner[b-7oj8vkamyk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7oj8vkamyk 0.6s linear infinite; }
.crud-spinner-sm[b-7oj8vkamyk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7oj8vkamyk 0.6s linear infinite; }
@keyframes spin-b-7oj8vkamyk { to { transform: rotate(360deg); } }
.spin[b-7oj8vkamyk] { animation: spin-b-7oj8vkamyk 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7oj8vkamyk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7oj8vkamyk 0.15s ease-out; }
.modal-container[b-7oj8vkamyk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7oj8vkamyk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7oj8vkamyk 0.2s ease-out; }
.modal-lg[b-7oj8vkamyk] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-7oj8vkamyk] { max-width: 420px; }
@keyframes fadeIn-b-7oj8vkamyk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7oj8vkamyk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7oj8vkamyk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7oj8vkamyk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7oj8vkamyk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7oj8vkamyk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7oj8vkamyk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7oj8vkamyk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7oj8vkamyk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-7oj8vkamyk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7oj8vkamyk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7oj8vkamyk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7oj8vkamyk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7oj8vkamyk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7oj8vkamyk] { flex: 2; }
.form-group label[b-7oj8vkamyk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7oj8vkamyk], .form-group select[b-7oj8vkamyk], .form-textarea[b-7oj8vkamyk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7oj8vkamyk], .form-group select:focus[b-7oj8vkamyk], .form-textarea:focus[b-7oj8vkamyk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7oj8vkamyk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7oj8vkamyk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7oj8vkamyk] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7oj8vkamyk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-7oj8vkamyk] { margin-top: 0; }
.form-section-title i[b-7oj8vkamyk] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-7oj8vkamyk] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-7oj8vkamyk] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-7oj8vkamyk] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-7oj8vkamyk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-7oj8vkamyk] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-7oj8vkamyk] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-7oj8vkamyk] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-7oj8vkamyk] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7oj8vkamyk] { padding: 0.75rem; }
    .crud-header[b-7oj8vkamyk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7oj8vkamyk] { font-size: 1.1rem; }
    .btn-text[b-7oj8vkamyk] { display: none; }
    .form-row[b-7oj8vkamyk] { flex-direction: column; }
    .form-row-3[b-7oj8vkamyk] { grid-template-columns: 1fr; }
    .form-row-4[b-7oj8vkamyk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7oj8vkamyk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7oj8vkamyk] { max-width: 98vw; width: 98vw; }
    .modal-body[b-7oj8vkamyk] { padding: 0.75rem; }
    .modal-tabs[b-7oj8vkamyk] { overflow-x: auto; }
    .modal-tab[b-7oj8vkamyk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-7oj8vkamyk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7oj8vkamyk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7oj8vkamyk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7oj8vkamyk] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-7oj8vkamyk] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7oj8vkamyk] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7oj8vkamyk] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7oj8vkamyk] { border-bottom: none; }
.help-section p[b-7oj8vkamyk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-7oj8vkamyk], .help-section ol[b-7oj8vkamyk] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-7oj8vkamyk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7oj8vkamyk] { color: var(--rg-accent,#2563eb); }
.help-tip[b-7oj8vkamyk] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7oj8vkamyk] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7oj8vkamyk] { background: rgba(37,99,235,0.12); }
.help-table[b-7oj8vkamyk] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-7oj8vkamyk] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-7oj8vkamyk] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-7oj8vkamyk] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-7oj8vkamyk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-7oj8vkamyk] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-7oj8vkamyk] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-7oj8vkamyk] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-7oj8vkamyk] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-7oj8vkamyk] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-7oj8vkamyk] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-7oj8vkamyk] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-7oj8vkamyk] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-7oj8vkamyk] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-7oj8vkamyk] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-7oj8vkamyk] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-7oj8vkamyk] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-7oj8vkamyk] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-7oj8vkamyk] { font-size: 1.6rem; }
.pos-op-btn > div[b-7oj8vkamyk] { display: flex; flex-direction: column; }
.pos-op-title[b-7oj8vkamyk] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-7oj8vkamyk] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-7oj8vkamyk] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-7oj8vkamyk] { color: var(--rg-success); }
.pos-op-ret[b-7oj8vkamyk] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-7oj8vkamyk] { color: var(--rg-danger); }

.pos-cuenta-search[b-7oj8vkamyk] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-7oj8vkamyk] { flex: 1; }

.pos-cuenta-card[b-7oj8vkamyk] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-7oj8vkamyk] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-7oj8vkamyk] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-7oj8vkamyk] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-7oj8vkamyk] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-7oj8vkamyk], .pos-res-saldos > div[b-7oj8vkamyk] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-7oj8vkamyk] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-7oj8vkamyk] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-7oj8vkamyk] { color: var(--rg-success); }
.pos-cuenta-aviso[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-7oj8vkamyk] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-7oj8vkamyk] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-7oj8vkamyk] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-7oj8vkamyk] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-7oj8vkamyk]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-7oj8vkamyk] { z-index: 2001 !important; }

.badge-warn[b-7oj8vkamyk] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-7oj8vkamyk] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-7oj8vkamyk] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-7oj8vkamyk] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-7oj8vkamyk] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-7oj8vkamyk] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-7oj8vkamyk] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-7oj8vkamyk] { margin-bottom: 0; }
.dv-periodo input[b-7oj8vkamyk], .dv-periodo select[b-7oj8vkamyk] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-7oj8vkamyk] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-7oj8vkamyk] { text-align: right; }
.badge-warn[b-7oj8vkamyk] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-7oj8vkamyk] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-7oj8vkamyk] { flex-direction: column; align-items: stretch; } .dv-periodo[b-7oj8vkamyk], .dv-acciones[b-7oj8vkamyk] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-7oj8vkamyk] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-7oj8vkamyk] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-7oj8vkamyk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-7oj8vkamyk] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-7oj8vkamyk] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-7oj8vkamyk] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-7oj8vkamyk] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-7oj8vkamyk] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-7oj8vkamyk] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-7oj8vkamyk] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-7oj8vkamyk] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-7oj8vkamyk] { border-bottom: none; }
.config-toggle-label[b-7oj8vkamyk] { flex: 1; }
.config-toggle-name[b-7oj8vkamyk] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-7oj8vkamyk] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-7oj8vkamyk] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-7oj8vkamyk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7oj8vkamyk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-7oj8vkamyk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7oj8vkamyk], .form-group select[b-7oj8vkamyk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_CuadreCajaPrestamos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-h3t9jb5g9k] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h3t9jb5g9k 0.3s ease-out; }
@keyframes slideUp-b-h3t9jb5g9k { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h3t9jb5g9k] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h3t9jb5g9k] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h3t9jb5g9k] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h3t9jb5g9k] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h3t9jb5g9k] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h3t9jb5g9k] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h3t9jb5g9k] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h3t9jb5g9k] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h3t9jb5g9k] { filter: brightness(1.1); }
.btn-outline[b-h3t9jb5g9k] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h3t9jb5g9k] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h3t9jb5g9k] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h3t9jb5g9k] { filter: brightness(1.1); }
.btn-icon[b-h3t9jb5g9k] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h3t9jb5g9k] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h3t9jb5g9k] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h3t9jb5g9k] { color: #ef4444; }
.btn-delete:hover[b-h3t9jb5g9k] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-h3t9jb5g9k] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-h3t9jb5g9k] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-h3t9jb5g9k] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h3t9jb5g9k] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h3t9jb5g9k] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h3t9jb5g9k] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h3t9jb5g9k] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h3t9jb5g9k] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-h3t9jb5g9k] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-h3t9jb5g9k] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h3t9jb5g9k] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-h3t9jb5g9k] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-h3t9jb5g9k] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h3t9jb5g9k] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h3t9jb5g9k] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h3t9jb5g9k] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h3t9jb5g9k] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h3t9jb5g9k] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h3t9jb5g9k] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-h3t9jb5g9k] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-h3t9jb5g9k] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-h3t9jb5g9k] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h3t9jb5g9k] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h3t9jb5g9k] { background: #f1f5f9; color: #64748b; }
.badge-info[b-h3t9jb5g9k] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-h3t9jb5g9k] { background: #fffbeb; color: #92400e; }
.badge-danger[b-h3t9jb5g9k] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-h3t9jb5g9k] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-h3t9jb5g9k] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-h3t9jb5g9k] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-h3t9jb5g9k] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-h3t9jb5g9k] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-h3t9jb5g9k] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-h3t9jb5g9k] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-h3t9jb5g9k] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h3t9jb5g9k] { text-align: center; }
.text-muted[b-h3t9jb5g9k] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h3t9jb5g9k], .crud-empty-state[b-h3t9jb5g9k] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h3t9jb5g9k] { font-size: 2rem; }
.crud-spinner[b-h3t9jb5g9k] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h3t9jb5g9k 0.6s linear infinite; }
.crud-spinner-sm[b-h3t9jb5g9k] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h3t9jb5g9k 0.6s linear infinite; }
@keyframes spin-b-h3t9jb5g9k { to { transform: rotate(360deg); } }
.spin[b-h3t9jb5g9k] { animation: spin-b-h3t9jb5g9k 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-h3t9jb5g9k] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h3t9jb5g9k 0.15s ease-out; }
.modal-container[b-h3t9jb5g9k] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h3t9jb5g9k] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h3t9jb5g9k 0.2s ease-out; }
.modal-lg[b-h3t9jb5g9k] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-h3t9jb5g9k] { max-width: 420px; }
@keyframes fadeIn-b-h3t9jb5g9k { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h3t9jb5g9k { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h3t9jb5g9k] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h3t9jb5g9k] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-h3t9jb5g9k] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h3t9jb5g9k] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h3t9jb5g9k] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h3t9jb5g9k] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h3t9jb5g9k] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-h3t9jb5g9k] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h3t9jb5g9k] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h3t9jb5g9k] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h3t9jb5g9k] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h3t9jb5g9k] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h3t9jb5g9k] { flex: 2; }
.form-group label[b-h3t9jb5g9k] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h3t9jb5g9k], .form-group select[b-h3t9jb5g9k], .form-textarea[b-h3t9jb5g9k] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h3t9jb5g9k], .form-group select:focus[b-h3t9jb5g9k], .form-textarea:focus[b-h3t9jb5g9k] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h3t9jb5g9k] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h3t9jb5g9k] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h3t9jb5g9k] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h3t9jb5g9k] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-h3t9jb5g9k] { margin-top: 0; }
.form-section-title i[b-h3t9jb5g9k] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-h3t9jb5g9k] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-h3t9jb5g9k] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-h3t9jb5g9k] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-h3t9jb5g9k] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-h3t9jb5g9k] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-h3t9jb5g9k] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-h3t9jb5g9k] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-h3t9jb5g9k] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h3t9jb5g9k] { padding: 0.75rem; }
    .crud-header[b-h3t9jb5g9k] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h3t9jb5g9k] { font-size: 1.1rem; }
    .btn-text[b-h3t9jb5g9k] { display: none; }
    .form-row[b-h3t9jb5g9k] { flex-direction: column; }
    .form-row-3[b-h3t9jb5g9k] { grid-template-columns: 1fr; }
    .form-row-4[b-h3t9jb5g9k] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h3t9jb5g9k] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h3t9jb5g9k] { max-width: 98vw; width: 98vw; }
    .modal-body[b-h3t9jb5g9k] { padding: 0.75rem; }
    .modal-tabs[b-h3t9jb5g9k] { overflow-x: auto; }
    .modal-tab[b-h3t9jb5g9k] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-h3t9jb5g9k] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h3t9jb5g9k] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h3t9jb5g9k] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h3t9jb5g9k] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-h3t9jb5g9k] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-h3t9jb5g9k] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-h3t9jb5g9k] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-h3t9jb5g9k] { border-bottom: none; }
.help-section p[b-h3t9jb5g9k] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-h3t9jb5g9k], .help-section ol[b-h3t9jb5g9k] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-h3t9jb5g9k] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-h3t9jb5g9k] { color: var(--rg-accent,#2563eb); }
.help-tip[b-h3t9jb5g9k] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-h3t9jb5g9k] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-h3t9jb5g9k] { background: rgba(37,99,235,0.12); }
.help-table[b-h3t9jb5g9k] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-h3t9jb5g9k] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-h3t9jb5g9k] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-h3t9jb5g9k] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-h3t9jb5g9k] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-h3t9jb5g9k] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-h3t9jb5g9k] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-h3t9jb5g9k] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-h3t9jb5g9k] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-h3t9jb5g9k] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-h3t9jb5g9k] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-h3t9jb5g9k] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-h3t9jb5g9k] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-h3t9jb5g9k] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-h3t9jb5g9k] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-h3t9jb5g9k] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-h3t9jb5g9k] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-h3t9jb5g9k] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-h3t9jb5g9k] { font-size: 1.6rem; }
.pos-op-btn > div[b-h3t9jb5g9k] { display: flex; flex-direction: column; }
.pos-op-title[b-h3t9jb5g9k] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-h3t9jb5g9k] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-h3t9jb5g9k] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-h3t9jb5g9k] { color: var(--rg-success); }
.pos-op-ret[b-h3t9jb5g9k] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-h3t9jb5g9k] { color: var(--rg-danger); }

.pos-cuenta-search[b-h3t9jb5g9k] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-h3t9jb5g9k] { flex: 1; }

.pos-cuenta-card[b-h3t9jb5g9k] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-h3t9jb5g9k] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-h3t9jb5g9k] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-h3t9jb5g9k] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-h3t9jb5g9k] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-h3t9jb5g9k], .pos-res-saldos > div[b-h3t9jb5g9k] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-h3t9jb5g9k] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-h3t9jb5g9k] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-h3t9jb5g9k] { color: var(--rg-success); }
.pos-cuenta-aviso[b-h3t9jb5g9k] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-h3t9jb5g9k] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-h3t9jb5g9k] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-h3t9jb5g9k] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-h3t9jb5g9k] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-h3t9jb5g9k]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-h3t9jb5g9k] { z-index: 2001 !important; }

.badge-warn[b-h3t9jb5g9k] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-h3t9jb5g9k] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-h3t9jb5g9k] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-h3t9jb5g9k] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-h3t9jb5g9k] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-h3t9jb5g9k] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-h3t9jb5g9k] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-h3t9jb5g9k] { margin-bottom: 0; }
.dv-periodo input[b-h3t9jb5g9k], .dv-periodo select[b-h3t9jb5g9k] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-h3t9jb5g9k] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-h3t9jb5g9k] { text-align: right; }
.badge-warn[b-h3t9jb5g9k] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-h3t9jb5g9k] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-h3t9jb5g9k] { flex-direction: column; align-items: stretch; } .dv-periodo[b-h3t9jb5g9k], .dv-acciones[b-h3t9jb5g9k] { width: 100%; } }

/* ── Cuadre de caja préstamos ──────────────────────────────────────────── */
.cc-grid[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.85rem; margin-bottom: 1rem; }
.cc-card[b-h3t9jb5g9k] { display: flex; flex-direction: column; gap: 0.2rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border);
    border-radius: 0.75rem; padding: 1rem 1.1rem; border-left: 4px solid var(--rg-border); }
.cc-label[b-h3t9jb5g9k] { font-size: 0.78rem; font-weight: 700; color: var(--rg-text-secondary); display: flex; align-items: center; gap: 0.35rem; }
.cc-value[b-h3t9jb5g9k] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.cc-sub[b-h3t9jb5g9k] { font-size: 0.72rem; color: var(--rg-text-muted); }
.cc-total[b-h3t9jb5g9k] { border-left-color: var(--rg-primary); }
.cc-efectivo[b-h3t9jb5g9k] { border-left-color: var(--rg-success); }
.cc-efectivo .cc-value[b-h3t9jb5g9k] { color: var(--rg-success); }
.cc-ahorro[b-h3t9jb5g9k] { border-left-color: var(--rg-accent); }

.cc-formas[b-h3t9jb5g9k] { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.5rem; margin-bottom: 1rem; }
.cc-forma[b-h3t9jb5g9k] { display: flex; justify-content: space-between; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; padding: 0.5rem 0.75rem; font-size: 0.85rem; color: var(--rg-text-secondary); }
.cc-forma > span:last-child[b-h3t9jb5g9k] { font-weight: 700; color: var(--rg-text-primary); }

.cc-conclusion[b-h3t9jb5g9k] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07);
    border-left: 4px solid var(--rg-accent); border-radius: 0 0.5rem 0.5rem 0; padding: 0.8rem 1rem; margin-bottom: 1rem;
    font-size: 0.85rem; color: var(--rg-text-secondary); }
.cc-conclusion i[b-h3t9jb5g9k] { color: var(--rg-accent); font-size: 1.1rem; flex-shrink: 0; margin-top: 0.1rem; }
[data-mode="dark"] .cc-conclusion[b-h3t9jb5g9k] { background: rgba(37,99,235,0.12); }

.text-right[b-h3t9jb5g9k] { text-align: right; }
.badge-warn[b-h3t9jb5g9k] { background: rgba(217,119,6,0.14); color: #92400e; }
[data-mode="dark"] .badge-warn[b-h3t9jb5g9k] { color: #fcd34d; }
.badge-no[b-h3t9jb5g9k] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .badge-no[b-h3t9jb5g9k] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DashboardCasos.razor.rz.scp.css */
/* ============================================================
   FrmAho_DashboardCasos — Dashboard de Casos de Ahorros
   ============================================================ */

.crud-container[b-9wje4sbwdj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9wje4sbwdj 0.3s ease-out; }
@keyframes slideUp-b-9wje4sbwdj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9wje4sbwdj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9wje4sbwdj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9wje4sbwdj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9wje4sbwdj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9wje4sbwdj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9wje4sbwdj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9wje4sbwdj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9wje4sbwdj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9wje4sbwdj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9wje4sbwdj] { filter: brightness(1.1); }
.btn-outline[b-9wje4sbwdj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9wje4sbwdj] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-9wje4sbwdj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9wje4sbwdj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9wje4sbwdj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9wje4sbwdj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Grid */
.crud-grid-wrapper[b-9wje4sbwdj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 340px); }
.crud-table[b-9wje4sbwdj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9wje4sbwdj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9wje4sbwdj] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9wje4sbwdj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9wje4sbwdj] { background: var(--rg-bg-hover, #f8fafc); }

/* Badges */
.badge[b-9wje4sbwdj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9wje4sbwdj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9wje4sbwdj] { background: #f1f5f9; color: #64748b; }
.badge-info[b-9wje4sbwdj] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-9wje4sbwdj] { background: #fffbeb; color: #92400e; }
.badge-danger[b-9wje4sbwdj] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-9wje4sbwdj] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-9wje4sbwdj] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-9wje4sbwdj] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-9wje4sbwdj] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-9wje4sbwdj] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-9wje4sbwdj] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-9wje4sbwdj] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-9wje4sbwdj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-9wje4sbwdj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9wje4sbwdj], .crud-empty-state[b-9wje4sbwdj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9wje4sbwdj] { font-size: 2rem; }
.crud-spinner[b-9wje4sbwdj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9wje4sbwdj 0.6s linear infinite; }
@keyframes spin-b-9wje4sbwdj { to { transform: rotate(360deg); } }
.spin[b-9wje4sbwdj] { animation: spin-b-9wje4sbwdj 0.8s linear infinite; }

/* Section title */
.form-section-title[b-9wje4sbwdj] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title i[b-9wje4sbwdj] { color: var(--rg-accent, #4f46e5); }

/* ── KPI Cards 2x2 ─────────────────────────────────────────── */
.dash-kpi-grid[b-9wje4sbwdj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1.25rem; }
.dash-kpi-card[b-9wje4sbwdj] { display: flex; align-items: center; gap: 0.75rem; padding: 1rem 1.1rem; border-radius: 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-card, #fff); }
.dash-kpi-icon[b-9wje4sbwdj] { font-size: 1.5rem; width: 2.5rem; height: 2.5rem; display: flex; align-items: center; justify-content: center; border-radius: 50%; flex-shrink: 0; }
.dash-kpi-body[b-9wje4sbwdj] { display: flex; flex-direction: column; }
.dash-kpi-label[b-9wje4sbwdj] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.dash-kpi-value[b-9wje4sbwdj] { font-size: 2rem; font-weight: 800; line-height: 1.1; font-family: 'Cascadia Code', 'Fira Code', monospace; color: var(--rg-text-primary, #1e293b); }

/* Colores temáticos */
.dash-kpi-blue .dash-kpi-icon[b-9wje4sbwdj] { background: rgba(37,99,235,0.1); color: #2563eb; }
.dash-kpi-blue .dash-kpi-value[b-9wje4sbwdj] { color: #2563eb; }
.dash-kpi-orange .dash-kpi-icon[b-9wje4sbwdj] { background: rgba(234,88,12,0.1); color: #ea580c; }
.dash-kpi-orange .dash-kpi-value[b-9wje4sbwdj] { color: #ea580c; }
.dash-kpi-green .dash-kpi-icon[b-9wje4sbwdj] { background: rgba(22,163,74,0.1); color: #16a34a; }
.dash-kpi-green .dash-kpi-value[b-9wje4sbwdj] { color: #16a34a; }
.dash-kpi-red .dash-kpi-icon[b-9wje4sbwdj] { background: rgba(220,38,38,0.1); color: #dc2626; }
.dash-kpi-red .dash-kpi-value[b-9wje4sbwdj] { color: #dc2626; }

[data-mode="dark"] .dash-kpi-blue .dash-kpi-value[b-9wje4sbwdj] { color: #93c5fd; }
[data-mode="dark"] .dash-kpi-orange .dash-kpi-value[b-9wje4sbwdj] { color: #fdba74; }
[data-mode="dark"] .dash-kpi-green .dash-kpi-value[b-9wje4sbwdj] { color: #86efac; }
[data-mode="dark"] .dash-kpi-red .dash-kpi-value[b-9wje4sbwdj] { color: #fca5a5; }

/* Modal */
.modal-backdrop[b-9wje4sbwdj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-9wje4sbwdj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9wje4sbwdj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-9wje4sbwdj] { max-width: 880px; }
.modal-header[b-9wje4sbwdj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9wje4sbwdj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-9wje4sbwdj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9wje4sbwdj] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-9wje4sbwdj] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-9wje4sbwdj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Botón Ayuda */
.btn-help[b-9wje4sbwdj] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-9wje4sbwdj] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-9wje4sbwdj] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

/* Ayuda */
.help-icon-header[b-9wje4sbwdj] { color: var(--rg-accent, #2563eb); }
.help-body[b-9wje4sbwdj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-9wje4sbwdj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-9wje4sbwdj] { border-bottom: none; }
.help-section p[b-9wje4sbwdj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-9wje4sbwdj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-9wje4sbwdj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-9wje4sbwdj] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-9wje4sbwdj] { color: var(--rg-accent, #2563eb); }
.help-tip[b-9wje4sbwdj] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-9wje4sbwdj] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-9wje4sbwdj] { background: rgba(37,99,235,0.12); }

/* Responsive */
@media (max-width: 768px) {
    .dash-kpi-grid[b-9wje4sbwdj] { grid-template-columns: repeat(2, 1fr); }
    .btn-text[b-9wje4sbwdj] { display: none; }
}
@media (max-width: 480px) {
    .dash-kpi-grid[b-9wje4sbwdj] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Desvinculaciones.razor.rz.scp.css */
/* Hereda estilo CRUD estÃ¡ndar â€” Aportaciones Â· Dividendos */
.crud-container[b-kn4s7pyh5y] { padding: 1.25rem; }
.rg-slide-up[b-kn4s7pyh5y] { animation: slideUp-b-kn4s7pyh5y .35s ease both; }
@keyframes slideUp-b-kn4s7pyh5y { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-kn4s7pyh5y] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-kn4s7pyh5y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kn4s7pyh5y] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-kn4s7pyh5y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-kn4s7pyh5y] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-kn4s7pyh5y] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-kn4s7pyh5y] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; }
.btn-crud:hover:not(:disabled)[b-kn4s7pyh5y] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-kn4s7pyh5y] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-kn4s7pyh5y] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kn4s7pyh5y] { background: var(--rg-accent, #2563eb); }
.btn-outline[b-kn4s7pyh5y] { background: transparent; }
.btn-help[b-kn4s7pyh5y] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.spin[b-kn4s7pyh5y] { animation: spin-b-kn4s7pyh5y 1s linear infinite; display: inline-block; }
@keyframes spin-b-kn4s7pyh5y { to { transform: rotate(360deg); } }
.crud-loading[b-kn4s7pyh5y] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; }
.crud-spinner[b-kn4s7pyh5y] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-kn4s7pyh5y 1s linear infinite; }
.crud-empty-state[b-kn4s7pyh5y] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-kn4s7pyh5y] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }
.crud-alert[b-kn4s7pyh5y] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-kn4s7pyh5y] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-kn4s7pyh5y] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-kn4s7pyh5y] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-kn4s7pyh5y] { color: #fca5a5; }
.crud-alert-close[b-kn4s7pyh5y] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }
.crud-grid-wrapper[b-kn4s7pyh5y] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-kn4s7pyh5y] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-kn4s7pyh5y] { background: var(--rg-bg-subtle); }
.crud-table th[b-kn4s7pyh5y] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-kn4s7pyh5y] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.font-mono[b-kn4s7pyh5y] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-kn4s7pyh5y] { text-align: center; }
.text-end[b-kn4s7pyh5y] { text-align: right; }
.col-actions[b-kn4s7pyh5y] { text-align: right; white-space: nowrap; }
.btn-icon[b-kn4s7pyh5y] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; }
.btn-icon:hover[b-kn4s7pyh5y] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-kn4s7pyh5y] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.badge[b-kn4s7pyh5y] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.b-est-CAL[b-kn4s7pyh5y] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-APR[b-kn4s7pyh5y] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-APL[b-kn4s7pyh5y] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-PEN[b-kn4s7pyh5y] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-REJ[b-kn4s7pyh5y] { background: rgba(220,38,38,0.18); color: #991b1b; }
.b-est-EJE[b-kn4s7pyh5y] { background: rgba(22,163,74,0.18); color: #15803d; }
[data-mode="dark"] .b-est-CAL[b-kn4s7pyh5y] { color: #93c5fd; }
[data-mode="dark"] .b-est-APR[b-kn4s7pyh5y] { color: #fcd34d; }
[data-mode="dark"] .b-est-APL[b-kn4s7pyh5y] { color: #86efac; }
[data-mode="dark"] .b-est-PEN[b-kn4s7pyh5y] { color: #fcd34d; }
[data-mode="dark"] .b-est-REJ[b-kn4s7pyh5y] { color: #fca5a5; }
[data-mode="dark"] .b-est-EJE[b-kn4s7pyh5y] { color: #86efac; }
/* Modal */
.modal-backdrop[b-kn4s7pyh5y] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-kn4s7pyh5y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-kn4s7pyh5y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-kn4s7pyh5y] { max-width: 800px; }
.modal-header[b-kn4s7pyh5y] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-kn4s7pyh5y] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-kn4s7pyh5y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-kn4s7pyh5y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kn4s7pyh5y] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-kn4s7pyh5y] { color: var(--rg-accent, #2563eb); }
.help-body[b-kn4s7pyh5y] { padding: 0; }
.help-section[b-kn4s7pyh5y] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-kn4s7pyh5y] { border-bottom: none; }
.help-section p[b-kn4s7pyh5y], .help-section li[b-kn4s7pyh5y] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-kn4s7pyh5y] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-kn4s7pyh5y] { color: var(--rg-accent, #2563eb); }
.help-tip[b-kn4s7pyh5y] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
[data-mode="dark"] .help-tip[b-kn4s7pyh5y] { background: rgba(37,99,235,0.12); }
.form-group[b-kn4s7pyh5y] { margin-bottom: 0.9rem; }
.form-group label[b-kn4s7pyh5y] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-kn4s7pyh5y], .form-group select[b-kn4s7pyh5y], .form-group textarea[b-kn4s7pyh5y] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-kn4s7pyh5y] { min-height: 70px; resize: vertical; }
.form-row-2[b-kn4s7pyh5y] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-check[b-kn4s7pyh5y] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-kn4s7pyh5y] { width: auto; }
.form-check-group[b-kn4s7pyh5y] { margin-top: 0.5rem; }

.btn-danger[b-kn4s7pyh5y] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DividendoCiclos.razor.rz.scp.css */
/* Hereda estilo CRUD estándar — Aportaciones · Dividendos */
.crud-container[b-et6m16yn9f] { padding: 1.25rem; }
.rg-slide-up[b-et6m16yn9f] { animation: slideUp-b-et6m16yn9f .35s ease both; }
@keyframes slideUp-b-et6m16yn9f { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-et6m16yn9f] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-et6m16yn9f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-et6m16yn9f] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-et6m16yn9f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-et6m16yn9f] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-et6m16yn9f] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-et6m16yn9f] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; }
.btn-crud:hover:not(:disabled)[b-et6m16yn9f] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-et6m16yn9f] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-et6m16yn9f] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-et6m16yn9f] { background: var(--rg-accent, #2563eb); }
.btn-outline[b-et6m16yn9f] { background: transparent; }
.btn-help[b-et6m16yn9f] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.spin[b-et6m16yn9f] { animation: spin-b-et6m16yn9f 1s linear infinite; display: inline-block; }
@keyframes spin-b-et6m16yn9f { to { transform: rotate(360deg); } }
.crud-loading[b-et6m16yn9f] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; }
.crud-spinner[b-et6m16yn9f] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-et6m16yn9f 1s linear infinite; }
.crud-empty-state[b-et6m16yn9f] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-et6m16yn9f] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }
.crud-alert[b-et6m16yn9f] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-et6m16yn9f] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-et6m16yn9f] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-et6m16yn9f] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-et6m16yn9f] { color: #fca5a5; }
.crud-alert-close[b-et6m16yn9f] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }
.crud-grid-wrapper[b-et6m16yn9f] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-et6m16yn9f] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-et6m16yn9f] { background: var(--rg-bg-subtle); }
.crud-table th[b-et6m16yn9f] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-et6m16yn9f] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.font-mono[b-et6m16yn9f] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-et6m16yn9f] { text-align: center; }
.text-end[b-et6m16yn9f] { text-align: right; }
.col-actions[b-et6m16yn9f] { text-align: right; white-space: nowrap; }
.btn-icon[b-et6m16yn9f] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; }
.btn-icon:hover[b-et6m16yn9f] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-et6m16yn9f] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.badge[b-et6m16yn9f] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.b-est-CAL[b-et6m16yn9f] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-APR[b-et6m16yn9f] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-APL[b-et6m16yn9f] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-PEN[b-et6m16yn9f] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-REJ[b-et6m16yn9f] { background: rgba(220,38,38,0.18); color: #991b1b; }
.b-est-EJE[b-et6m16yn9f] { background: rgba(22,163,74,0.18); color: #15803d; }
[data-mode="dark"] .b-est-CAL[b-et6m16yn9f] { color: #93c5fd; }
[data-mode="dark"] .b-est-APR[b-et6m16yn9f] { color: #fcd34d; }
[data-mode="dark"] .b-est-APL[b-et6m16yn9f] { color: #86efac; }
[data-mode="dark"] .b-est-PEN[b-et6m16yn9f] { color: #fcd34d; }
[data-mode="dark"] .b-est-REJ[b-et6m16yn9f] { color: #fca5a5; }
[data-mode="dark"] .b-est-EJE[b-et6m16yn9f] { color: #86efac; }
/* Modal */
.modal-backdrop[b-et6m16yn9f] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-et6m16yn9f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-et6m16yn9f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-et6m16yn9f] { max-width: 800px; }
.modal-header[b-et6m16yn9f] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-et6m16yn9f] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-et6m16yn9f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-et6m16yn9f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-et6m16yn9f] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-et6m16yn9f] { color: var(--rg-accent, #2563eb); }
.help-body[b-et6m16yn9f] { padding: 0; }
.help-section[b-et6m16yn9f] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-et6m16yn9f] { border-bottom: none; }
.help-section p[b-et6m16yn9f], .help-section li[b-et6m16yn9f] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-et6m16yn9f] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-et6m16yn9f] { color: var(--rg-accent, #2563eb); }
.help-tip[b-et6m16yn9f] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
[data-mode="dark"] .help-tip[b-et6m16yn9f] { background: rgba(37,99,235,0.12); }
.form-group[b-et6m16yn9f] { margin-bottom: 0.9rem; }
.form-group label[b-et6m16yn9f] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-et6m16yn9f], .form-group select[b-et6m16yn9f], .form-group textarea[b-et6m16yn9f] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-et6m16yn9f] { min-height: 70px; resize: vertical; }
.form-row-2[b-et6m16yn9f] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-check[b-et6m16yn9f] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-et6m16yn9f] { width: auto; }
.form-check-group[b-et6m16yn9f] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DividendoDetalle.razor.rz.scp.css */
.crud-container[b-kuez3zat21] { padding: 1.25rem; }
.rg-slide-up[b-kuez3zat21] { animation: slideUp-b-kuez3zat21 .35s ease both; }
@keyframes slideUp-b-kuez3zat21 { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-kuez3zat21] { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; }
.crud-header-left[b-kuez3zat21] { display: flex; align-items: center; gap: 0.75rem; }
.crud-title[b-kuez3zat21] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-kuez3zat21] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.btn-crud[b-kuez3zat21] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; }
.btn-outline[b-kuez3zat21] { background: transparent; }
.crud-loading[b-kuez3zat21] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; }
.crud-spinner[b-kuez3zat21] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-kuez3zat21 1s linear infinite; }
@keyframes spin-b-kuez3zat21 { to { transform: rotate(360deg); } }
.crud-empty-state[b-kuez3zat21] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.ki-row[b-kuez3zat21] { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.ki-card[b-kuez3zat21] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.85rem; }
.ki-l[b-kuez3zat21] { font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-muted); font-weight: 600; }
.ki-v[b-kuez3zat21] { font-size: 1.35rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ki-v.ki-ok[b-kuez3zat21] { color: #16a34a; } [data-mode="dark"] .ki-v.ki-ok[b-kuez3zat21] { color: #4ade80; }
.ki-v.ki-warn[b-kuez3zat21] { color: #d97706; } [data-mode="dark"] .ki-v.ki-warn[b-kuez3zat21] { color: #fbbf24; }
.crud-grid-wrapper[b-kuez3zat21] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-kuez3zat21] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-kuez3zat21] { background: var(--rg-bg-subtle); }
.crud-table th[b-kuez3zat21] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-muted); }
.crud-table td[b-kuez3zat21] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.font-mono[b-kuez3zat21] { font-family: monospace; }
.text-center[b-kuez3zat21] { text-align: center; }
.text-end[b-kuez3zat21] { text-align: right; }
.badge[b-kuez3zat21] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.b-est-CAL[b-kuez3zat21] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-APR[b-kuez3zat21] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-APL[b-kuez3zat21] { background: rgba(22,163,74,0.18); color: #15803d; }
[data-mode="dark"] .b-est-CAL[b-kuez3zat21] { color: #93c5fd; }
[data-mode="dark"] .b-est-APR[b-kuez3zat21] { color: #fcd34d; }
[data-mode="dark"] .b-est-APL[b-kuez3zat21] { color: #86efac; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DivisaOperacion.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-teueb5yw1a] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-teueb5yw1a 0.3s ease-out; }
@keyframes slideUp-b-teueb5yw1a { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-teueb5yw1a] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-teueb5yw1a] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-teueb5yw1a] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-teueb5yw1a] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-teueb5yw1a] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-teueb5yw1a] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-teueb5yw1a] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-teueb5yw1a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-teueb5yw1a] { filter: brightness(1.1); }
.btn-outline[b-teueb5yw1a] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-teueb5yw1a] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-teueb5yw1a] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-teueb5yw1a] { filter: brightness(1.1); }
.btn-icon[b-teueb5yw1a] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-teueb5yw1a] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-teueb5yw1a] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-teueb5yw1a] { color: #ef4444; }
.btn-delete:hover[b-teueb5yw1a] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-teueb5yw1a] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-teueb5yw1a] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-teueb5yw1a] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-teueb5yw1a] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-teueb5yw1a] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-teueb5yw1a] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-teueb5yw1a] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-teueb5yw1a] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-teueb5yw1a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-teueb5yw1a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-teueb5yw1a] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-teueb5yw1a] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-teueb5yw1a] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-teueb5yw1a] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-teueb5yw1a] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-teueb5yw1a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-teueb5yw1a] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-teueb5yw1a] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-teueb5yw1a] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-teueb5yw1a] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-teueb5yw1a] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-teueb5yw1a] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-teueb5yw1a] { background: #ecfdf5; color: #065f46; }
.badge-no[b-teueb5yw1a] { background: #f1f5f9; color: #64748b; }
.badge-info[b-teueb5yw1a] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-teueb5yw1a] { background: #fffbeb; color: #92400e; }
.badge-danger[b-teueb5yw1a] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-teueb5yw1a] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-teueb5yw1a] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-teueb5yw1a] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-teueb5yw1a] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-teueb5yw1a] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-teueb5yw1a] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-teueb5yw1a] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-teueb5yw1a] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-teueb5yw1a] { text-align: center; }
.text-muted[b-teueb5yw1a] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-teueb5yw1a], .crud-empty-state[b-teueb5yw1a] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-teueb5yw1a] { font-size: 2rem; }
.crud-spinner[b-teueb5yw1a] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-teueb5yw1a 0.6s linear infinite; }
.crud-spinner-sm[b-teueb5yw1a] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-teueb5yw1a 0.6s linear infinite; }
@keyframes spin-b-teueb5yw1a { to { transform: rotate(360deg); } }
.spin[b-teueb5yw1a] { animation: spin-b-teueb5yw1a 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-teueb5yw1a] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-teueb5yw1a 0.15s ease-out; }
.modal-container[b-teueb5yw1a] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-teueb5yw1a] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-teueb5yw1a 0.2s ease-out; }
.modal-lg[b-teueb5yw1a] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-teueb5yw1a] { max-width: 420px; }
@keyframes fadeIn-b-teueb5yw1a { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-teueb5yw1a { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-teueb5yw1a] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-teueb5yw1a] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-teueb5yw1a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-teueb5yw1a] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-teueb5yw1a] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-teueb5yw1a] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-teueb5yw1a] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-teueb5yw1a] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-teueb5yw1a] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-teueb5yw1a] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-teueb5yw1a] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-teueb5yw1a] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-teueb5yw1a] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-teueb5yw1a] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-teueb5yw1a] { flex: 2; }
.form-group label[b-teueb5yw1a] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-teueb5yw1a], .form-group select[b-teueb5yw1a], .form-textarea[b-teueb5yw1a] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-teueb5yw1a], .form-group select:focus[b-teueb5yw1a], .form-textarea:focus[b-teueb5yw1a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-teueb5yw1a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-teueb5yw1a] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-teueb5yw1a] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-teueb5yw1a] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-teueb5yw1a] { margin-top: 0; }
.form-section-title i[b-teueb5yw1a] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-teueb5yw1a] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-teueb5yw1a] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-teueb5yw1a] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-teueb5yw1a] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-teueb5yw1a] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-teueb5yw1a] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-teueb5yw1a] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-teueb5yw1a] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-teueb5yw1a] { padding: 0.75rem; }
    .crud-header[b-teueb5yw1a] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-teueb5yw1a] { font-size: 1.1rem; }
    .btn-text[b-teueb5yw1a] { display: none; }
    .form-row[b-teueb5yw1a] { flex-direction: column; }
    .form-row-3[b-teueb5yw1a] { grid-template-columns: 1fr; }
    .form-row-4[b-teueb5yw1a] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-teueb5yw1a] { width: 98%; max-height: 95vh; }
    .modal-lg[b-teueb5yw1a] { max-width: 98vw; width: 98vw; }
    .modal-body[b-teueb5yw1a] { padding: 0.75rem; }
    .modal-tabs[b-teueb5yw1a] { overflow-x: auto; }
    .modal-tab[b-teueb5yw1a] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-teueb5yw1a] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-teueb5yw1a] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-teueb5yw1a] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-teueb5yw1a] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-teueb5yw1a] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-teueb5yw1a] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-teueb5yw1a] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-teueb5yw1a] { border-bottom: none; }
.help-section p[b-teueb5yw1a] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-teueb5yw1a], .help-section ol[b-teueb5yw1a] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-teueb5yw1a] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-teueb5yw1a] { color: var(--rg-accent,#2563eb); }
.help-tip[b-teueb5yw1a] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-teueb5yw1a] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-teueb5yw1a] { background: rgba(37,99,235,0.12); }
.help-table[b-teueb5yw1a] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-teueb5yw1a] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-teueb5yw1a] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-teueb5yw1a] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-teueb5yw1a] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-teueb5yw1a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-teueb5yw1a] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-teueb5yw1a] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-teueb5yw1a] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-teueb5yw1a] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-teueb5yw1a] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-teueb5yw1a] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-teueb5yw1a] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-teueb5yw1a] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-teueb5yw1a] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-teueb5yw1a] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-teueb5yw1a] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-teueb5yw1a] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* === Divisas — Operación específica === */
.div-op-layout[b-teueb5yw1a] { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; padding: 0.5rem 0; }
@media (max-width: 980px) { .div-op-layout[b-teueb5yw1a] { grid-template-columns: 1fr; } }
.div-op-form[b-teueb5yw1a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.div-op-list[b-teueb5yw1a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1rem; }

.tipo-op-toggle[b-teueb5yw1a] { display: flex; gap: 0.5rem; }
.tipo-op-toggle button[b-teueb5yw1a] { flex: 1; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-secondary, #475569); cursor: pointer; font-size: 0.82rem; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 0.4rem; transition: all 0.15s; }
.tipo-op-toggle button:hover[b-teueb5yw1a] { background: var(--rg-bg-hover, #f1f5f9); }
.tipo-op-toggle button.active[b-teueb5yw1a] { border-color: var(--rg-accent, #4f46e5); background: rgba(79, 70, 229, 0.08); color: var(--rg-accent, #4f46e5); }
[data-mode="dark"] .tipo-op-toggle button.active[b-teueb5yw1a] { background: rgba(99, 102, 241, 0.15); }

.calc-result[b-teueb5yw1a] { margin-top: 1rem; background: linear-gradient(135deg, rgba(79,70,229,0.04), rgba(99,102,241,0.08)); border: 1px solid rgba(79,70,229,0.2); border-radius: 0.625rem; padding: 0.85rem 1rem; }
[data-mode="dark"] .calc-result[b-teueb5yw1a] { background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(99,102,241,0.15)); border-color: rgba(99,102,241,0.35); }
.calc-row[b-teueb5yw1a] { display: flex; justify-content: space-between; align-items: baseline; padding: 0.25rem 0; font-size: 0.85rem; }
.calc-row span[b-teueb5yw1a] { color: var(--rg-text-secondary, #475569); }
.calc-row strong[b-teueb5yw1a] { font-family: 'Cascadia Code', 'Fira Code', monospace; color: var(--rg-text-primary, #1e293b); }
.calc-row-net[b-teueb5yw1a] { border-top: 1px solid rgba(79,70,229,0.2); margin-top: 0.4rem; padding-top: 0.5rem; font-size: 1.05rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.calc-row-net strong[b-teueb5yw1a] { color: var(--rg-accent, #4f46e5); }
.calc-msg[b-teueb5yw1a] { margin-top: 0.5rem; padding: 0.5rem 0.75rem; background: rgba(37,99,235,0.08); border-radius: 0.4rem; font-size: 0.78rem; color: var(--rg-text-secondary, #475569); display: flex; gap: 0.4rem; align-items: center; }

.badge-compra[b-teueb5yw1a] { background: #ecfdf5; color: #065f46; }
.badge-venta[b-teueb5yw1a] { background: #eff6ff; color: #1e40af; }
[data-mode="dark"] .badge-compra[b-teueb5yw1a] { background: rgba(16,185,129,0.18); color: #6ee7b7; }
[data-mode="dark"] .badge-venta[b-teueb5yw1a] { background: rgba(37,99,235,0.2); color: #93c5fd; }
.row-rev[b-teueb5yw1a] { opacity: 0.5; text-decoration: line-through; }
.crud-table.sm th[b-teueb5yw1a], .crud-table.sm td[b-teueb5yw1a] { padding: 0.35rem 0.5rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DivisaPosicion.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-jtcx8n4zq4] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jtcx8n4zq4 0.3s ease-out; }
@keyframes slideUp-b-jtcx8n4zq4 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jtcx8n4zq4] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jtcx8n4zq4] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jtcx8n4zq4] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jtcx8n4zq4] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jtcx8n4zq4] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jtcx8n4zq4] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jtcx8n4zq4] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jtcx8n4zq4] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jtcx8n4zq4] { filter: brightness(1.1); }
.btn-outline[b-jtcx8n4zq4] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jtcx8n4zq4] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jtcx8n4zq4] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jtcx8n4zq4] { filter: brightness(1.1); }
.btn-icon[b-jtcx8n4zq4] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jtcx8n4zq4] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jtcx8n4zq4] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jtcx8n4zq4] { color: #ef4444; }
.btn-delete:hover[b-jtcx8n4zq4] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-jtcx8n4zq4] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-jtcx8n4zq4] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-jtcx8n4zq4] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jtcx8n4zq4] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jtcx8n4zq4] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jtcx8n4zq4] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jtcx8n4zq4] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jtcx8n4zq4] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-jtcx8n4zq4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-jtcx8n4zq4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jtcx8n4zq4] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-jtcx8n4zq4] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-jtcx8n4zq4] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jtcx8n4zq4] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jtcx8n4zq4] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jtcx8n4zq4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jtcx8n4zq4] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jtcx8n4zq4] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jtcx8n4zq4] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-jtcx8n4zq4] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-jtcx8n4zq4] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-jtcx8n4zq4] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jtcx8n4zq4] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jtcx8n4zq4] { background: #f1f5f9; color: #64748b; }
.badge-info[b-jtcx8n4zq4] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-jtcx8n4zq4] { background: #fffbeb; color: #92400e; }
.badge-danger[b-jtcx8n4zq4] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-jtcx8n4zq4] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-jtcx8n4zq4] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-jtcx8n4zq4] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-jtcx8n4zq4] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-jtcx8n4zq4] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-jtcx8n4zq4] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-jtcx8n4zq4] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-jtcx8n4zq4] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jtcx8n4zq4] { text-align: center; }
.text-muted[b-jtcx8n4zq4] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jtcx8n4zq4], .crud-empty-state[b-jtcx8n4zq4] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jtcx8n4zq4] { font-size: 2rem; }
.crud-spinner[b-jtcx8n4zq4] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jtcx8n4zq4 0.6s linear infinite; }
.crud-spinner-sm[b-jtcx8n4zq4] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jtcx8n4zq4 0.6s linear infinite; }
@keyframes spin-b-jtcx8n4zq4 { to { transform: rotate(360deg); } }
.spin[b-jtcx8n4zq4] { animation: spin-b-jtcx8n4zq4 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-jtcx8n4zq4] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jtcx8n4zq4 0.15s ease-out; }
.modal-container[b-jtcx8n4zq4] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jtcx8n4zq4] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jtcx8n4zq4 0.2s ease-out; }
.modal-lg[b-jtcx8n4zq4] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-jtcx8n4zq4] { max-width: 420px; }
@keyframes fadeIn-b-jtcx8n4zq4 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jtcx8n4zq4 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jtcx8n4zq4] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jtcx8n4zq4] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-jtcx8n4zq4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jtcx8n4zq4] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jtcx8n4zq4] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jtcx8n4zq4] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jtcx8n4zq4] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-jtcx8n4zq4] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jtcx8n4zq4] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jtcx8n4zq4] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jtcx8n4zq4] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-jtcx8n4zq4] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jtcx8n4zq4] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jtcx8n4zq4] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jtcx8n4zq4] { flex: 2; }
.form-group label[b-jtcx8n4zq4] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jtcx8n4zq4], .form-group select[b-jtcx8n4zq4], .form-textarea[b-jtcx8n4zq4] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jtcx8n4zq4], .form-group select:focus[b-jtcx8n4zq4], .form-textarea:focus[b-jtcx8n4zq4] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jtcx8n4zq4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jtcx8n4zq4] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jtcx8n4zq4] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jtcx8n4zq4] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-jtcx8n4zq4] { margin-top: 0; }
.form-section-title i[b-jtcx8n4zq4] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-jtcx8n4zq4] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-jtcx8n4zq4] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-jtcx8n4zq4] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-jtcx8n4zq4] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-jtcx8n4zq4] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-jtcx8n4zq4] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-jtcx8n4zq4] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-jtcx8n4zq4] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jtcx8n4zq4] { padding: 0.75rem; }
    .crud-header[b-jtcx8n4zq4] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jtcx8n4zq4] { font-size: 1.1rem; }
    .btn-text[b-jtcx8n4zq4] { display: none; }
    .form-row[b-jtcx8n4zq4] { flex-direction: column; }
    .form-row-3[b-jtcx8n4zq4] { grid-template-columns: 1fr; }
    .form-row-4[b-jtcx8n4zq4] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jtcx8n4zq4] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jtcx8n4zq4] { max-width: 98vw; width: 98vw; }
    .modal-body[b-jtcx8n4zq4] { padding: 0.75rem; }
    .modal-tabs[b-jtcx8n4zq4] { overflow-x: auto; }
    .modal-tab[b-jtcx8n4zq4] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-jtcx8n4zq4] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jtcx8n4zq4] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jtcx8n4zq4] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jtcx8n4zq4] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-jtcx8n4zq4] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-jtcx8n4zq4] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-jtcx8n4zq4] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-jtcx8n4zq4] { border-bottom: none; }
.help-section p[b-jtcx8n4zq4] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-jtcx8n4zq4], .help-section ol[b-jtcx8n4zq4] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-jtcx8n4zq4] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-jtcx8n4zq4] { color: var(--rg-accent,#2563eb); }
.help-tip[b-jtcx8n4zq4] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-jtcx8n4zq4] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-jtcx8n4zq4] { background: rgba(37,99,235,0.12); }
.help-table[b-jtcx8n4zq4] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-jtcx8n4zq4] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-jtcx8n4zq4] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-jtcx8n4zq4] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-jtcx8n4zq4] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-jtcx8n4zq4] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-jtcx8n4zq4] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-jtcx8n4zq4] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-jtcx8n4zq4] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-jtcx8n4zq4] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-jtcx8n4zq4] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-jtcx8n4zq4] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-jtcx8n4zq4] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-jtcx8n4zq4] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-jtcx8n4zq4] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-jtcx8n4zq4] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-jtcx8n4zq4] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* === Divisas — Posición específica === */
.div-posicion-grid[b-jtcx8n4zq4] { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; padding: 1rem 0; }
.pos-card[b-jtcx8n4zq4] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1.25rem; display: flex; flex-direction: column; gap: 0.6rem; }
.pos-card-hdr[b-jtcx8n4zq4] { display: flex; align-items: center; gap: 0.5rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.pos-card-hdr i[b-jtcx8n4zq4] { font-size: 1.4rem; color: var(--rg-accent, #4f46e5); }
.pos-moneda[b-jtcx8n4zq4] { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.pos-row[b-jtcx8n4zq4] { display: flex; justify-content: space-between; align-items: baseline; padding: 0.2rem 0; }
.pos-row-total[b-jtcx8n4zq4] { padding-top: 0.5rem; margin-top: 0.3rem; border-top: 1px dashed var(--rg-border, #e2e8f0); font-size: 1.05rem; }
.pos-label[b-jtcx8n4zq4] { font-size: 0.78rem; color: var(--rg-text-secondary, #475569); }
.pos-val[b-jtcx8n4zq4] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-weight: 700; }
.pos-val-pos[b-jtcx8n4zq4] { color: #16a34a; }
.pos-val-neg[b-jtcx8n4zq4] { color: #dc2626; }
[data-mode="dark"] .pos-val-pos[b-jtcx8n4zq4] { color: #4ade80; }
[data-mode="dark"] .pos-val-neg[b-jtcx8n4zq4] { color: #f87171; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_DivisaTasas.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-fxniq812mv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fxniq812mv 0.3s ease-out; }
@keyframes slideUp-b-fxniq812mv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fxniq812mv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fxniq812mv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fxniq812mv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fxniq812mv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fxniq812mv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fxniq812mv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fxniq812mv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fxniq812mv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fxniq812mv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fxniq812mv] { filter: brightness(1.1); }
.btn-outline[b-fxniq812mv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fxniq812mv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fxniq812mv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fxniq812mv] { filter: brightness(1.1); }
.btn-icon[b-fxniq812mv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fxniq812mv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fxniq812mv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fxniq812mv] { color: #ef4444; }
.btn-delete:hover[b-fxniq812mv] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-fxniq812mv] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-fxniq812mv] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-fxniq812mv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fxniq812mv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fxniq812mv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fxniq812mv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fxniq812mv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fxniq812mv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fxniq812mv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fxniq812mv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-fxniq812mv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-fxniq812mv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fxniq812mv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-fxniq812mv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-fxniq812mv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fxniq812mv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fxniq812mv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fxniq812mv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fxniq812mv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fxniq812mv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fxniq812mv] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-fxniq812mv] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-fxniq812mv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-fxniq812mv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fxniq812mv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fxniq812mv] { background: #f1f5f9; color: #64748b; }
.badge-info[b-fxniq812mv] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-fxniq812mv] { background: #fffbeb; color: #92400e; }
.badge-danger[b-fxniq812mv] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-fxniq812mv] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-fxniq812mv] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-fxniq812mv] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-fxniq812mv] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-fxniq812mv] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-fxniq812mv] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-fxniq812mv] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-fxniq812mv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fxniq812mv] { text-align: center; }
.text-muted[b-fxniq812mv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fxniq812mv], .crud-empty-state[b-fxniq812mv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fxniq812mv] { font-size: 2rem; }
.crud-spinner[b-fxniq812mv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fxniq812mv 0.6s linear infinite; }
.crud-spinner-sm[b-fxniq812mv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fxniq812mv 0.6s linear infinite; }
@keyframes spin-b-fxniq812mv { to { transform: rotate(360deg); } }
.spin[b-fxniq812mv] { animation: spin-b-fxniq812mv 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-fxniq812mv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fxniq812mv 0.15s ease-out; }
.modal-container[b-fxniq812mv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fxniq812mv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fxniq812mv 0.2s ease-out; }
.modal-lg[b-fxniq812mv] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-fxniq812mv] { max-width: 420px; }
@keyframes fadeIn-b-fxniq812mv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fxniq812mv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fxniq812mv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fxniq812mv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-fxniq812mv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fxniq812mv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fxniq812mv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fxniq812mv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fxniq812mv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-fxniq812mv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fxniq812mv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fxniq812mv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fxniq812mv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-fxniq812mv] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fxniq812mv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fxniq812mv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fxniq812mv] { flex: 2; }
.form-group label[b-fxniq812mv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fxniq812mv], .form-group select[b-fxniq812mv], .form-textarea[b-fxniq812mv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fxniq812mv], .form-group select:focus[b-fxniq812mv], .form-textarea:focus[b-fxniq812mv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fxniq812mv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fxniq812mv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fxniq812mv] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-fxniq812mv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fxniq812mv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-fxniq812mv] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-fxniq812mv] { margin-top: 0; }
.form-section-title i[b-fxniq812mv] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-fxniq812mv] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-fxniq812mv] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-fxniq812mv] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-fxniq812mv] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-fxniq812mv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-fxniq812mv] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-fxniq812mv] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-fxniq812mv] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-fxniq812mv] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fxniq812mv] { padding: 0.75rem; }
    .crud-header[b-fxniq812mv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fxniq812mv] { font-size: 1.1rem; }
    .btn-text[b-fxniq812mv] { display: none; }
    .form-row[b-fxniq812mv] { flex-direction: column; }
    .form-row-3[b-fxniq812mv] { grid-template-columns: 1fr; }
    .form-row-4[b-fxniq812mv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fxniq812mv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fxniq812mv] { max-width: 98vw; width: 98vw; }
    .modal-body[b-fxniq812mv] { padding: 0.75rem; }
    .modal-tabs[b-fxniq812mv] { overflow-x: auto; }
    .modal-tab[b-fxniq812mv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-fxniq812mv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fxniq812mv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fxniq812mv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fxniq812mv] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-fxniq812mv] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-fxniq812mv] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-fxniq812mv] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-fxniq812mv] { border-bottom: none; }
.help-section p[b-fxniq812mv] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-fxniq812mv], .help-section ol[b-fxniq812mv] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-fxniq812mv] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-fxniq812mv] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-fxniq812mv] { color: var(--rg-accent,#2563eb); }
.help-tip[b-fxniq812mv] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-fxniq812mv] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-fxniq812mv] { background: rgba(37,99,235,0.12); }
.help-table[b-fxniq812mv] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-fxniq812mv] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-fxniq812mv] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-fxniq812mv] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-fxniq812mv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-fxniq812mv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-fxniq812mv] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-fxniq812mv] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-fxniq812mv] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-fxniq812mv] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-fxniq812mv] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-fxniq812mv] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-fxniq812mv] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-fxniq812mv] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-fxniq812mv] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-fxniq812mv] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-fxniq812mv] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-fxniq812mv] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* === Divisas — Tasas específico === */
.crud-filter-row[b-fxniq812mv] { display: flex; gap: 0.5rem; align-items: flex-end; padding: 0.5rem 0; margin-bottom: 0.5rem; flex-wrap: wrap; }
.crud-filter-row .form-group[b-fxniq812mv] { flex: 0 0 auto; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_EstadoCuenta.razor.rz.scp.css */
/* ============================================================
   FrmAho_EstadoCuenta.razor.css
   Estado de Cuenta — Módulo de Ahorros
   Tema oscuro via variables --rg-*
   ============================================================ */

/* ── Animación entrada ──────────────────────────────────────── */
.rg-slide-up[b-i7xj9pdqnj] {
    animation: slideUp-b-i7xj9pdqnj 0.3s ease-out;
}
@keyframes slideUp-b-i7xj9pdqnj {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Layout raíz ────────────────────────────────────────────── */
.crud-container[b-i7xj9pdqnj] {
    padding: 1.25rem 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

/* ── Header ─────────────────────────────────────────────────── */
.crud-header[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.crud-header-left[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.crud-header-icon[b-i7xj9pdqnj] {
    font-size: 1.6rem;
    color: var(--rg-primary);
}
.crud-title[b-i7xj9pdqnj] {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0;
}
.crud-subtitle[b-i7xj9pdqnj] {
    font-size: 0.8rem;
    color: var(--rg-text-muted);
}
.crud-header-actions[b-i7xj9pdqnj] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

/* ── Botones estándar ───────────────────────────────────────── */
.btn-crud[b-i7xj9pdqnj] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s;
    white-space: nowrap;
}
.btn-crud:disabled[b-i7xj9pdqnj] { opacity: 0.55; cursor: not-allowed; }

.btn-primary[b-i7xj9pdqnj] {
    background: var(--rg-primary);
    color: #fff;
    border-color: var(--rg-primary);
}
.btn-primary:hover:not(:disabled)[b-i7xj9pdqnj] { filter: brightness(1.1); }

.btn-outline[b-i7xj9pdqnj] {
    background: transparent;
    color: var(--rg-text-secondary);
    border-color: var(--rg-border);
}
.btn-outline:hover:not(:disabled)[b-i7xj9pdqnj] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}

/* ── Botón Ayuda ─────────────────────────────────────────────── */
.btn-help[b-i7xj9pdqnj] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37,99,235,0.25);
    padding: 0.45rem 0.65rem;
    border-radius: 0.5rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
}
.btn-help:hover[b-i7xj9pdqnj] {
    background: rgba(37,99,235,0.16);
    border-color: rgba(37,99,235,0.5);
}
[data-mode="dark"] .btn-help[b-i7xj9pdqnj] {
    background: rgba(37,99,235,0.15);
    color: #93c5fd;
    border-color: rgba(37,99,235,0.35);
}
[data-mode="dark"] .btn-help:hover[b-i7xj9pdqnj] {
    background: rgba(37,99,235,0.25);
}

/* ── Mensaje flash ───────────────────────────────────────────── */
.crud-alert[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
    font-weight: 500;
}
.crud-alert.success[b-i7xj9pdqnj] {
    background: rgba(34,197,94,0.12);
    color: #166534;
    border: 1px solid rgba(34,197,94,0.3);
}
.crud-alert.error[b-i7xj9pdqnj] {
    background: rgba(220,38,38,0.1);
    color: #991b1b;
    border: 1px solid rgba(220,38,38,0.3);
}
[data-mode="dark"] .crud-alert.success[b-i7xj9pdqnj] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-i7xj9pdqnj]   { color: #fca5a5; }
.crud-alert-close[b-i7xj9pdqnj] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    font-size: 0.9rem;
    padding: 0.1rem 0.3rem;
}

/* ── Filtros ─────────────────────────────────────────────────── */
.ec-filtros[b-i7xj9pdqnj] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.25rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 1rem 1.25rem;
}
.ec-label[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    margin-bottom: 0.35rem;
}
.ec-filtro-cuenta[b-i7xj9pdqnj] {
    flex: 1 1 300px;
}
.ec-cuenta-input-row[b-i7xj9pdqnj] {
    display: flex;
    gap: 0.5rem;
}
.ec-input-cuenta[b-i7xj9pdqnj] {
    flex: 1;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
}
.ec-input-cuenta:focus[b-i7xj9pdqnj] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.12);
}
.ec-btn-consultar[b-i7xj9pdqnj] { flex-shrink: 0; }

.ec-filtro-fechas[b-i7xj9pdqnj] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.ec-fecha-group[b-i7xj9pdqnj] {
    display: flex;
    flex-direction: column;
}
.ec-input-fecha[b-i7xj9pdqnj] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.65rem;
    font-size: 0.85rem;
}
.ec-input-fecha:focus[b-i7xj9pdqnj] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.12);
}
.ec-btn-limpiar[b-i7xj9pdqnj] { align-self: flex-end; }

/* ── Cabecera de cuenta ──────────────────────────────────────── */
.ec-cabecera-cuenta[b-i7xj9pdqnj] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 1rem 1.25rem;
}

/* Tarjetas de saldo */
.ec-saldo-cards[b-i7xj9pdqnj] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.ec-saldo-card[b-i7xj9pdqnj] {
    display: flex;
    flex-direction: column;
    border-radius: 0.6rem;
    padding: 0.75rem 1.1rem;
    min-width: 180px;
    border: 1px solid var(--rg-border);
}
.ec-saldo-label[b-i7xj9pdqnj] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted);
    margin-bottom: 0.3rem;
}
.ec-saldo-valor[b-i7xj9pdqnj] {
    font-size: 1.25rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.ec-saldo-disponible[b-i7xj9pdqnj] {
    background: rgba(34,197,94,0.07);
    border-color: rgba(34,197,94,0.25);
}
.ec-saldo-disponible .ec-saldo-valor[b-i7xj9pdqnj] { color: #166534; }
[data-mode="dark"] .ec-saldo-disponible .ec-saldo-valor[b-i7xj9pdqnj] { color: #86efac; }

.ec-saldo-contable[b-i7xj9pdqnj] {
    background: rgba(37,99,235,0.06);
    border-color: rgba(37,99,235,0.2);
}
.ec-saldo-contable .ec-saldo-valor[b-i7xj9pdqnj] { color: var(--rg-primary); }
[data-mode="dark"] .ec-saldo-contable .ec-saldo-valor[b-i7xj9pdqnj] { color: #93c5fd; }

/* Info de cuenta */
.ec-info-cuenta[b-i7xj9pdqnj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1.5rem;
    align-items: center;
    flex: 1;
}
.ec-info-row[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.ec-info-label[b-i7xj9pdqnj] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.ec-info-val[b-i7xj9pdqnj] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--rg-text-primary);
}

/* ── Badges ─────────────────────────────────────────────────── */
.badge[b-i7xj9pdqnj] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.72rem;
    font-weight: 700;
}
.badge-yes[b-i7xj9pdqnj] {
    background: rgba(34,197,94,0.12);
    color: #166534;
    border: 1px solid rgba(34,197,94,0.3);
}
.badge-no[b-i7xj9pdqnj] {
    background: rgba(220,38,38,0.1);
    color: #991b1b;
    border: 1px solid rgba(220,38,38,0.25);
}
.badge-warn[b-i7xj9pdqnj] {
    background: rgba(217,119,6,0.12);
    color: #92400e;
    border: 1px solid rgba(217,119,6,0.25);
}
[data-mode="dark"] .badge-yes[b-i7xj9pdqnj]  { color: #86efac; }
[data-mode="dark"] .badge-no[b-i7xj9pdqnj]   { color: #fca5a5; }
[data-mode="dark"] .badge-warn[b-i7xj9pdqnj] { color: #fcd34d; }

/* ── Grid de movimientos ─────────────────────────────────────── */
.crud-grid-wrapper[b-i7xj9pdqnj] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    overflow: hidden;
    overflow-x: auto;
}
.crud-table[b-i7xj9pdqnj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.crud-table thead tr[b-i7xj9pdqnj] {
    background: var(--rg-bg-subtle);
}
.crud-table th[b-i7xj9pdqnj] {
    padding: 0.6rem 0.85rem;
    text-align: left;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
}
.crud-table td[b-i7xj9pdqnj] {
    padding: 0.55rem 0.85rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.crud-table tbody tr:last-child td[b-i7xj9pdqnj] { border-bottom: none; }
.crud-table tbody tr:hover[b-i7xj9pdqnj] { background: var(--rg-bg-hover); }
.crud-table .text-right[b-i7xj9pdqnj] { text-align: right; }
.crud-table .text-center[b-i7xj9pdqnj] { text-align: center; }

/* Tipografía monoespaciada para IDs y saldos */
.font-mono[b-i7xj9pdqnj] { font-family: 'Courier New', Courier, monospace; }

/* Movimientos con color */
.ec-mov-cre[b-i7xj9pdqnj] {
    color: #166534;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
[data-mode="dark"] .ec-mov-cre[b-i7xj9pdqnj] { color: #86efac; }

.ec-mov-deb[b-i7xj9pdqnj] {
    color: #991b1b;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
[data-mode="dark"] .ec-mov-deb[b-i7xj9pdqnj] { color: #fca5a5; }

.ec-mov-anulado[b-i7xj9pdqnj] {
    text-decoration: line-through;
    opacity: 0.6;
}

.ec-row-anulado td[b-i7xj9pdqnj] {
    opacity: 0.5;
}
.ec-row-anulado td:last-child[b-i7xj9pdqnj] { opacity: 1; }

.ec-saldo-col[b-i7xj9pdqnj] {
    font-variant-numeric: tabular-nums;
    color: var(--rg-text-primary);
}

.ec-tipo-badge[b-i7xj9pdqnj] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    padding: 0.1rem 0.4rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--rg-text-secondary);
    font-family: 'Courier New', Courier, monospace;
}

.ec-referencia[b-i7xj9pdqnj] {
    color: var(--rg-text-muted);
    font-size: 0.78rem;
}

/* ── Paginación ──────────────────────────────────────────────── */
.ec-paginacion[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-top: none;
    border-radius: 0 0 0.75rem 0.75rem;
}
.ec-paginacion-info[b-i7xj9pdqnj] {
    font-size: 0.8rem;
    color: var(--rg-text-muted);
}

/* ── Estados vacíos y de carga ───────────────────────────────── */
.crud-loading[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-secondary);
    font-size: 0.9rem;
}
.crud-spinner[b-i7xj9pdqnj] {
    width: 1.5rem;
    height: 1.5rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: spin-b-i7xj9pdqnj 0.75s linear infinite;
}
@keyframes spin-b-i7xj9pdqnj { to { transform: rotate(360deg); } }
.spin[b-i7xj9pdqnj] { animation: spin-b-i7xj9pdqnj 0.75s linear infinite; display: inline-block; }

.crud-empty-state[b-i7xj9pdqnj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    color: var(--rg-text-muted);
    text-align: center;
    gap: 0.75rem;
}
.crud-empty-state i[b-i7xj9pdqnj] { font-size: 2.5rem; }
.crud-empty-state p[b-i7xj9pdqnj] { font-size: 0.9rem; }

/* ── Estado inicial (sin consulta) ──────────────────────────── */
.ec-estado-inicial[b-i7xj9pdqnj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    color: var(--rg-text-muted);
    text-align: center;
    gap: 1rem;
    border: 2px dashed var(--rg-border);
    border-radius: 0.75rem;
    margin-top: 0.5rem;
}
.ec-estado-inicial-icon[b-i7xj9pdqnj] { font-size: 3rem; opacity: 0.4; }
.ec-estado-inicial p[b-i7xj9pdqnj] { font-size: 0.9rem; }

/* ── Modal ───────────────────────────────────────────────────── */
.modal-backdrop[b-i7xj9pdqnj] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
}
.modal-container[b-i7xj9pdqnj] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.modal-dialog[b-i7xj9pdqnj] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 680px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.modal-header[b-i7xj9pdqnj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.modal-header h2[b-i7xj9pdqnj] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-close[b-i7xj9pdqnj] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-i7xj9pdqnj] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}
.modal-body[b-i7xj9pdqnj] {
    padding: 0;
    overflow-y: auto;
    flex: 1;
}
.modal-footer[b-i7xj9pdqnj] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Contenido del modal de ayuda ────────────────────────────── */
.help-icon-header[b-i7xj9pdqnj] { color: var(--rg-accent, #2563eb); margin-right: 0.25rem; }
.help-body[b-i7xj9pdqnj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-i7xj9pdqnj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-i7xj9pdqnj] { border-bottom: none; }
.help-section p[b-i7xj9pdqnj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-i7xj9pdqnj], .help-section ol[b-i7xj9pdqnj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-i7xj9pdqnj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-i7xj9pdqnj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin-bottom: 0.65rem;
}
.help-section-title i[b-i7xj9pdqnj] { color: var(--rg-accent, #2563eb); }
.help-tip[b-i7xj9pdqnj] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    background: rgba(37,99,235,0.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.65rem 0.8rem;
    margin-top: 0.5rem;
    font-size: 0.82rem;
    color: var(--rg-text-secondary, #475569);
}
.help-tip i[b-i7xj9pdqnj] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-i7xj9pdqnj] { background: rgba(37,99,235,0.12); }
.help-steps[b-i7xj9pdqnj] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-i7xj9pdqnj] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-i7xj9pdqnj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    background: var(--rg-accent, #2563eb);
    color: #fff;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 0.1rem;
}
.help-step div[b-i7xj9pdqnj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); padding-top: 0.1rem; }
.help-table[b-i7xj9pdqnj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
    margin-top: 0.25rem;
}
.help-table th[b-i7xj9pdqnj] {
    background: var(--rg-bg-subtle, #f8fafc);
    font-weight: 600;
    text-align: left;
    padding: 0.4rem 0.6rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    font-size: 0.72rem;
    text-transform: uppercase;
    color: var(--rg-text-muted, #94a3b8);
}
.help-table td[b-i7xj9pdqnj] {
    padding: 0.4rem 0.6rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
    vertical-align: top;
}
[data-mode="dark"] .help-table th[b-i7xj9pdqnj] { background: rgba(255,255,255,0.04); }
.help-badge[b-i7xj9pdqnj] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-i7xj9pdqnj]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-danger[b-i7xj9pdqnj] { background: rgba(220,38,38,0.12);  color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-i7xj9pdqnj]     { color: #86efac; }
[data-mode="dark"] .help-badge-danger[b-i7xj9pdqnj] { color: #fca5a5; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-i7xj9pdqnj] { padding: 0.75rem; }
    .ec-filtros[b-i7xj9pdqnj] { padding: 0.75rem; }
    .ec-saldo-cards[b-i7xj9pdqnj] { flex-direction: column; }
    .ec-saldo-card[b-i7xj9pdqnj] { min-width: unset; }
    .crud-table[b-i7xj9pdqnj] { font-size: 0.75rem; }
    .crud-table th[b-i7xj9pdqnj], .crud-table td[b-i7xj9pdqnj] { padding: 0.4rem 0.5rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_EstadoCuentaProgramado.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-inv495xfgr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-inv495xfgr 0.3s ease-out; }
@keyframes slideUp-b-inv495xfgr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-inv495xfgr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-inv495xfgr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-inv495xfgr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-inv495xfgr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-inv495xfgr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-inv495xfgr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-inv495xfgr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-inv495xfgr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-inv495xfgr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-inv495xfgr] { filter: brightness(1.1); }
.btn-outline[b-inv495xfgr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-inv495xfgr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-inv495xfgr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-inv495xfgr] { filter: brightness(1.1); }
.btn-icon[b-inv495xfgr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-inv495xfgr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-inv495xfgr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-inv495xfgr] { color: #ef4444; }
.btn-delete:hover[b-inv495xfgr] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-inv495xfgr] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-inv495xfgr] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-inv495xfgr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-inv495xfgr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-inv495xfgr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-inv495xfgr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-inv495xfgr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-inv495xfgr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-inv495xfgr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-inv495xfgr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-inv495xfgr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-inv495xfgr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-inv495xfgr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-inv495xfgr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-inv495xfgr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-inv495xfgr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-inv495xfgr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-inv495xfgr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-inv495xfgr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-inv495xfgr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-inv495xfgr] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-inv495xfgr] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-inv495xfgr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-inv495xfgr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-inv495xfgr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-inv495xfgr] { background: #f1f5f9; color: #64748b; }
.badge-info[b-inv495xfgr] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-inv495xfgr] { background: #fffbeb; color: #92400e; }
.badge-danger[b-inv495xfgr] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-inv495xfgr] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-inv495xfgr] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-inv495xfgr] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-inv495xfgr] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-inv495xfgr] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-inv495xfgr] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-inv495xfgr] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-inv495xfgr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-inv495xfgr] { text-align: center; }
.text-muted[b-inv495xfgr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-inv495xfgr], .crud-empty-state[b-inv495xfgr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-inv495xfgr] { font-size: 2rem; }
.crud-spinner[b-inv495xfgr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-inv495xfgr 0.6s linear infinite; }
.crud-spinner-sm[b-inv495xfgr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-inv495xfgr 0.6s linear infinite; }
@keyframes spin-b-inv495xfgr { to { transform: rotate(360deg); } }
.spin[b-inv495xfgr] { animation: spin-b-inv495xfgr 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-inv495xfgr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-inv495xfgr 0.15s ease-out; }
.modal-container[b-inv495xfgr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-inv495xfgr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-inv495xfgr 0.2s ease-out; }
.modal-lg[b-inv495xfgr] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-inv495xfgr] { max-width: 420px; }
@keyframes fadeIn-b-inv495xfgr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-inv495xfgr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-inv495xfgr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-inv495xfgr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-inv495xfgr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-inv495xfgr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-inv495xfgr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-inv495xfgr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-inv495xfgr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-inv495xfgr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-inv495xfgr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-inv495xfgr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-inv495xfgr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-inv495xfgr] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-inv495xfgr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-inv495xfgr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-inv495xfgr] { flex: 2; }
.form-group label[b-inv495xfgr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-inv495xfgr], .form-group select[b-inv495xfgr], .form-textarea[b-inv495xfgr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-inv495xfgr], .form-group select:focus[b-inv495xfgr], .form-textarea:focus[b-inv495xfgr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-inv495xfgr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-inv495xfgr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-inv495xfgr] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-inv495xfgr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-inv495xfgr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-inv495xfgr] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-inv495xfgr] { margin-top: 0; }
.form-section-title i[b-inv495xfgr] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-inv495xfgr] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-inv495xfgr] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-inv495xfgr] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-inv495xfgr] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-inv495xfgr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-inv495xfgr] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-inv495xfgr] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-inv495xfgr] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-inv495xfgr] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-inv495xfgr] { padding: 0.75rem; }
    .crud-header[b-inv495xfgr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-inv495xfgr] { font-size: 1.1rem; }
    .btn-text[b-inv495xfgr] { display: none; }
    .form-row[b-inv495xfgr] { flex-direction: column; }
    .form-row-3[b-inv495xfgr] { grid-template-columns: 1fr; }
    .form-row-4[b-inv495xfgr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-inv495xfgr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-inv495xfgr] { max-width: 98vw; width: 98vw; }
    .modal-body[b-inv495xfgr] { padding: 0.75rem; }
    .modal-tabs[b-inv495xfgr] { overflow-x: auto; }
    .modal-tab[b-inv495xfgr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-inv495xfgr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-inv495xfgr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-inv495xfgr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-inv495xfgr] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-inv495xfgr] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-inv495xfgr] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-inv495xfgr] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-inv495xfgr] { border-bottom: none; }
.help-section p[b-inv495xfgr] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-inv495xfgr], .help-section ol[b-inv495xfgr] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-inv495xfgr] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-inv495xfgr] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-inv495xfgr] { color: var(--rg-accent,#2563eb); }
.help-tip[b-inv495xfgr] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-inv495xfgr] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-inv495xfgr] { background: rgba(37,99,235,0.12); }
.help-table[b-inv495xfgr] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-inv495xfgr] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-inv495xfgr] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-inv495xfgr] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-inv495xfgr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-inv495xfgr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-inv495xfgr] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-inv495xfgr] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-inv495xfgr] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-inv495xfgr] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-inv495xfgr] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-inv495xfgr] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-inv495xfgr] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-inv495xfgr] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-inv495xfgr] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-inv495xfgr] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-inv495xfgr] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-inv495xfgr] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-inv495xfgr] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-inv495xfgr] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-inv495xfgr] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-inv495xfgr] { font-size: 1.6rem; }
.pos-op-btn > div[b-inv495xfgr] { display: flex; flex-direction: column; }
.pos-op-title[b-inv495xfgr] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-inv495xfgr] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-inv495xfgr] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-inv495xfgr] { color: var(--rg-success); }
.pos-op-ret[b-inv495xfgr] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-inv495xfgr] { color: var(--rg-danger); }

.pos-cuenta-search[b-inv495xfgr] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-inv495xfgr] { flex: 1; }

.pos-cuenta-card[b-inv495xfgr] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-inv495xfgr] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-inv495xfgr] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-inv495xfgr] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-inv495xfgr] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-inv495xfgr] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-inv495xfgr] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-inv495xfgr], .pos-res-saldos > div[b-inv495xfgr] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-inv495xfgr] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-inv495xfgr] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-inv495xfgr] { color: var(--rg-success); }
.pos-cuenta-aviso[b-inv495xfgr] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-inv495xfgr] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-inv495xfgr] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-inv495xfgr] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-inv495xfgr] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-inv495xfgr]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-inv495xfgr] { z-index: 2001 !important; }

.badge-warn[b-inv495xfgr] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-inv495xfgr] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-inv495xfgr] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-inv495xfgr] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-inv495xfgr] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-inv495xfgr] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-inv495xfgr] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-inv495xfgr] { margin-bottom: 0; }
.dv-periodo input[b-inv495xfgr], .dv-periodo select[b-inv495xfgr] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-inv495xfgr] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-inv495xfgr] { text-align: right; }
.badge-warn[b-inv495xfgr] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-inv495xfgr] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-inv495xfgr] { flex-direction: column; align-items: stretch; } .dv-periodo[b-inv495xfgr], .dv-acciones[b-inv495xfgr] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-inv495xfgr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-inv495xfgr] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-inv495xfgr] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-inv495xfgr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-inv495xfgr] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-inv495xfgr] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-inv495xfgr] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-inv495xfgr] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-inv495xfgr] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-inv495xfgr] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-inv495xfgr] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-inv495xfgr] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-inv495xfgr] { border-bottom: none; }
.config-toggle-label[b-inv495xfgr] { flex: 1; }
.config-toggle-name[b-inv495xfgr] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-inv495xfgr] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-inv495xfgr] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-inv495xfgr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-inv495xfgr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-inv495xfgr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-inv495xfgr], .form-group select[b-inv495xfgr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_EventosNotificacion.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-82fsjmbnwe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-82fsjmbnwe 0.3s ease-out; }
@keyframes slideUp-b-82fsjmbnwe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-82fsjmbnwe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-82fsjmbnwe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-82fsjmbnwe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-82fsjmbnwe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-82fsjmbnwe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-82fsjmbnwe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-82fsjmbnwe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-82fsjmbnwe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-82fsjmbnwe] { filter: brightness(1.1); }
.btn-outline[b-82fsjmbnwe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-82fsjmbnwe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-82fsjmbnwe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-82fsjmbnwe] { filter: brightness(1.1); }
.btn-icon[b-82fsjmbnwe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-82fsjmbnwe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-82fsjmbnwe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-82fsjmbnwe] { color: #ef4444; }
.btn-delete:hover[b-82fsjmbnwe] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-82fsjmbnwe] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-82fsjmbnwe] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-82fsjmbnwe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-82fsjmbnwe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-82fsjmbnwe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-82fsjmbnwe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-82fsjmbnwe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-82fsjmbnwe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-82fsjmbnwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-82fsjmbnwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-82fsjmbnwe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-82fsjmbnwe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-82fsjmbnwe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-82fsjmbnwe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-82fsjmbnwe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-82fsjmbnwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-82fsjmbnwe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-82fsjmbnwe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-82fsjmbnwe] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-82fsjmbnwe] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-82fsjmbnwe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-82fsjmbnwe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-82fsjmbnwe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-82fsjmbnwe] { background: #f1f5f9; color: #64748b; }
.badge-info[b-82fsjmbnwe] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-82fsjmbnwe] { background: #fffbeb; color: #92400e; }
.badge-danger[b-82fsjmbnwe] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-82fsjmbnwe] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-82fsjmbnwe] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-82fsjmbnwe] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-82fsjmbnwe] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-82fsjmbnwe] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-82fsjmbnwe] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-82fsjmbnwe] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-82fsjmbnwe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-82fsjmbnwe] { text-align: center; }
.text-muted[b-82fsjmbnwe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-82fsjmbnwe], .crud-empty-state[b-82fsjmbnwe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-82fsjmbnwe] { font-size: 2rem; }
.crud-spinner[b-82fsjmbnwe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-82fsjmbnwe 0.6s linear infinite; }
.crud-spinner-sm[b-82fsjmbnwe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-82fsjmbnwe 0.6s linear infinite; }
@keyframes spin-b-82fsjmbnwe { to { transform: rotate(360deg); } }
.spin[b-82fsjmbnwe] { animation: spin-b-82fsjmbnwe 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-82fsjmbnwe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-82fsjmbnwe 0.15s ease-out; }
.modal-container[b-82fsjmbnwe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-82fsjmbnwe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-82fsjmbnwe 0.2s ease-out; }
.modal-lg[b-82fsjmbnwe] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-82fsjmbnwe] { max-width: 420px; }
@keyframes fadeIn-b-82fsjmbnwe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-82fsjmbnwe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-82fsjmbnwe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-82fsjmbnwe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-82fsjmbnwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-82fsjmbnwe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-82fsjmbnwe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-82fsjmbnwe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-82fsjmbnwe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-82fsjmbnwe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-82fsjmbnwe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-82fsjmbnwe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-82fsjmbnwe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-82fsjmbnwe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-82fsjmbnwe] { flex: 2; }
.form-group label[b-82fsjmbnwe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-82fsjmbnwe], .form-group select[b-82fsjmbnwe], .form-textarea[b-82fsjmbnwe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-82fsjmbnwe], .form-group select:focus[b-82fsjmbnwe], .form-textarea:focus[b-82fsjmbnwe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-82fsjmbnwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-82fsjmbnwe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-82fsjmbnwe] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-82fsjmbnwe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-82fsjmbnwe] { margin-top: 0; }
.form-section-title i[b-82fsjmbnwe] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-82fsjmbnwe] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-82fsjmbnwe] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-82fsjmbnwe] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-82fsjmbnwe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-82fsjmbnwe] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-82fsjmbnwe] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-82fsjmbnwe] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-82fsjmbnwe] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-82fsjmbnwe] { padding: 0.75rem; }
    .crud-header[b-82fsjmbnwe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-82fsjmbnwe] { font-size: 1.1rem; }
    .btn-text[b-82fsjmbnwe] { display: none; }
    .form-row[b-82fsjmbnwe] { flex-direction: column; }
    .form-row-3[b-82fsjmbnwe] { grid-template-columns: 1fr; }
    .form-row-4[b-82fsjmbnwe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-82fsjmbnwe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-82fsjmbnwe] { max-width: 98vw; width: 98vw; }
    .modal-body[b-82fsjmbnwe] { padding: 0.75rem; }
    .modal-tabs[b-82fsjmbnwe] { overflow-x: auto; }
    .modal-tab[b-82fsjmbnwe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-82fsjmbnwe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-82fsjmbnwe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-82fsjmbnwe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-82fsjmbnwe] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-82fsjmbnwe] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-82fsjmbnwe] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-82fsjmbnwe] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-82fsjmbnwe] { border-bottom: none; }
.help-section p[b-82fsjmbnwe] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-82fsjmbnwe], .help-section ol[b-82fsjmbnwe] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-82fsjmbnwe] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-82fsjmbnwe] { color: var(--rg-accent,#2563eb); }
.help-tip[b-82fsjmbnwe] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-82fsjmbnwe] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-82fsjmbnwe] { background: rgba(37,99,235,0.12); }
.help-table[b-82fsjmbnwe] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-82fsjmbnwe] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-82fsjmbnwe] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-82fsjmbnwe] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-82fsjmbnwe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-82fsjmbnwe] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-82fsjmbnwe] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-82fsjmbnwe] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-82fsjmbnwe] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-82fsjmbnwe] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-82fsjmbnwe] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-82fsjmbnwe] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-82fsjmbnwe] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-82fsjmbnwe] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-82fsjmbnwe] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-82fsjmbnwe] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-82fsjmbnwe] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-82fsjmbnwe] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-82fsjmbnwe] { font-size: 1.6rem; }
.pos-op-btn > div[b-82fsjmbnwe] { display: flex; flex-direction: column; }
.pos-op-title[b-82fsjmbnwe] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-82fsjmbnwe] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-82fsjmbnwe] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-82fsjmbnwe] { color: var(--rg-success); }
.pos-op-ret[b-82fsjmbnwe] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-82fsjmbnwe] { color: var(--rg-danger); }

.pos-cuenta-search[b-82fsjmbnwe] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-82fsjmbnwe] { flex: 1; }

.pos-cuenta-card[b-82fsjmbnwe] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-82fsjmbnwe] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-82fsjmbnwe] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-82fsjmbnwe] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-82fsjmbnwe] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-82fsjmbnwe], .pos-res-saldos > div[b-82fsjmbnwe] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-82fsjmbnwe] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-82fsjmbnwe] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-82fsjmbnwe] { color: var(--rg-success); }
.pos-cuenta-aviso[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-82fsjmbnwe] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-82fsjmbnwe] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-82fsjmbnwe] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-82fsjmbnwe] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-82fsjmbnwe]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-82fsjmbnwe] { z-index: 2001 !important; }

.badge-warn[b-82fsjmbnwe] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-82fsjmbnwe] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-82fsjmbnwe] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-82fsjmbnwe] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-82fsjmbnwe] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-82fsjmbnwe] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-82fsjmbnwe] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-82fsjmbnwe] { margin-bottom: 0; }
.dv-periodo input[b-82fsjmbnwe], .dv-periodo select[b-82fsjmbnwe] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-82fsjmbnwe] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-82fsjmbnwe] { text-align: right; }
.badge-warn[b-82fsjmbnwe] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-82fsjmbnwe] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-82fsjmbnwe] { flex-direction: column; align-items: stretch; } .dv-periodo[b-82fsjmbnwe], .dv-acciones[b-82fsjmbnwe] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-82fsjmbnwe] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-82fsjmbnwe] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-82fsjmbnwe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-82fsjmbnwe] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-82fsjmbnwe] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-82fsjmbnwe] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-82fsjmbnwe] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-82fsjmbnwe] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-82fsjmbnwe] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-82fsjmbnwe] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-82fsjmbnwe] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-82fsjmbnwe] { border-bottom: none; }
.config-toggle-label[b-82fsjmbnwe] { flex: 1; }
.config-toggle-name[b-82fsjmbnwe] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-82fsjmbnwe] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-82fsjmbnwe] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-82fsjmbnwe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-82fsjmbnwe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-82fsjmbnwe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-82fsjmbnwe], .form-group select[b-82fsjmbnwe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Frecuencias.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-edcebsrfsn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-edcebsrfsn 0.3s ease-out; }
@keyframes slideUp-b-edcebsrfsn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-edcebsrfsn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-edcebsrfsn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-edcebsrfsn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-edcebsrfsn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-edcebsrfsn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-edcebsrfsn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-edcebsrfsn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-edcebsrfsn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-edcebsrfsn] { filter: brightness(1.1); }
.btn-outline[b-edcebsrfsn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-edcebsrfsn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-edcebsrfsn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-edcebsrfsn] { filter: brightness(1.1); }
.btn-icon[b-edcebsrfsn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-edcebsrfsn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-edcebsrfsn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-edcebsrfsn] { color: #ef4444; }
.btn-delete:hover[b-edcebsrfsn] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-edcebsrfsn] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-edcebsrfsn] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-edcebsrfsn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-edcebsrfsn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-edcebsrfsn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-edcebsrfsn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-edcebsrfsn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-edcebsrfsn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-edcebsrfsn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-edcebsrfsn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-edcebsrfsn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-edcebsrfsn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-edcebsrfsn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-edcebsrfsn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-edcebsrfsn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-edcebsrfsn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-edcebsrfsn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-edcebsrfsn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-edcebsrfsn] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-edcebsrfsn] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-edcebsrfsn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-edcebsrfsn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-edcebsrfsn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-edcebsrfsn] { background: #f1f5f9; color: #64748b; }
.badge-info[b-edcebsrfsn] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-edcebsrfsn] { background: #fffbeb; color: #92400e; }
.badge-danger[b-edcebsrfsn] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-edcebsrfsn] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-edcebsrfsn] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-edcebsrfsn] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-edcebsrfsn] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-edcebsrfsn] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-edcebsrfsn] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-edcebsrfsn] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-edcebsrfsn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-edcebsrfsn] { text-align: center; }
.text-muted[b-edcebsrfsn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-edcebsrfsn], .crud-empty-state[b-edcebsrfsn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-edcebsrfsn] { font-size: 2rem; }
.crud-spinner[b-edcebsrfsn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-edcebsrfsn 0.6s linear infinite; }
.crud-spinner-sm[b-edcebsrfsn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-edcebsrfsn 0.6s linear infinite; }
@keyframes spin-b-edcebsrfsn { to { transform: rotate(360deg); } }
.spin[b-edcebsrfsn] { animation: spin-b-edcebsrfsn 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-edcebsrfsn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-edcebsrfsn 0.15s ease-out; }
.modal-container[b-edcebsrfsn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-edcebsrfsn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-edcebsrfsn 0.2s ease-out; }
.modal-lg[b-edcebsrfsn] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-edcebsrfsn] { max-width: 420px; }
@keyframes fadeIn-b-edcebsrfsn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-edcebsrfsn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-edcebsrfsn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-edcebsrfsn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-edcebsrfsn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-edcebsrfsn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-edcebsrfsn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-edcebsrfsn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-edcebsrfsn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-edcebsrfsn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-edcebsrfsn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-edcebsrfsn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-edcebsrfsn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-edcebsrfsn] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-edcebsrfsn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-edcebsrfsn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-edcebsrfsn] { flex: 2; }
.form-group label[b-edcebsrfsn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-edcebsrfsn], .form-group select[b-edcebsrfsn], .form-textarea[b-edcebsrfsn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-edcebsrfsn], .form-group select:focus[b-edcebsrfsn], .form-textarea:focus[b-edcebsrfsn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-edcebsrfsn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-edcebsrfsn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-edcebsrfsn] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-edcebsrfsn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-edcebsrfsn] { margin-top: 0; }
.form-section-title i[b-edcebsrfsn] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-edcebsrfsn] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-edcebsrfsn] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-edcebsrfsn] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-edcebsrfsn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-edcebsrfsn] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-edcebsrfsn] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-edcebsrfsn] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-edcebsrfsn] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-edcebsrfsn] { padding: 0.75rem; }
    .crud-header[b-edcebsrfsn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-edcebsrfsn] { font-size: 1.1rem; }
    .btn-text[b-edcebsrfsn] { display: none; }
    .form-row[b-edcebsrfsn] { flex-direction: column; }
    .form-row-3[b-edcebsrfsn] { grid-template-columns: 1fr; }
    .form-row-4[b-edcebsrfsn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-edcebsrfsn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-edcebsrfsn] { max-width: 98vw; width: 98vw; }
    .modal-body[b-edcebsrfsn] { padding: 0.75rem; }
    .modal-tabs[b-edcebsrfsn] { overflow-x: auto; }
    .modal-tab[b-edcebsrfsn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-edcebsrfsn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-edcebsrfsn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-edcebsrfsn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-edcebsrfsn] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-edcebsrfsn] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-edcebsrfsn] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-edcebsrfsn] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-edcebsrfsn] { border-bottom: none; }
.help-section p[b-edcebsrfsn] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-edcebsrfsn], .help-section ol[b-edcebsrfsn] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-edcebsrfsn] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-edcebsrfsn] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-edcebsrfsn] { color: var(--rg-accent,#2563eb); }
.help-tip[b-edcebsrfsn] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-edcebsrfsn] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-edcebsrfsn] { background: rgba(37,99,235,0.12); }
.help-table[b-edcebsrfsn] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-edcebsrfsn] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-edcebsrfsn] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-edcebsrfsn] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_HistorialReversos.razor.rz.scp.css */
/* ============================================================
   FrmAho_HistorialReversos — Historial de Reversos (solo lectura)
   ============================================================ */

.crud-container[b-u6l4ug1gbj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-u6l4ug1gbj 0.3s ease-out; }
@keyframes slideUp-b-u6l4ug1gbj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-u6l4ug1gbj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-u6l4ug1gbj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-u6l4ug1gbj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-u6l4ug1gbj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-u6l4ug1gbj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-u6l4ug1gbj] { display: flex; gap: 0.5rem; }

.btn-crud[b-u6l4ug1gbj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-u6l4ug1gbj] { opacity: 0.6; cursor: not-allowed; }
.btn-outline[b-u6l4ug1gbj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-u6l4ug1gbj] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-u6l4ug1gbj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-u6l4ug1gbj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-u6l4ug1gbj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-u6l4ug1gbj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-search-bar[b-u6l4ug1gbj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); flex-wrap: wrap; }
.crud-search-bar input[b-u6l4ug1gbj] { flex: 1; min-width: 150px; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-u6l4ug1gbj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-u6l4ug1gbj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-u6l4ug1gbj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-u6l4ug1gbj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

.crud-grid-wrapper[b-u6l4ug1gbj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-u6l4ug1gbj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-u6l4ug1gbj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-u6l4ug1gbj] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-u6l4ug1gbj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-u6l4ug1gbj] { background: var(--rg-bg-hover, #f8fafc); }

.rev-motivo-cell[b-u6l4ug1gbj] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: help; }

.badge[b-u6l4ug1gbj] { display: inline-flex; align-items: center; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-u6l4ug1gbj] { background: #ecfdf5; color: #065f46; }
.badge-info[b-u6l4ug1gbj] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-u6l4ug1gbj] { background: #fffbeb; color: #92400e; }
.badge-danger[b-u6l4ug1gbj] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-u6l4ug1gbj] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-u6l4ug1gbj] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-info[b-u6l4ug1gbj] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-u6l4ug1gbj] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-u6l4ug1gbj] { background: rgba(220,38,38,0.18); color: #fca5a5; }

.font-mono[b-u6l4ug1gbj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-u6l4ug1gbj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

.crud-loading[b-u6l4ug1gbj], .crud-empty-state[b-u6l4ug1gbj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-u6l4ug1gbj] { font-size: 2rem; }
.crud-spinner[b-u6l4ug1gbj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-u6l4ug1gbj 0.6s linear infinite; }
@keyframes spin-b-u6l4ug1gbj { to { transform: rotate(360deg); } }
.spin[b-u6l4ug1gbj] { animation: spin-b-u6l4ug1gbj 0.8s linear infinite; }

.modal-backdrop[b-u6l4ug1gbj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-u6l4ug1gbj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-u6l4ug1gbj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-u6l4ug1gbj] { max-width: 880px; }
.modal-header[b-u6l4ug1gbj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-u6l4ug1gbj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-u6l4ug1gbj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-u6l4ug1gbj] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-u6l4ug1gbj] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-u6l4ug1gbj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.btn-help[b-u6l4ug1gbj] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-u6l4ug1gbj] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-u6l4ug1gbj] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

.help-icon-header[b-u6l4ug1gbj] { color: var(--rg-accent, #2563eb); }
.help-body[b-u6l4ug1gbj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-u6l4ug1gbj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-u6l4ug1gbj] { border-bottom: none; }
.help-section p[b-u6l4ug1gbj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-u6l4ug1gbj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-u6l4ug1gbj] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-u6l4ug1gbj] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-u6l4ug1gbj] { color: var(--rg-accent, #2563eb); }
.help-tip[b-u6l4ug1gbj] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-u6l4ug1gbj] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-u6l4ug1gbj] { background: rgba(37,99,235,0.12); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_MaestraCuentas.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-n281bpk8gl] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-n281bpk8gl 0.3s ease-out; }
@keyframes slideUp-b-n281bpk8gl { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-n281bpk8gl] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-n281bpk8gl] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-n281bpk8gl] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-n281bpk8gl] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-n281bpk8gl] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-n281bpk8gl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-n281bpk8gl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-n281bpk8gl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-n281bpk8gl] { filter: brightness(1.1); }
.btn-outline[b-n281bpk8gl] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-n281bpk8gl] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-n281bpk8gl] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-n281bpk8gl] { filter: brightness(1.1); }
.btn-icon[b-n281bpk8gl] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-n281bpk8gl] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-n281bpk8gl] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-n281bpk8gl] { color: #ef4444; }
.btn-delete:hover[b-n281bpk8gl] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-n281bpk8gl] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-n281bpk8gl] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-n281bpk8gl] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-n281bpk8gl] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-n281bpk8gl] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-n281bpk8gl] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-n281bpk8gl] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-n281bpk8gl] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-n281bpk8gl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-n281bpk8gl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-n281bpk8gl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-n281bpk8gl] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-n281bpk8gl] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-n281bpk8gl] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-n281bpk8gl] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-n281bpk8gl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-n281bpk8gl] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-n281bpk8gl] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-n281bpk8gl] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-n281bpk8gl] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-n281bpk8gl] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-n281bpk8gl] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-n281bpk8gl] { background: #ecfdf5; color: #065f46; }
.badge-no[b-n281bpk8gl] { background: #f1f5f9; color: #64748b; }
.badge-info[b-n281bpk8gl] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-n281bpk8gl] { background: #fffbeb; color: #92400e; }
.badge-danger[b-n281bpk8gl] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-n281bpk8gl] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-n281bpk8gl] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-n281bpk8gl] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-n281bpk8gl] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-n281bpk8gl] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-n281bpk8gl] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-n281bpk8gl] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-n281bpk8gl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-n281bpk8gl] { text-align: center; }
.text-muted[b-n281bpk8gl] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-n281bpk8gl], .crud-empty-state[b-n281bpk8gl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-n281bpk8gl] { font-size: 2rem; }
.crud-spinner[b-n281bpk8gl] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-n281bpk8gl 0.6s linear infinite; }
.crud-spinner-sm[b-n281bpk8gl] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-n281bpk8gl 0.6s linear infinite; }
@keyframes spin-b-n281bpk8gl { to { transform: rotate(360deg); } }
.spin[b-n281bpk8gl] { animation: spin-b-n281bpk8gl 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-n281bpk8gl] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-n281bpk8gl 0.15s ease-out; }
.modal-container[b-n281bpk8gl] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-n281bpk8gl] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-n281bpk8gl 0.2s ease-out; }
.modal-lg[b-n281bpk8gl] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-n281bpk8gl] { max-width: 420px; }
@keyframes fadeIn-b-n281bpk8gl { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-n281bpk8gl { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-n281bpk8gl] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-n281bpk8gl] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-n281bpk8gl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-n281bpk8gl] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-n281bpk8gl] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-n281bpk8gl] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-n281bpk8gl] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-n281bpk8gl] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-n281bpk8gl] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-n281bpk8gl] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-n281bpk8gl] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-n281bpk8gl] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-n281bpk8gl] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-n281bpk8gl] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-n281bpk8gl] { flex: 2; }
.form-group label[b-n281bpk8gl] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-n281bpk8gl], .form-group select[b-n281bpk8gl], .form-textarea[b-n281bpk8gl] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-n281bpk8gl], .form-group select:focus[b-n281bpk8gl], .form-textarea:focus[b-n281bpk8gl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-n281bpk8gl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-n281bpk8gl] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-n281bpk8gl] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-n281bpk8gl] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-n281bpk8gl] { margin-top: 0; }
.form-section-title i[b-n281bpk8gl] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-n281bpk8gl] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-n281bpk8gl] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-n281bpk8gl] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-n281bpk8gl] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-n281bpk8gl] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-n281bpk8gl] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-n281bpk8gl] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-n281bpk8gl] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-n281bpk8gl] { padding: 0.75rem; }
    .crud-header[b-n281bpk8gl] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-n281bpk8gl] { font-size: 1.1rem; }
    .btn-text[b-n281bpk8gl] { display: none; }
    .form-row[b-n281bpk8gl] { flex-direction: column; }
    .form-row-3[b-n281bpk8gl] { grid-template-columns: 1fr; }
    .form-row-4[b-n281bpk8gl] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-n281bpk8gl] { width: 98%; max-height: 95vh; }
    .modal-lg[b-n281bpk8gl] { max-width: 98vw; width: 98vw; }
    .modal-body[b-n281bpk8gl] { padding: 0.75rem; }
    .modal-tabs[b-n281bpk8gl] { overflow-x: auto; }
    .modal-tab[b-n281bpk8gl] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-n281bpk8gl] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-n281bpk8gl] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-n281bpk8gl] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-n281bpk8gl] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-n281bpk8gl] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-n281bpk8gl] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-n281bpk8gl] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-n281bpk8gl] { border-bottom: none; }
.help-section p[b-n281bpk8gl] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-n281bpk8gl], .help-section ol[b-n281bpk8gl] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-n281bpk8gl] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-n281bpk8gl] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-n281bpk8gl] { color: var(--rg-accent,#2563eb); }
.help-tip[b-n281bpk8gl] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-n281bpk8gl] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-n281bpk8gl] { background: rgba(37,99,235,0.12); }
.help-table[b-n281bpk8gl] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-n281bpk8gl] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-n281bpk8gl] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-n281bpk8gl] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_MisCasos.razor.rz.scp.css */
/* ============================================================
   FrmAho_MisCasos — Estilos CRUD Mis Casos
   ============================================================ */

.crud-container[b-b604dfa5ix] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-b604dfa5ix 0.3s ease-out; }
@keyframes slideUp-b-b604dfa5ix { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-b604dfa5ix] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-b604dfa5ix] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-b604dfa5ix] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-b604dfa5ix] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-b604dfa5ix] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-b604dfa5ix] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-b604dfa5ix] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-b604dfa5ix] { opacity: 0.6; cursor: not-allowed; }
.btn-sm[b-b604dfa5ix] { padding: 0.35rem 0.65rem; font-size: 0.75rem; }
.btn-primary[b-b604dfa5ix] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-b604dfa5ix] { filter: brightness(1.1); }
.btn-outline[b-b604dfa5ix] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-b604dfa5ix] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-b604dfa5ix] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-b604dfa5ix] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-b604dfa5ix] { background: rgba(79, 70, 229, 0.1); }

/* Botón Ayuda */
.btn-help[b-b604dfa5ix] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-b604dfa5ix] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-b604dfa5ix] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-b604dfa5ix] { background: rgba(37,99,235,0.25); }

/* Alert */
.crud-alert[b-b604dfa5ix] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-b604dfa5ix] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-b604dfa5ix] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
[data-mode="dark"] .crud-alert.success[b-b604dfa5ix] { background: rgba(6,95,70,0.15); color: #86efac; border-color: rgba(134,239,172,0.3); }
[data-mode="dark"] .crud-alert.error[b-b604dfa5ix] { background: rgba(153,27,27,0.15); color: #fca5a5; border-color: rgba(252,165,165,0.3); }
.crud-alert-close[b-b604dfa5ix] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtro bar */
.casos-filter-bar[b-b604dfa5ix] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.casos-estado-filter[b-b604dfa5ix] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; min-width: 150px; }
.casos-estado-filter:focus[b-b604dfa5ix] { border-color: var(--rg-accent, #4f46e5); }

/* Search */
.crud-search-bar[b-b604dfa5ix] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-b604dfa5ix] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: flex; align-items: center; padding: 0.1rem; }
.crud-search-btn:hover[b-b604dfa5ix] { color: var(--rg-accent, #4f46e5); }
.crud-search-bar input[b-b604dfa5ix] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-b604dfa5ix] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-b604dfa5ix] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-b604dfa5ix] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 310px); }
.crud-table[b-b604dfa5ix] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-b604dfa5ix] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-b604dfa5ix] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-b604dfa5ix] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-b604dfa5ix] { background: var(--rg-bg-hover, #f8fafc); }
.fila-urgente td[b-b604dfa5ix] { background: rgba(234,88,12,0.04) !important; }
.col-actions[b-b604dfa5ix] { width: 60px; text-align: center; white-space: nowrap; }

/* Avatar caso */
.caso-avatar[b-b604dfa5ix] { width: 32px; height: 32px; border-radius: 50%; background: rgba(79,70,229,0.1); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1rem; }

/* Paginación */
.casos-paginacion[b-b604dfa5ix] { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 0.5rem; font-size: 0.78rem; color: var(--rg-text-muted, #94a3b8); border-top: 1px solid var(--rg-border, #e2e8f0); }

/* Badges */
.badge[b-b604dfa5ix] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-abr[b-b604dfa5ix] { background: rgba(37,99,235,0.12); color: #1d4ed8; border: 1px solid rgba(37,99,235,0.2); }
.badge-enp[b-b604dfa5ix] { background: rgba(217,119,6,0.12); color: #92400e; border: 1px solid rgba(217,119,6,0.2); }
.badge-cer[b-b604dfa5ix] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.2); }
.badge-anu[b-b604dfa5ix] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-abr[b-b604dfa5ix] { color: #93c5fd; }
[data-mode="dark"] .badge-enp[b-b604dfa5ix] { color: #fcd34d; }
[data-mode="dark"] .badge-cer[b-b604dfa5ix] { color: #86efac; }
.badge-prio-alta[b-b604dfa5ix]   { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.2); }
.badge-prio-normal[b-b604dfa5ix] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); }
.badge-prio-baja[b-b604dfa5ix]   { background: rgba(100,116,139,0.1); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-prio-alta[b-b604dfa5ix] { color: #fca5a5; }

/* Utilidades */
.font-mono[b-b604dfa5ix] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-b604dfa5ix] { text-align: center; }
.text-muted[b-b604dfa5ix] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.text-danger[b-b604dfa5ix] { color: #dc2626; font-weight: 600; }
[data-mode="dark"] .text-danger[b-b604dfa5ix] { color: #fca5a5; }

/* Loading / Empty */
.crud-loading[b-b604dfa5ix], .crud-empty-state[b-b604dfa5ix] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-b604dfa5ix] { font-size: 2rem; }
.crud-spinner[b-b604dfa5ix] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-b604dfa5ix 0.6s linear infinite; }
@keyframes spin-b-b604dfa5ix { to { transform: rotate(360deg); } }
.spin[b-b604dfa5ix] { animation: spin-b-b604dfa5ix 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-b604dfa5ix] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-b604dfa5ix 0.15s ease-out; }
.modal-container[b-b604dfa5ix] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-b604dfa5ix] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-b604dfa5ix 0.2s ease-out; }
.modal-caso[b-b604dfa5ix] { max-width: 680px; }
.modal-lg[b-b604dfa5ix] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-b604dfa5ix] { max-width: 420px; }
@keyframes fadeIn-b-b604dfa5ix { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-b604dfa5ix { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-b604dfa5ix] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; gap: 0.5rem; }
.modal-header h2[b-b604dfa5ix] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.modal-close[b-b604dfa5ix] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; flex-shrink: 0; }
.modal-close:hover[b-b604dfa5ix] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-b604dfa5ix] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-b604dfa5ix] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Modales anidados */
.modal-backdrop-nested[b-b604dfa5ix]  { z-index: 2000 !important; }
.modal-container-nested[b-b604dfa5ix] { z-index: 2001 !important; }

/* Info del caso */
.caso-info-grid[b-b604dfa5ix] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem 1rem; margin-bottom: 0.75rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.caso-info-item[b-b604dfa5ix] { display: flex; flex-direction: column; gap: 0.1rem; }
.caso-info-label[b-b604dfa5ix] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.caso-info-value[b-b604dfa5ix] { font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); font-weight: 500; }

/* Asunto y descripción */
.caso-asunto-box[b-b604dfa5ix] { background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.625rem 0.875rem; margin-bottom: 0.5rem; }
.caso-asunto-label[b-b604dfa5ix] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); margin-bottom: 0.25rem; }
.caso-asunto-text[b-b604dfa5ix] { font-size: 0.875rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.caso-desc-box[b-b604dfa5ix] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.625rem 0.875rem; margin-bottom: 0.5rem; }
.caso-desc-label[b-b604dfa5ix] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); margin-bottom: 0.25rem; }
.caso-desc-text[b-b604dfa5ix] { font-size: 0.82rem; color: var(--rg-text-secondary, #475569); white-space: pre-wrap; }

/* Resolución */
.casos-resolucion-bar[b-b604dfa5ix] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.5rem 0; border-top: 1px solid var(--rg-border, #e2e8f0); margin-top: 0.75rem; }
.casos-resolucion-box[b-b604dfa5ix] { background: rgba(22,163,74,0.06); border: 1px solid rgba(22,163,74,0.2); border-radius: 0.5rem; padding: 0.75rem; margin-top: 0.5rem; }
.casos-resolucion-label[b-b604dfa5ix] { font-size: 0.75rem; font-weight: 700; color: #166534; display: flex; align-items: center; gap: 0.35rem; margin-bottom: 0.35rem; }
.casos-resolucion-box p[b-b604dfa5ix] { font-size: 0.82rem; color: var(--rg-text-secondary, #475569); margin: 0 0 0.35rem; }
[data-mode="dark"] .casos-resolucion-box[b-b604dfa5ix] { background: rgba(22,163,74,0.1); border-color: rgba(22,163,74,0.25); }
[data-mode="dark"] .casos-resolucion-label[b-b604dfa5ix] { color: #86efac; }

/* Form */
.form-group[b-b604dfa5ix] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-b604dfa5ix] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-textarea[b-b604dfa5ix] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; resize: vertical; font-family: inherit; width: 100%; }
.form-textarea:focus[b-b604dfa5ix] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* Ayuda */
.help-icon-header[b-b604dfa5ix] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-b604dfa5ix] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-b604dfa5ix] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-b604dfa5ix] { border-bottom: none; }
.help-section p[b-b604dfa5ix] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-b604dfa5ix] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-b604dfa5ix] { color: var(--rg-accent,#2563eb); }
.help-tip[b-b604dfa5ix] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-b604dfa5ix] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-b604dfa5ix] { background: rgba(37,99,235,0.12); }
.help-steps[b-b604dfa5ix] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-b604dfa5ix] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-b604dfa5ix] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-b604dfa5ix] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-b604dfa5ix] { padding: 0.75rem; }
    .crud-header[b-b604dfa5ix] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-b604dfa5ix] { display: none; }
    .casos-filter-bar[b-b604dfa5ix] { flex-direction: column; align-items: stretch; }
    .caso-info-grid[b-b604dfa5ix] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-b604dfa5ix] { width: 98%; }
    .modal-lg[b-b604dfa5ix] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaBandeja.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-dl369ojukt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-dl369ojukt 0.3s ease-out; }
@keyframes slideUp-b-dl369ojukt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-dl369ojukt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dl369ojukt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dl369ojukt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-dl369ojukt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-dl369ojukt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-dl369ojukt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-dl369ojukt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dl369ojukt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dl369ojukt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dl369ojukt] { filter: brightness(1.1); }
.btn-outline[b-dl369ojukt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dl369ojukt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dl369ojukt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dl369ojukt] { filter: brightness(1.1); }
.btn-icon[b-dl369ojukt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-dl369ojukt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-dl369ojukt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-dl369ojukt] { color: #ef4444; }
.btn-delete:hover[b-dl369ojukt] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-dl369ojukt] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-dl369ojukt] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-dl369ojukt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-dl369ojukt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-dl369ojukt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-dl369ojukt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-dl369ojukt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-dl369ojukt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-dl369ojukt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-dl369ojukt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-dl369ojukt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-dl369ojukt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-dl369ojukt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-dl369ojukt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-dl369ojukt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-dl369ojukt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-dl369ojukt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dl369ojukt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-dl369ojukt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-dl369ojukt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-dl369ojukt] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-dl369ojukt] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-dl369ojukt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-dl369ojukt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-dl369ojukt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-dl369ojukt] { background: #f1f5f9; color: #64748b; }
.badge-info[b-dl369ojukt] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-dl369ojukt] { background: #fffbeb; color: #92400e; }
.badge-danger[b-dl369ojukt] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-dl369ojukt] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-dl369ojukt] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-dl369ojukt] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-dl369ojukt] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-dl369ojukt] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-dl369ojukt] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-dl369ojukt] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-dl369ojukt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-dl369ojukt] { text-align: center; }
.text-muted[b-dl369ojukt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-dl369ojukt], .crud-empty-state[b-dl369ojukt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-dl369ojukt] { font-size: 2rem; }
.crud-spinner[b-dl369ojukt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-dl369ojukt 0.6s linear infinite; }
.crud-spinner-sm[b-dl369ojukt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-dl369ojukt 0.6s linear infinite; }
@keyframes spin-b-dl369ojukt { to { transform: rotate(360deg); } }
.spin[b-dl369ojukt] { animation: spin-b-dl369ojukt 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-dl369ojukt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-dl369ojukt 0.15s ease-out; }
.modal-container[b-dl369ojukt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-dl369ojukt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-dl369ojukt 0.2s ease-out; }
.modal-lg[b-dl369ojukt] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-dl369ojukt] { max-width: 420px; }
@keyframes fadeIn-b-dl369ojukt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-dl369ojukt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-dl369ojukt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-dl369ojukt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-dl369ojukt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-dl369ojukt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-dl369ojukt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-dl369ojukt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-dl369ojukt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-dl369ojukt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-dl369ojukt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-dl369ojukt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-dl369ojukt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-dl369ojukt] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-dl369ojukt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dl369ojukt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-dl369ojukt] { flex: 2; }
.form-group label[b-dl369ojukt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dl369ojukt], .form-group select[b-dl369ojukt], .form-textarea[b-dl369ojukt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-dl369ojukt], .form-group select:focus[b-dl369ojukt], .form-textarea:focus[b-dl369ojukt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-dl369ojukt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-dl369ojukt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-dl369ojukt] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-dl369ojukt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-dl369ojukt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-dl369ojukt] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-dl369ojukt] { margin-top: 0; }
.form-section-title i[b-dl369ojukt] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-dl369ojukt] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-dl369ojukt] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-dl369ojukt] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-dl369ojukt] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-dl369ojukt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-dl369ojukt] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-dl369ojukt] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-dl369ojukt] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-dl369ojukt] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-dl369ojukt] { padding: 0.75rem; }
    .crud-header[b-dl369ojukt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-dl369ojukt] { font-size: 1.1rem; }
    .btn-text[b-dl369ojukt] { display: none; }
    .form-row[b-dl369ojukt] { flex-direction: column; }
    .form-row-3[b-dl369ojukt] { grid-template-columns: 1fr; }
    .form-row-4[b-dl369ojukt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-dl369ojukt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-dl369ojukt] { max-width: 98vw; width: 98vw; }
    .modal-body[b-dl369ojukt] { padding: 0.75rem; }
    .modal-tabs[b-dl369ojukt] { overflow-x: auto; }
    .modal-tab[b-dl369ojukt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-dl369ojukt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-dl369ojukt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-dl369ojukt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-dl369ojukt] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-dl369ojukt] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-dl369ojukt] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-dl369ojukt] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-dl369ojukt] { border-bottom: none; }
.help-section p[b-dl369ojukt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-dl369ojukt], .help-section ol[b-dl369ojukt] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-dl369ojukt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-dl369ojukt] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-dl369ojukt] { color: var(--rg-accent,#2563eb); }
.help-tip[b-dl369ojukt] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-dl369ojukt] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-dl369ojukt] { background: rgba(37,99,235,0.12); }
.help-table[b-dl369ojukt] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-dl369ojukt] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-dl369ojukt] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-dl369ojukt] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-dl369ojukt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-dl369ojukt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-dl369ojukt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-dl369ojukt] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-dl369ojukt] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-dl369ojukt] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-dl369ojukt] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-dl369ojukt] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-dl369ojukt] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-dl369ojukt] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-dl369ojukt] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-dl369ojukt] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-dl369ojukt] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-dl369ojukt] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-dl369ojukt] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-dl369ojukt] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-dl369ojukt] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-dl369ojukt] { font-size: 1.6rem; }
.pos-op-btn > div[b-dl369ojukt] { display: flex; flex-direction: column; }
.pos-op-title[b-dl369ojukt] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-dl369ojukt] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-dl369ojukt] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-dl369ojukt] { color: var(--rg-success); }
.pos-op-ret[b-dl369ojukt] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-dl369ojukt] { color: var(--rg-danger); }

.pos-cuenta-search[b-dl369ojukt] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-dl369ojukt] { flex: 1; }

.pos-cuenta-card[b-dl369ojukt] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-dl369ojukt] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-dl369ojukt] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-dl369ojukt] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-dl369ojukt] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-dl369ojukt] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-dl369ojukt] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-dl369ojukt], .pos-res-saldos > div[b-dl369ojukt] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-dl369ojukt] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-dl369ojukt] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-dl369ojukt] { color: var(--rg-success); }
.pos-cuenta-aviso[b-dl369ojukt] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-dl369ojukt] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-dl369ojukt] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-dl369ojukt] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-dl369ojukt] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-dl369ojukt]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-dl369ojukt] { z-index: 2001 !important; }

.badge-warn[b-dl369ojukt] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-dl369ojukt] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-dl369ojukt] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-dl369ojukt] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-dl369ojukt] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-dl369ojukt] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-dl369ojukt] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-dl369ojukt] { margin-bottom: 0; }
.dv-periodo input[b-dl369ojukt], .dv-periodo select[b-dl369ojukt] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-dl369ojukt] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-dl369ojukt] { text-align: right; }
.badge-warn[b-dl369ojukt] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-dl369ojukt] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-dl369ojukt] { flex-direction: column; align-items: stretch; } .dv-periodo[b-dl369ojukt], .dv-acciones[b-dl369ojukt] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-dl369ojukt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-dl369ojukt] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-dl369ojukt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-dl369ojukt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-dl369ojukt] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-dl369ojukt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-dl369ojukt] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-dl369ojukt] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-dl369ojukt] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-dl369ojukt] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-dl369ojukt] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-dl369ojukt] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-dl369ojukt] { border-bottom: none; }
.config-toggle-label[b-dl369ojukt] { flex: 1; }
.config-toggle-name[b-dl369ojukt] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-dl369ojukt] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-dl369ojukt] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-dl369ojukt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dl369ojukt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-dl369ojukt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dl369ojukt], .form-group select[b-dl369ojukt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaCargarRetorno.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-1e41mi05xx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1e41mi05xx 0.3s ease-out; }
@keyframes slideUp-b-1e41mi05xx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1e41mi05xx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1e41mi05xx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1e41mi05xx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1e41mi05xx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1e41mi05xx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1e41mi05xx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1e41mi05xx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1e41mi05xx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1e41mi05xx] { filter: brightness(1.1); }
.btn-outline[b-1e41mi05xx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1e41mi05xx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1e41mi05xx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1e41mi05xx] { filter: brightness(1.1); }
.btn-icon[b-1e41mi05xx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1e41mi05xx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1e41mi05xx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1e41mi05xx] { color: #ef4444; }
.btn-delete:hover[b-1e41mi05xx] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-1e41mi05xx] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-1e41mi05xx] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-1e41mi05xx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1e41mi05xx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1e41mi05xx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1e41mi05xx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1e41mi05xx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1e41mi05xx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-1e41mi05xx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-1e41mi05xx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1e41mi05xx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-1e41mi05xx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-1e41mi05xx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1e41mi05xx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1e41mi05xx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1e41mi05xx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1e41mi05xx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1e41mi05xx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1e41mi05xx] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-1e41mi05xx] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-1e41mi05xx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-1e41mi05xx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1e41mi05xx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1e41mi05xx] { background: #f1f5f9; color: #64748b; }
.badge-info[b-1e41mi05xx] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-1e41mi05xx] { background: #fffbeb; color: #92400e; }
.badge-danger[b-1e41mi05xx] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-1e41mi05xx] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-1e41mi05xx] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-1e41mi05xx] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-1e41mi05xx] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-1e41mi05xx] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-1e41mi05xx] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-1e41mi05xx] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-1e41mi05xx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1e41mi05xx] { text-align: center; }
.text-muted[b-1e41mi05xx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1e41mi05xx], .crud-empty-state[b-1e41mi05xx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1e41mi05xx] { font-size: 2rem; }
.crud-spinner[b-1e41mi05xx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1e41mi05xx 0.6s linear infinite; }
.crud-spinner-sm[b-1e41mi05xx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1e41mi05xx 0.6s linear infinite; }
@keyframes spin-b-1e41mi05xx { to { transform: rotate(360deg); } }
.spin[b-1e41mi05xx] { animation: spin-b-1e41mi05xx 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-1e41mi05xx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1e41mi05xx 0.15s ease-out; }
.modal-container[b-1e41mi05xx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1e41mi05xx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1e41mi05xx 0.2s ease-out; }
.modal-lg[b-1e41mi05xx] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-1e41mi05xx] { max-width: 420px; }
@keyframes fadeIn-b-1e41mi05xx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1e41mi05xx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1e41mi05xx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1e41mi05xx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-1e41mi05xx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1e41mi05xx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1e41mi05xx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1e41mi05xx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1e41mi05xx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-1e41mi05xx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1e41mi05xx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1e41mi05xx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1e41mi05xx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1e41mi05xx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1e41mi05xx] { flex: 2; }
.form-group label[b-1e41mi05xx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1e41mi05xx], .form-group select[b-1e41mi05xx], .form-textarea[b-1e41mi05xx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1e41mi05xx], .form-group select:focus[b-1e41mi05xx], .form-textarea:focus[b-1e41mi05xx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1e41mi05xx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1e41mi05xx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1e41mi05xx] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1e41mi05xx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-1e41mi05xx] { margin-top: 0; }
.form-section-title i[b-1e41mi05xx] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-1e41mi05xx] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-1e41mi05xx] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-1e41mi05xx] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-1e41mi05xx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-1e41mi05xx] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-1e41mi05xx] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-1e41mi05xx] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-1e41mi05xx] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1e41mi05xx] { padding: 0.75rem; }
    .crud-header[b-1e41mi05xx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1e41mi05xx] { font-size: 1.1rem; }
    .btn-text[b-1e41mi05xx] { display: none; }
    .form-row[b-1e41mi05xx] { flex-direction: column; }
    .form-row-3[b-1e41mi05xx] { grid-template-columns: 1fr; }
    .form-row-4[b-1e41mi05xx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1e41mi05xx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1e41mi05xx] { max-width: 98vw; width: 98vw; }
    .modal-body[b-1e41mi05xx] { padding: 0.75rem; }
    .modal-tabs[b-1e41mi05xx] { overflow-x: auto; }
    .modal-tab[b-1e41mi05xx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1e41mi05xx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1e41mi05xx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1e41mi05xx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1e41mi05xx] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-1e41mi05xx] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-1e41mi05xx] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-1e41mi05xx] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-1e41mi05xx] { border-bottom: none; }
.help-section p[b-1e41mi05xx] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-1e41mi05xx], .help-section ol[b-1e41mi05xx] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-1e41mi05xx] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-1e41mi05xx] { color: var(--rg-accent,#2563eb); }
.help-tip[b-1e41mi05xx] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-1e41mi05xx] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-1e41mi05xx] { background: rgba(37,99,235,0.12); }
.help-table[b-1e41mi05xx] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-1e41mi05xx] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-1e41mi05xx] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-1e41mi05xx] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1e41mi05xx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1e41mi05xx] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-1e41mi05xx] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-1e41mi05xx] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-1e41mi05xx] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-1e41mi05xx] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-1e41mi05xx] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-1e41mi05xx] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-1e41mi05xx] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-1e41mi05xx] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-1e41mi05xx] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-1e41mi05xx] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-1e41mi05xx] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-1e41mi05xx] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-1e41mi05xx] { font-size: 1.6rem; }
.pos-op-btn > div[b-1e41mi05xx] { display: flex; flex-direction: column; }
.pos-op-title[b-1e41mi05xx] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-1e41mi05xx] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-1e41mi05xx] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-1e41mi05xx] { color: var(--rg-success); }
.pos-op-ret[b-1e41mi05xx] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-1e41mi05xx] { color: var(--rg-danger); }

.pos-cuenta-search[b-1e41mi05xx] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-1e41mi05xx] { flex: 1; }

.pos-cuenta-card[b-1e41mi05xx] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-1e41mi05xx] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-1e41mi05xx] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-1e41mi05xx] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-1e41mi05xx] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-1e41mi05xx], .pos-res-saldos > div[b-1e41mi05xx] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-1e41mi05xx] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-1e41mi05xx] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-1e41mi05xx] { color: var(--rg-success); }
.pos-cuenta-aviso[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-1e41mi05xx] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-1e41mi05xx] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-1e41mi05xx] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-1e41mi05xx] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-1e41mi05xx]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-1e41mi05xx] { z-index: 2001 !important; }

.badge-warn[b-1e41mi05xx] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1e41mi05xx] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-1e41mi05xx] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-1e41mi05xx] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-1e41mi05xx] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-1e41mi05xx] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-1e41mi05xx] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-1e41mi05xx] { margin-bottom: 0; }
.dv-periodo input[b-1e41mi05xx], .dv-periodo select[b-1e41mi05xx] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-1e41mi05xx] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-1e41mi05xx] { text-align: right; }
.badge-warn[b-1e41mi05xx] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1e41mi05xx] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-1e41mi05xx] { flex-direction: column; align-items: stretch; } .dv-periodo[b-1e41mi05xx], .dv-acciones[b-1e41mi05xx] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-1e41mi05xx] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-1e41mi05xx] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-1e41mi05xx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1e41mi05xx] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1e41mi05xx] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-1e41mi05xx] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-1e41mi05xx] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-1e41mi05xx] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-1e41mi05xx] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-1e41mi05xx] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-1e41mi05xx] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-1e41mi05xx] { border-bottom: none; }
.config-toggle-label[b-1e41mi05xx] { flex: 1; }
.config-toggle-name[b-1e41mi05xx] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-1e41mi05xx] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-1e41mi05xx] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-1e41mi05xx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1e41mi05xx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-1e41mi05xx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1e41mi05xx], .form-group select[b-1e41mi05xx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaConciliacion.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-87htcffuk0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-87htcffuk0 0.3s ease-out; }
@keyframes slideUp-b-87htcffuk0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-87htcffuk0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-87htcffuk0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-87htcffuk0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-87htcffuk0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-87htcffuk0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-87htcffuk0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-87htcffuk0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-87htcffuk0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-87htcffuk0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-87htcffuk0] { filter: brightness(1.1); }
.btn-outline[b-87htcffuk0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-87htcffuk0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-87htcffuk0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-87htcffuk0] { filter: brightness(1.1); }
.btn-icon[b-87htcffuk0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-87htcffuk0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-87htcffuk0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-87htcffuk0] { color: #ef4444; }
.btn-delete:hover[b-87htcffuk0] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-87htcffuk0] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-87htcffuk0] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-87htcffuk0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-87htcffuk0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-87htcffuk0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-87htcffuk0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-87htcffuk0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-87htcffuk0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-87htcffuk0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-87htcffuk0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-87htcffuk0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-87htcffuk0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-87htcffuk0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-87htcffuk0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-87htcffuk0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-87htcffuk0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-87htcffuk0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-87htcffuk0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-87htcffuk0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-87htcffuk0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-87htcffuk0] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-87htcffuk0] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-87htcffuk0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-87htcffuk0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-87htcffuk0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-87htcffuk0] { background: #f1f5f9; color: #64748b; }
.badge-info[b-87htcffuk0] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-87htcffuk0] { background: #fffbeb; color: #92400e; }
.badge-danger[b-87htcffuk0] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-87htcffuk0] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-87htcffuk0] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-87htcffuk0] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-87htcffuk0] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-87htcffuk0] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-87htcffuk0] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-87htcffuk0] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-87htcffuk0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-87htcffuk0] { text-align: center; }
.text-muted[b-87htcffuk0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-87htcffuk0], .crud-empty-state[b-87htcffuk0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-87htcffuk0] { font-size: 2rem; }
.crud-spinner[b-87htcffuk0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-87htcffuk0 0.6s linear infinite; }
.crud-spinner-sm[b-87htcffuk0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-87htcffuk0 0.6s linear infinite; }
@keyframes spin-b-87htcffuk0 { to { transform: rotate(360deg); } }
.spin[b-87htcffuk0] { animation: spin-b-87htcffuk0 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-87htcffuk0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-87htcffuk0 0.15s ease-out; }
.modal-container[b-87htcffuk0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-87htcffuk0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-87htcffuk0 0.2s ease-out; }
.modal-lg[b-87htcffuk0] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-87htcffuk0] { max-width: 420px; }
@keyframes fadeIn-b-87htcffuk0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-87htcffuk0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-87htcffuk0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-87htcffuk0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-87htcffuk0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-87htcffuk0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-87htcffuk0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-87htcffuk0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-87htcffuk0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-87htcffuk0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-87htcffuk0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-87htcffuk0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-87htcffuk0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-87htcffuk0] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-87htcffuk0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-87htcffuk0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-87htcffuk0] { flex: 2; }
.form-group label[b-87htcffuk0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-87htcffuk0], .form-group select[b-87htcffuk0], .form-textarea[b-87htcffuk0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-87htcffuk0], .form-group select:focus[b-87htcffuk0], .form-textarea:focus[b-87htcffuk0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-87htcffuk0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-87htcffuk0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-87htcffuk0] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-87htcffuk0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-87htcffuk0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-87htcffuk0] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-87htcffuk0] { margin-top: 0; }
.form-section-title i[b-87htcffuk0] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-87htcffuk0] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-87htcffuk0] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-87htcffuk0] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-87htcffuk0] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-87htcffuk0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-87htcffuk0] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-87htcffuk0] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-87htcffuk0] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-87htcffuk0] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-87htcffuk0] { padding: 0.75rem; }
    .crud-header[b-87htcffuk0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-87htcffuk0] { font-size: 1.1rem; }
    .btn-text[b-87htcffuk0] { display: none; }
    .form-row[b-87htcffuk0] { flex-direction: column; }
    .form-row-3[b-87htcffuk0] { grid-template-columns: 1fr; }
    .form-row-4[b-87htcffuk0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-87htcffuk0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-87htcffuk0] { max-width: 98vw; width: 98vw; }
    .modal-body[b-87htcffuk0] { padding: 0.75rem; }
    .modal-tabs[b-87htcffuk0] { overflow-x: auto; }
    .modal-tab[b-87htcffuk0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-87htcffuk0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-87htcffuk0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-87htcffuk0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-87htcffuk0] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-87htcffuk0] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-87htcffuk0] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-87htcffuk0] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-87htcffuk0] { border-bottom: none; }
.help-section p[b-87htcffuk0] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-87htcffuk0], .help-section ol[b-87htcffuk0] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-87htcffuk0] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-87htcffuk0] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-87htcffuk0] { color: var(--rg-accent,#2563eb); }
.help-tip[b-87htcffuk0] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-87htcffuk0] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-87htcffuk0] { background: rgba(37,99,235,0.12); }
.help-table[b-87htcffuk0] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-87htcffuk0] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-87htcffuk0] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-87htcffuk0] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-87htcffuk0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-87htcffuk0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-87htcffuk0] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-87htcffuk0] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-87htcffuk0] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-87htcffuk0] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-87htcffuk0] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-87htcffuk0] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-87htcffuk0] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-87htcffuk0] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-87htcffuk0] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-87htcffuk0] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-87htcffuk0] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-87htcffuk0] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-87htcffuk0] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-87htcffuk0] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-87htcffuk0] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-87htcffuk0] { font-size: 1.6rem; }
.pos-op-btn > div[b-87htcffuk0] { display: flex; flex-direction: column; }
.pos-op-title[b-87htcffuk0] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-87htcffuk0] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-87htcffuk0] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-87htcffuk0] { color: var(--rg-success); }
.pos-op-ret[b-87htcffuk0] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-87htcffuk0] { color: var(--rg-danger); }

.pos-cuenta-search[b-87htcffuk0] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-87htcffuk0] { flex: 1; }

.pos-cuenta-card[b-87htcffuk0] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-87htcffuk0] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-87htcffuk0] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-87htcffuk0] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-87htcffuk0] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-87htcffuk0] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-87htcffuk0] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-87htcffuk0], .pos-res-saldos > div[b-87htcffuk0] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-87htcffuk0] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-87htcffuk0] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-87htcffuk0] { color: var(--rg-success); }
.pos-cuenta-aviso[b-87htcffuk0] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-87htcffuk0] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-87htcffuk0] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-87htcffuk0] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-87htcffuk0] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-87htcffuk0]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-87htcffuk0] { z-index: 2001 !important; }

.badge-warn[b-87htcffuk0] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-87htcffuk0] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-87htcffuk0] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-87htcffuk0] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-87htcffuk0] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-87htcffuk0] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-87htcffuk0] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-87htcffuk0] { margin-bottom: 0; }
.dv-periodo input[b-87htcffuk0], .dv-periodo select[b-87htcffuk0] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-87htcffuk0] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-87htcffuk0] { text-align: right; }
.badge-warn[b-87htcffuk0] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-87htcffuk0] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-87htcffuk0] { flex-direction: column; align-items: stretch; } .dv-periodo[b-87htcffuk0], .dv-acciones[b-87htcffuk0] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-87htcffuk0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-87htcffuk0] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-87htcffuk0] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-87htcffuk0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-87htcffuk0] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-87htcffuk0] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-87htcffuk0] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-87htcffuk0] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-87htcffuk0] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-87htcffuk0] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-87htcffuk0] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-87htcffuk0] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-87htcffuk0] { border-bottom: none; }
.config-toggle-label[b-87htcffuk0] { flex: 1; }
.config-toggle-name[b-87htcffuk0] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-87htcffuk0] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-87htcffuk0] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-87htcffuk0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-87htcffuk0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-87htcffuk0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-87htcffuk0], .form-group select[b-87htcffuk0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaDepositoLote.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-gp3y7fesiw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gp3y7fesiw 0.3s ease-out; }
@keyframes slideUp-b-gp3y7fesiw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gp3y7fesiw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gp3y7fesiw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-gp3y7fesiw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-gp3y7fesiw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-gp3y7fesiw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-gp3y7fesiw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gp3y7fesiw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-gp3y7fesiw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gp3y7fesiw] { filter: brightness(1.1); }
.btn-outline[b-gp3y7fesiw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-gp3y7fesiw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-gp3y7fesiw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gp3y7fesiw] { filter: brightness(1.1); }
.btn-icon[b-gp3y7fesiw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-gp3y7fesiw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gp3y7fesiw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gp3y7fesiw] { color: #ef4444; }
.btn-delete:hover[b-gp3y7fesiw] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-gp3y7fesiw] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-gp3y7fesiw] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-gp3y7fesiw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gp3y7fesiw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gp3y7fesiw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gp3y7fesiw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-gp3y7fesiw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gp3y7fesiw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-gp3y7fesiw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-gp3y7fesiw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-gp3y7fesiw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-gp3y7fesiw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-gp3y7fesiw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-gp3y7fesiw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gp3y7fesiw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gp3y7fesiw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gp3y7fesiw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-gp3y7fesiw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-gp3y7fesiw] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-gp3y7fesiw] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-gp3y7fesiw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-gp3y7fesiw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-gp3y7fesiw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gp3y7fesiw] { background: #f1f5f9; color: #64748b; }
.badge-info[b-gp3y7fesiw] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-gp3y7fesiw] { background: #fffbeb; color: #92400e; }
.badge-danger[b-gp3y7fesiw] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-gp3y7fesiw] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-gp3y7fesiw] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-gp3y7fesiw] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-gp3y7fesiw] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-gp3y7fesiw] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-gp3y7fesiw] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-gp3y7fesiw] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-gp3y7fesiw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-gp3y7fesiw] { text-align: center; }
.text-muted[b-gp3y7fesiw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-gp3y7fesiw], .crud-empty-state[b-gp3y7fesiw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-gp3y7fesiw] { font-size: 2rem; }
.crud-spinner[b-gp3y7fesiw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-gp3y7fesiw 0.6s linear infinite; }
.crud-spinner-sm[b-gp3y7fesiw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-gp3y7fesiw 0.6s linear infinite; }
@keyframes spin-b-gp3y7fesiw { to { transform: rotate(360deg); } }
.spin[b-gp3y7fesiw] { animation: spin-b-gp3y7fesiw 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-gp3y7fesiw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-gp3y7fesiw 0.15s ease-out; }
.modal-container[b-gp3y7fesiw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gp3y7fesiw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-gp3y7fesiw 0.2s ease-out; }
.modal-lg[b-gp3y7fesiw] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-gp3y7fesiw] { max-width: 420px; }
@keyframes fadeIn-b-gp3y7fesiw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gp3y7fesiw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-gp3y7fesiw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-gp3y7fesiw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-gp3y7fesiw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-gp3y7fesiw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-gp3y7fesiw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gp3y7fesiw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-gp3y7fesiw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-gp3y7fesiw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-gp3y7fesiw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-gp3y7fesiw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-gp3y7fesiw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gp3y7fesiw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-gp3y7fesiw] { flex: 2; }
.form-group label[b-gp3y7fesiw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gp3y7fesiw], .form-group select[b-gp3y7fesiw], .form-textarea[b-gp3y7fesiw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-gp3y7fesiw], .form-group select:focus[b-gp3y7fesiw], .form-textarea:focus[b-gp3y7fesiw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-gp3y7fesiw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-gp3y7fesiw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-gp3y7fesiw] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-gp3y7fesiw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-gp3y7fesiw] { margin-top: 0; }
.form-section-title i[b-gp3y7fesiw] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-gp3y7fesiw] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-gp3y7fesiw] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-gp3y7fesiw] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-gp3y7fesiw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-gp3y7fesiw] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-gp3y7fesiw] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-gp3y7fesiw] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-gp3y7fesiw] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-gp3y7fesiw] { padding: 0.75rem; }
    .crud-header[b-gp3y7fesiw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gp3y7fesiw] { font-size: 1.1rem; }
    .btn-text[b-gp3y7fesiw] { display: none; }
    .form-row[b-gp3y7fesiw] { flex-direction: column; }
    .form-row-3[b-gp3y7fesiw] { grid-template-columns: 1fr; }
    .form-row-4[b-gp3y7fesiw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-gp3y7fesiw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-gp3y7fesiw] { max-width: 98vw; width: 98vw; }
    .modal-body[b-gp3y7fesiw] { padding: 0.75rem; }
    .modal-tabs[b-gp3y7fesiw] { overflow-x: auto; }
    .modal-tab[b-gp3y7fesiw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-gp3y7fesiw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-gp3y7fesiw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-gp3y7fesiw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-gp3y7fesiw] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-gp3y7fesiw] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-gp3y7fesiw] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-gp3y7fesiw] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-gp3y7fesiw] { border-bottom: none; }
.help-section p[b-gp3y7fesiw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-gp3y7fesiw], .help-section ol[b-gp3y7fesiw] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-gp3y7fesiw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-gp3y7fesiw] { color: var(--rg-accent,#2563eb); }
.help-tip[b-gp3y7fesiw] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-gp3y7fesiw] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-gp3y7fesiw] { background: rgba(37,99,235,0.12); }
.help-table[b-gp3y7fesiw] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-gp3y7fesiw] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-gp3y7fesiw] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-gp3y7fesiw] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-gp3y7fesiw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-gp3y7fesiw] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-gp3y7fesiw] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-gp3y7fesiw] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-gp3y7fesiw] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-gp3y7fesiw] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-gp3y7fesiw] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-gp3y7fesiw] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-gp3y7fesiw] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-gp3y7fesiw] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-gp3y7fesiw] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-gp3y7fesiw] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-gp3y7fesiw] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-gp3y7fesiw] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-gp3y7fesiw] { font-size: 1.6rem; }
.pos-op-btn > div[b-gp3y7fesiw] { display: flex; flex-direction: column; }
.pos-op-title[b-gp3y7fesiw] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-gp3y7fesiw] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-gp3y7fesiw] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-gp3y7fesiw] { color: var(--rg-success); }
.pos-op-ret[b-gp3y7fesiw] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-gp3y7fesiw] { color: var(--rg-danger); }

.pos-cuenta-search[b-gp3y7fesiw] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-gp3y7fesiw] { flex: 1; }

.pos-cuenta-card[b-gp3y7fesiw] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-gp3y7fesiw] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-gp3y7fesiw] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-gp3y7fesiw] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-gp3y7fesiw] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-gp3y7fesiw], .pos-res-saldos > div[b-gp3y7fesiw] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-gp3y7fesiw] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-gp3y7fesiw] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-gp3y7fesiw] { color: var(--rg-success); }
.pos-cuenta-aviso[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-gp3y7fesiw] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-gp3y7fesiw] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-gp3y7fesiw] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-gp3y7fesiw] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-gp3y7fesiw]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-gp3y7fesiw] { z-index: 2001 !important; }

.badge-warn[b-gp3y7fesiw] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-gp3y7fesiw] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-gp3y7fesiw] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-gp3y7fesiw] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-gp3y7fesiw] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-gp3y7fesiw] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-gp3y7fesiw] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-gp3y7fesiw] { margin-bottom: 0; }
.dv-periodo input[b-gp3y7fesiw], .dv-periodo select[b-gp3y7fesiw] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-gp3y7fesiw] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-gp3y7fesiw] { text-align: right; }
.badge-warn[b-gp3y7fesiw] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-gp3y7fesiw] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-gp3y7fesiw] { flex-direction: column; align-items: stretch; } .dv-periodo[b-gp3y7fesiw], .dv-acciones[b-gp3y7fesiw] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-gp3y7fesiw] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-gp3y7fesiw] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-gp3y7fesiw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-gp3y7fesiw] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-gp3y7fesiw] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-gp3y7fesiw] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-gp3y7fesiw] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-gp3y7fesiw] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-gp3y7fesiw] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-gp3y7fesiw] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-gp3y7fesiw] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-gp3y7fesiw] { border-bottom: none; }
.config-toggle-label[b-gp3y7fesiw] { flex: 1; }
.config-toggle-name[b-gp3y7fesiw] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-gp3y7fesiw] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-gp3y7fesiw] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-gp3y7fesiw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gp3y7fesiw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-gp3y7fesiw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gp3y7fesiw], .form-group select[b-gp3y7fesiw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaDetalle.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-1yhdj5kntz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1yhdj5kntz 0.3s ease-out; }
@keyframes slideUp-b-1yhdj5kntz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1yhdj5kntz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1yhdj5kntz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1yhdj5kntz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1yhdj5kntz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1yhdj5kntz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1yhdj5kntz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1yhdj5kntz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1yhdj5kntz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1yhdj5kntz] { filter: brightness(1.1); }
.btn-outline[b-1yhdj5kntz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1yhdj5kntz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1yhdj5kntz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1yhdj5kntz] { filter: brightness(1.1); }
.btn-icon[b-1yhdj5kntz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1yhdj5kntz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1yhdj5kntz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1yhdj5kntz] { color: #ef4444; }
.btn-delete:hover[b-1yhdj5kntz] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-1yhdj5kntz] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-1yhdj5kntz] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-1yhdj5kntz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1yhdj5kntz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1yhdj5kntz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1yhdj5kntz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1yhdj5kntz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1yhdj5kntz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-1yhdj5kntz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-1yhdj5kntz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1yhdj5kntz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-1yhdj5kntz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-1yhdj5kntz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1yhdj5kntz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1yhdj5kntz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1yhdj5kntz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1yhdj5kntz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1yhdj5kntz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1yhdj5kntz] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-1yhdj5kntz] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-1yhdj5kntz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-1yhdj5kntz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1yhdj5kntz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1yhdj5kntz] { background: #f1f5f9; color: #64748b; }
.badge-info[b-1yhdj5kntz] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-1yhdj5kntz] { background: #fffbeb; color: #92400e; }
.badge-danger[b-1yhdj5kntz] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-1yhdj5kntz] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-1yhdj5kntz] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-1yhdj5kntz] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-1yhdj5kntz] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-1yhdj5kntz] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-1yhdj5kntz] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-1yhdj5kntz] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-1yhdj5kntz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1yhdj5kntz] { text-align: center; }
.text-muted[b-1yhdj5kntz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1yhdj5kntz], .crud-empty-state[b-1yhdj5kntz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1yhdj5kntz] { font-size: 2rem; }
.crud-spinner[b-1yhdj5kntz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1yhdj5kntz 0.6s linear infinite; }
.crud-spinner-sm[b-1yhdj5kntz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1yhdj5kntz 0.6s linear infinite; }
@keyframes spin-b-1yhdj5kntz { to { transform: rotate(360deg); } }
.spin[b-1yhdj5kntz] { animation: spin-b-1yhdj5kntz 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-1yhdj5kntz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1yhdj5kntz 0.15s ease-out; }
.modal-container[b-1yhdj5kntz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1yhdj5kntz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1yhdj5kntz 0.2s ease-out; }
.modal-lg[b-1yhdj5kntz] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-1yhdj5kntz] { max-width: 420px; }
@keyframes fadeIn-b-1yhdj5kntz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1yhdj5kntz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1yhdj5kntz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1yhdj5kntz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-1yhdj5kntz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1yhdj5kntz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1yhdj5kntz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1yhdj5kntz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1yhdj5kntz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-1yhdj5kntz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1yhdj5kntz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1yhdj5kntz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1yhdj5kntz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1yhdj5kntz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1yhdj5kntz] { flex: 2; }
.form-group label[b-1yhdj5kntz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1yhdj5kntz], .form-group select[b-1yhdj5kntz], .form-textarea[b-1yhdj5kntz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1yhdj5kntz], .form-group select:focus[b-1yhdj5kntz], .form-textarea:focus[b-1yhdj5kntz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1yhdj5kntz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1yhdj5kntz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1yhdj5kntz] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1yhdj5kntz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-1yhdj5kntz] { margin-top: 0; }
.form-section-title i[b-1yhdj5kntz] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-1yhdj5kntz] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-1yhdj5kntz] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-1yhdj5kntz] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-1yhdj5kntz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-1yhdj5kntz] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-1yhdj5kntz] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-1yhdj5kntz] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-1yhdj5kntz] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1yhdj5kntz] { padding: 0.75rem; }
    .crud-header[b-1yhdj5kntz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1yhdj5kntz] { font-size: 1.1rem; }
    .btn-text[b-1yhdj5kntz] { display: none; }
    .form-row[b-1yhdj5kntz] { flex-direction: column; }
    .form-row-3[b-1yhdj5kntz] { grid-template-columns: 1fr; }
    .form-row-4[b-1yhdj5kntz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1yhdj5kntz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1yhdj5kntz] { max-width: 98vw; width: 98vw; }
    .modal-body[b-1yhdj5kntz] { padding: 0.75rem; }
    .modal-tabs[b-1yhdj5kntz] { overflow-x: auto; }
    .modal-tab[b-1yhdj5kntz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1yhdj5kntz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1yhdj5kntz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1yhdj5kntz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1yhdj5kntz] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-1yhdj5kntz] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-1yhdj5kntz] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-1yhdj5kntz] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-1yhdj5kntz] { border-bottom: none; }
.help-section p[b-1yhdj5kntz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-1yhdj5kntz], .help-section ol[b-1yhdj5kntz] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-1yhdj5kntz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-1yhdj5kntz] { color: var(--rg-accent,#2563eb); }
.help-tip[b-1yhdj5kntz] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-1yhdj5kntz] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-1yhdj5kntz] { background: rgba(37,99,235,0.12); }
.help-table[b-1yhdj5kntz] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-1yhdj5kntz] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-1yhdj5kntz] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-1yhdj5kntz] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1yhdj5kntz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1yhdj5kntz] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-1yhdj5kntz] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-1yhdj5kntz] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-1yhdj5kntz] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-1yhdj5kntz] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-1yhdj5kntz] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-1yhdj5kntz] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-1yhdj5kntz] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-1yhdj5kntz] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-1yhdj5kntz] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-1yhdj5kntz] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-1yhdj5kntz] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-1yhdj5kntz] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-1yhdj5kntz] { font-size: 1.6rem; }
.pos-op-btn > div[b-1yhdj5kntz] { display: flex; flex-direction: column; }
.pos-op-title[b-1yhdj5kntz] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-1yhdj5kntz] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-1yhdj5kntz] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-1yhdj5kntz] { color: var(--rg-success); }
.pos-op-ret[b-1yhdj5kntz] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-1yhdj5kntz] { color: var(--rg-danger); }

.pos-cuenta-search[b-1yhdj5kntz] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-1yhdj5kntz] { flex: 1; }

.pos-cuenta-card[b-1yhdj5kntz] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-1yhdj5kntz] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-1yhdj5kntz] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-1yhdj5kntz] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-1yhdj5kntz] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-1yhdj5kntz], .pos-res-saldos > div[b-1yhdj5kntz] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-1yhdj5kntz] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-1yhdj5kntz] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-1yhdj5kntz] { color: var(--rg-success); }
.pos-cuenta-aviso[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-1yhdj5kntz] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-1yhdj5kntz] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-1yhdj5kntz] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-1yhdj5kntz] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-1yhdj5kntz]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-1yhdj5kntz] { z-index: 2001 !important; }

.badge-warn[b-1yhdj5kntz] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1yhdj5kntz] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-1yhdj5kntz] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-1yhdj5kntz] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-1yhdj5kntz] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-1yhdj5kntz] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-1yhdj5kntz] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-1yhdj5kntz] { margin-bottom: 0; }
.dv-periodo input[b-1yhdj5kntz], .dv-periodo select[b-1yhdj5kntz] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-1yhdj5kntz] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-1yhdj5kntz] { text-align: right; }
.badge-warn[b-1yhdj5kntz] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-1yhdj5kntz] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-1yhdj5kntz] { flex-direction: column; align-items: stretch; } .dv-periodo[b-1yhdj5kntz], .dv-acciones[b-1yhdj5kntz] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-1yhdj5kntz] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-1yhdj5kntz] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-1yhdj5kntz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-1yhdj5kntz] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-1yhdj5kntz] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-1yhdj5kntz] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-1yhdj5kntz] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-1yhdj5kntz] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-1yhdj5kntz] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-1yhdj5kntz] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-1yhdj5kntz] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-1yhdj5kntz] { border-bottom: none; }
.config-toggle-label[b-1yhdj5kntz] { flex: 1; }
.config-toggle-name[b-1yhdj5kntz] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-1yhdj5kntz] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-1yhdj5kntz] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-1yhdj5kntz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1yhdj5kntz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-1yhdj5kntz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1yhdj5kntz], .form-group select[b-1yhdj5kntz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaEmpleados.razor.rz.scp.css */
/* ============================================================
   Ahorros — Nómina / Empleados del Convenio
   Estilos CRUD completos (copia del estándar Frmclientes.razor.css + ayuda)
   ============================================================ */

.crud-container[b-eh7iwc3axr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-eh7iwc3axr 0.3s ease-out; }
@keyframes slideUp-b-eh7iwc3axr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-eh7iwc3axr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eh7iwc3axr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-eh7iwc3axr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-eh7iwc3axr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-eh7iwc3axr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-eh7iwc3axr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-eh7iwc3axr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-eh7iwc3axr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eh7iwc3axr] { filter: brightness(1.1); }
.btn-outline[b-eh7iwc3axr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-eh7iwc3axr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-eh7iwc3axr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-eh7iwc3axr] { filter: brightness(1.1); }
.btn-icon[b-eh7iwc3axr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-eh7iwc3axr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-eh7iwc3axr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-eh7iwc3axr] { color: #ef4444; }
.btn-delete:hover[b-eh7iwc3axr] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-eh7iwc3axr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-eh7iwc3axr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-eh7iwc3axr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); flex-wrap: wrap; }
.crud-search-bar i[b-eh7iwc3axr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-eh7iwc3axr] { flex: 1; min-width: 180px; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-eh7iwc3axr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-eh7iwc3axr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-eh7iwc3axr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-eh7iwc3axr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-eh7iwc3axr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-eh7iwc3axr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-eh7iwc3axr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-eh7iwc3axr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-eh7iwc3axr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-eh7iwc3axr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-eh7iwc3axr] { width: 110px; text-align: center; white-space: nowrap; }
.text-center[b-eh7iwc3axr] { text-align: center; }
.text-right[b-eh7iwc3axr] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-eh7iwc3axr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-eh7iwc3axr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-eh7iwc3axr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-eh7iwc3axr] { background: #f1f5f9; color: #64748b; }
.badge-info[b-eh7iwc3axr] { background: #eff6ff; color: #1e40af; }
[data-mode="dark"] .badge-yes[b-eh7iwc3axr] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-eh7iwc3axr] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-eh7iwc3axr] { background: rgba(37,99,235,0.18); color: #93c5fd; }

/* Utilities */
.font-mono[b-eh7iwc3axr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-eh7iwc3axr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-eh7iwc3axr], .crud-empty-state[b-eh7iwc3axr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-eh7iwc3axr] { font-size: 2rem; }
.crud-spinner[b-eh7iwc3axr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-eh7iwc3axr 0.6s linear infinite; }
.crud-spinner-sm[b-eh7iwc3axr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-eh7iwc3axr 0.6s linear infinite; }
@keyframes spin-b-eh7iwc3axr { to { transform: rotate(360deg); } }
.spin[b-eh7iwc3axr] { animation: spin-b-eh7iwc3axr 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-eh7iwc3axr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-eh7iwc3axr 0.15s ease-out; }
.modal-container[b-eh7iwc3axr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-eh7iwc3axr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-eh7iwc3axr 0.2s ease-out; }
.modal-lg[b-eh7iwc3axr] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-eh7iwc3axr] { max-width: 420px; }
@keyframes fadeIn-b-eh7iwc3axr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-eh7iwc3axr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-eh7iwc3axr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-eh7iwc3axr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-eh7iwc3axr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-eh7iwc3axr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-eh7iwc3axr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eh7iwc3axr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-eh7iwc3axr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-eh7iwc3axr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-eh7iwc3axr] { flex: 2; }
.form-group label[b-eh7iwc3axr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-eh7iwc3axr], .form-group select[b-eh7iwc3axr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-eh7iwc3axr], .form-group select:focus[b-eh7iwc3axr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-check-group[b-eh7iwc3axr] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-eh7iwc3axr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }
.form-section-title[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-eh7iwc3axr] { margin-top: 0; }
.form-section-title i[b-eh7iwc3axr] { color: var(--rg-accent, #4f46e5); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-eh7iwc3axr] { padding: 0.75rem; }
    .crud-header[b-eh7iwc3axr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-eh7iwc3axr] { font-size: 1.1rem; }
    .btn-text[b-eh7iwc3axr] { display: none; }
    .form-row[b-eh7iwc3axr] { flex-direction: column; }
    .modal-dialog[b-eh7iwc3axr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-eh7iwc3axr] { max-width: 98vw; width: 98vw; }
    .modal-body[b-eh7iwc3axr] { padding: 0.75rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────── */
.btn-help[b-eh7iwc3axr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-eh7iwc3axr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-eh7iwc3axr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-eh7iwc3axr] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────── */
.help-icon-header[b-eh7iwc3axr] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-eh7iwc3axr] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-eh7iwc3axr] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-eh7iwc3axr] { border-bottom: none; }
.help-section p[b-eh7iwc3axr] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-eh7iwc3axr] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-eh7iwc3axr] { color: var(--rg-accent,#2563eb); }
.help-tip[b-eh7iwc3axr] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-eh7iwc3axr] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-eh7iwc3axr] { background: rgba(37,99,235,0.12); }
.help-table[b-eh7iwc3axr] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-eh7iwc3axr] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-eh7iwc3axr] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-eh7iwc3axr] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaEmpresasConvenio.razor.rz.scp.css */
/* ============================================================
   Ahorros — Nómina / Empresas Convenio
   Estilos CRUD completos (copia del estándar Frmclientes.razor.css + ayuda)
   ============================================================ */

.crud-container[b-pkfbwzuvs6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pkfbwzuvs6 0.3s ease-out; }
@keyframes slideUp-b-pkfbwzuvs6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pkfbwzuvs6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pkfbwzuvs6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pkfbwzuvs6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pkfbwzuvs6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pkfbwzuvs6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pkfbwzuvs6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pkfbwzuvs6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pkfbwzuvs6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pkfbwzuvs6] { filter: brightness(1.1); }
.btn-outline[b-pkfbwzuvs6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pkfbwzuvs6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pkfbwzuvs6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pkfbwzuvs6] { filter: brightness(1.1); }
.btn-icon[b-pkfbwzuvs6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pkfbwzuvs6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pkfbwzuvs6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pkfbwzuvs6] { color: #ef4444; }
.btn-delete:hover[b-pkfbwzuvs6] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pkfbwzuvs6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pkfbwzuvs6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pkfbwzuvs6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pkfbwzuvs6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pkfbwzuvs6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-pkfbwzuvs6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-pkfbwzuvs6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pkfbwzuvs6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-pkfbwzuvs6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-pkfbwzuvs6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pkfbwzuvs6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pkfbwzuvs6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pkfbwzuvs6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pkfbwzuvs6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pkfbwzuvs6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pkfbwzuvs6] { width: 110px; text-align: center; white-space: nowrap; }
.text-center[b-pkfbwzuvs6] { text-align: center; }
.text-right[b-pkfbwzuvs6] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-pkfbwzuvs6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-pkfbwzuvs6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pkfbwzuvs6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pkfbwzuvs6] { background: #f1f5f9; color: #64748b; }
.badge-info[b-pkfbwzuvs6] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-pkfbwzuvs6] { background: #fffbeb; color: #92400e; }
.badge-danger[b-pkfbwzuvs6] { background: #fef2f2; color: #991b1b; }
[data-mode="dark"] .badge-yes[b-pkfbwzuvs6] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-pkfbwzuvs6] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-pkfbwzuvs6] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-pkfbwzuvs6] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-pkfbwzuvs6] { background: rgba(220,38,38,0.18); color: #fca5a5; }

/* Utilities */
.font-mono[b-pkfbwzuvs6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-pkfbwzuvs6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pkfbwzuvs6], .crud-empty-state[b-pkfbwzuvs6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pkfbwzuvs6] { font-size: 2rem; }
.crud-spinner[b-pkfbwzuvs6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pkfbwzuvs6 0.6s linear infinite; }
.crud-spinner-sm[b-pkfbwzuvs6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pkfbwzuvs6 0.6s linear infinite; }
@keyframes spin-b-pkfbwzuvs6 { to { transform: rotate(360deg); } }
.spin[b-pkfbwzuvs6] { animation: spin-b-pkfbwzuvs6 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-pkfbwzuvs6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pkfbwzuvs6 0.15s ease-out; }
.modal-container[b-pkfbwzuvs6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pkfbwzuvs6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pkfbwzuvs6 0.2s ease-out; }
.modal-lg[b-pkfbwzuvs6] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-pkfbwzuvs6] { max-width: 420px; }
@keyframes fadeIn-b-pkfbwzuvs6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pkfbwzuvs6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-pkfbwzuvs6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pkfbwzuvs6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-pkfbwzuvs6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pkfbwzuvs6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pkfbwzuvs6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pkfbwzuvs6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-pkfbwzuvs6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pkfbwzuvs6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pkfbwzuvs6] { flex: 2; }
.form-group label[b-pkfbwzuvs6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pkfbwzuvs6], .form-group select[b-pkfbwzuvs6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pkfbwzuvs6], .form-group select:focus[b-pkfbwzuvs6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-check-group[b-pkfbwzuvs6] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pkfbwzuvs6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }
.form-section-title[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-pkfbwzuvs6] { margin-top: 0; }
.form-section-title i[b-pkfbwzuvs6] { color: var(--rg-accent, #4f46e5); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pkfbwzuvs6] { padding: 0.75rem; }
    .crud-header[b-pkfbwzuvs6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pkfbwzuvs6] { font-size: 1.1rem; }
    .btn-text[b-pkfbwzuvs6] { display: none; }
    .form-row[b-pkfbwzuvs6] { flex-direction: column; }
    .modal-dialog[b-pkfbwzuvs6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pkfbwzuvs6] { max-width: 98vw; width: 98vw; }
    .modal-body[b-pkfbwzuvs6] { padding: 0.75rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────── */
.btn-help[b-pkfbwzuvs6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pkfbwzuvs6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pkfbwzuvs6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pkfbwzuvs6] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────── */
.help-icon-header[b-pkfbwzuvs6] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-pkfbwzuvs6] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-pkfbwzuvs6] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-pkfbwzuvs6] { border-bottom: none; }
.help-section p[b-pkfbwzuvs6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-pkfbwzuvs6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-pkfbwzuvs6] { color: var(--rg-accent,#2563eb); }
.help-tip[b-pkfbwzuvs6] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-pkfbwzuvs6] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-pkfbwzuvs6] { background: rgba(37,99,235,0.12); }
.help-table[b-pkfbwzuvs6] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-pkfbwzuvs6] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-pkfbwzuvs6] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-pkfbwzuvs6] { background: rgba(255,255,255,0.04); }
.help-steps[b-pkfbwzuvs6] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-pkfbwzuvs6] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-pkfbwzuvs6] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-pkfbwzuvs6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NominaGenerar.razor.rz.scp.css */
/* ── Generar Descuento Nómina — Estilos aislados ─────────────── */

.crud-container[b-tlw6nrkih6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tlw6nrkih6 0.3s ease-out; }
@keyframes slideUp-b-tlw6nrkih6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-tlw6nrkih6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tlw6nrkih6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tlw6nrkih6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tlw6nrkih6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tlw6nrkih6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tlw6nrkih6] { display: flex; gap: 0.5rem; }

.btn-crud[b-tlw6nrkih6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; text-decoration: none; }
.btn-crud:disabled[b-tlw6nrkih6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tlw6nrkih6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tlw6nrkih6] { filter: brightness(1.1); }
.btn-outline[b-tlw6nrkih6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tlw6nrkih6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-help[b-tlw6nrkih6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tlw6nrkih6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tlw6nrkih6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }

.crud-alert[b-tlw6nrkih6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tlw6nrkih6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tlw6nrkih6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tlw6nrkih6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-tlw6nrkih6] { background: rgba(16,185,129,0.12); color: #86efac; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-tlw6nrkih6] { background: rgba(220,38,38,0.12); color: #fca5a5; border-color: rgba(220,38,38,0.3); }

.gen-card[b-tlw6nrkih6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1.25rem; max-width: 640px; }
.gen-section-title[b-tlw6nrkih6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.75rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.gen-section-title i[b-tlw6nrkih6] { color: var(--rg-accent, #4f46e5); }

.form-row[b-tlw6nrkih6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tlw6nrkih6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tlw6nrkih6] { flex: 2; }
.form-group label[b-tlw6nrkih6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tlw6nrkih6], .form-group select[b-tlw6nrkih6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tlw6nrkih6], .form-group select:focus[b-tlw6nrkih6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

.gen-preview[b-tlw6nrkih6] { display: flex; align-items: flex-start; gap: 0.5rem; background: rgba(37,99,235,0.06); border: 1px solid rgba(37,99,235,0.2); border-radius: 0.5rem; padding: 0.65rem 0.85rem; margin: 0.75rem 0; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.gen-actions[b-tlw6nrkih6] { display: flex; justify-content: flex-end; margin-top: 1.25rem; }

.text-muted[b-tlw6nrkih6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.76rem; }

.gen-result-panel[b-tlw6nrkih6] { display: flex; align-items: center; gap: 1rem; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 0.75rem; padding: 1rem 1.25rem; margin-top: 1rem; max-width: 640px; }
.gen-result-title[b-tlw6nrkih6] { font-weight: 700; color: #065f46; font-size: 0.95rem; }
.gen-result-sub[b-tlw6nrkih6] { font-size: 0.8rem; color: #047857; }
[data-mode="dark"] .gen-result-panel[b-tlw6nrkih6] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .gen-result-title[b-tlw6nrkih6] { color: #86efac; }
[data-mode="dark"] .gen-result-sub[b-tlw6nrkih6] { color: #6ee7b7; }

.spin[b-tlw6nrkih6] { animation: spin-b-tlw6nrkih6 0.8s linear infinite; }
@keyframes spin-b-tlw6nrkih6 { to { transform: rotate(360deg); } }

.modal-backdrop[b-tlw6nrkih6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-tlw6nrkih6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tlw6nrkih6] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-tlw6nrkih6] { max-width: 780px; }
.modal-header[b-tlw6nrkih6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tlw6nrkih6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-tlw6nrkih6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tlw6nrkih6] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-tlw6nrkih6] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-tlw6nrkih6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

.help-icon-header[b-tlw6nrkih6] { color: var(--rg-accent,#2563eb); }
.help-body[b-tlw6nrkih6] { display: flex; flex-direction: column; gap: 0; }
.help-section[b-tlw6nrkih6] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-tlw6nrkih6] { border-bottom: none; }
.help-section p[b-tlw6nrkih6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-tlw6nrkih6] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-tlw6nrkih6] { color: var(--rg-accent,#2563eb); }
.help-tip[b-tlw6nrkih6] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-tlw6nrkih6] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-tlw6nrkih6] { background: rgba(37,99,235,0.12); }
.help-steps[b-tlw6nrkih6] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-tlw6nrkih6] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-tlw6nrkih6] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; }
.help-step div[b-tlw6nrkih6] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

@media (max-width: 768px) {
    .form-row[b-tlw6nrkih6] { flex-direction: column; }
    .crud-header[b-tlw6nrkih6] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-tlw6nrkih6] { display: none; }
    .gen-card[b-tlw6nrkih6] { max-width: 100%; }
    .gen-result-panel[b-tlw6nrkih6] { max-width: 100%; flex-wrap: wrap; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_NotaCreditoDebito.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-g42nkhjucy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-g42nkhjucy 0.3s ease-out; }
@keyframes slideUp-b-g42nkhjucy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-g42nkhjucy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-g42nkhjucy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-g42nkhjucy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-g42nkhjucy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-g42nkhjucy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-g42nkhjucy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-g42nkhjucy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-g42nkhjucy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-g42nkhjucy] { filter: brightness(1.1); }
.btn-outline[b-g42nkhjucy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-g42nkhjucy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-g42nkhjucy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-g42nkhjucy] { filter: brightness(1.1); }
.btn-icon[b-g42nkhjucy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-g42nkhjucy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-g42nkhjucy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-g42nkhjucy] { color: #ef4444; }
.btn-delete:hover[b-g42nkhjucy] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-g42nkhjucy] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-g42nkhjucy] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-g42nkhjucy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-g42nkhjucy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-g42nkhjucy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-g42nkhjucy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-g42nkhjucy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-g42nkhjucy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-g42nkhjucy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-g42nkhjucy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-g42nkhjucy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-g42nkhjucy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-g42nkhjucy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-g42nkhjucy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-g42nkhjucy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-g42nkhjucy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-g42nkhjucy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-g42nkhjucy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-g42nkhjucy] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-g42nkhjucy] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-g42nkhjucy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-g42nkhjucy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-g42nkhjucy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-g42nkhjucy] { background: #f1f5f9; color: #64748b; }
.badge-info[b-g42nkhjucy] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-g42nkhjucy] { background: #fffbeb; color: #92400e; }
.badge-danger[b-g42nkhjucy] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-g42nkhjucy] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-g42nkhjucy] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-g42nkhjucy] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-g42nkhjucy] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-g42nkhjucy] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-g42nkhjucy] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-g42nkhjucy] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-g42nkhjucy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-g42nkhjucy] { text-align: center; }
.text-muted[b-g42nkhjucy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-g42nkhjucy], .crud-empty-state[b-g42nkhjucy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-g42nkhjucy] { font-size: 2rem; }
.crud-spinner[b-g42nkhjucy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-g42nkhjucy 0.6s linear infinite; }
.crud-spinner-sm[b-g42nkhjucy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-g42nkhjucy 0.6s linear infinite; }
@keyframes spin-b-g42nkhjucy { to { transform: rotate(360deg); } }
.spin[b-g42nkhjucy] { animation: spin-b-g42nkhjucy 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-g42nkhjucy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-g42nkhjucy 0.15s ease-out; }
.modal-container[b-g42nkhjucy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-g42nkhjucy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-g42nkhjucy 0.2s ease-out; }
.modal-lg[b-g42nkhjucy] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-g42nkhjucy] { max-width: 420px; }
@keyframes fadeIn-b-g42nkhjucy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-g42nkhjucy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-g42nkhjucy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-g42nkhjucy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-g42nkhjucy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-g42nkhjucy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-g42nkhjucy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-g42nkhjucy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-g42nkhjucy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-g42nkhjucy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-g42nkhjucy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-g42nkhjucy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-g42nkhjucy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-g42nkhjucy] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-g42nkhjucy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-g42nkhjucy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-g42nkhjucy] { flex: 2; }
.form-group label[b-g42nkhjucy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-g42nkhjucy], .form-group select[b-g42nkhjucy], .form-textarea[b-g42nkhjucy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-g42nkhjucy], .form-group select:focus[b-g42nkhjucy], .form-textarea:focus[b-g42nkhjucy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-g42nkhjucy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-g42nkhjucy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-g42nkhjucy] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-g42nkhjucy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-g42nkhjucy] { margin-top: 0; }
.form-section-title i[b-g42nkhjucy] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-g42nkhjucy] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-g42nkhjucy] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-g42nkhjucy] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-g42nkhjucy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-g42nkhjucy] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-g42nkhjucy] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-g42nkhjucy] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-g42nkhjucy] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-g42nkhjucy] { padding: 0.75rem; }
    .crud-header[b-g42nkhjucy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-g42nkhjucy] { font-size: 1.1rem; }
    .btn-text[b-g42nkhjucy] { display: none; }
    .form-row[b-g42nkhjucy] { flex-direction: column; }
    .form-row-3[b-g42nkhjucy] { grid-template-columns: 1fr; }
    .form-row-4[b-g42nkhjucy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-g42nkhjucy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-g42nkhjucy] { max-width: 98vw; width: 98vw; }
    .modal-body[b-g42nkhjucy] { padding: 0.75rem; }
    .modal-tabs[b-g42nkhjucy] { overflow-x: auto; }
    .modal-tab[b-g42nkhjucy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-g42nkhjucy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-g42nkhjucy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-g42nkhjucy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-g42nkhjucy] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-g42nkhjucy] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-g42nkhjucy] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-g42nkhjucy] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-g42nkhjucy] { border-bottom: none; }
.help-section p[b-g42nkhjucy] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-g42nkhjucy], .help-section ol[b-g42nkhjucy] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-g42nkhjucy] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-g42nkhjucy] { color: var(--rg-accent,#2563eb); }
.help-tip[b-g42nkhjucy] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-g42nkhjucy] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-g42nkhjucy] { background: rgba(37,99,235,0.12); }
.help-table[b-g42nkhjucy] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-g42nkhjucy] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-g42nkhjucy] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-g42nkhjucy] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-g42nkhjucy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-g42nkhjucy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-g42nkhjucy] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-g42nkhjucy] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-g42nkhjucy] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-g42nkhjucy] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-g42nkhjucy] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-g42nkhjucy] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-g42nkhjucy] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-g42nkhjucy] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-g42nkhjucy] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-g42nkhjucy] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-g42nkhjucy] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-g42nkhjucy] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-g42nkhjucy] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-g42nkhjucy] { font-size: 1.6rem; }
.pos-op-btn > div[b-g42nkhjucy] { display: flex; flex-direction: column; }
.pos-op-title[b-g42nkhjucy] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-g42nkhjucy] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-g42nkhjucy] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-g42nkhjucy] { color: var(--rg-success); }
.pos-op-ret[b-g42nkhjucy] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-g42nkhjucy] { color: var(--rg-danger); }

.pos-cuenta-search[b-g42nkhjucy] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-g42nkhjucy] { flex: 1; }

.pos-cuenta-card[b-g42nkhjucy] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-g42nkhjucy] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-g42nkhjucy] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-g42nkhjucy] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-g42nkhjucy] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-g42nkhjucy] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-g42nkhjucy], .pos-res-saldos > div[b-g42nkhjucy] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-g42nkhjucy] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-g42nkhjucy] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-g42nkhjucy] { color: var(--rg-success); }
.pos-cuenta-aviso[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-g42nkhjucy] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-g42nkhjucy] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-g42nkhjucy] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-g42nkhjucy] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-g42nkhjucy]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-g42nkhjucy] { z-index: 2001 !important; }

.badge-warn[b-g42nkhjucy] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-g42nkhjucy] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-g42nkhjucy] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-g42nkhjucy] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-g42nkhjucy] { grid-template-columns: 1fr; }
}

/* ── Ajustes NC/ND ─────────────────────────────────────────────────────── */
.aj-tipo-bar[b-g42nkhjucy] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.aj-tipo-btn[b-g42nkhjucy] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 2px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); opacity: 0.7; }
.aj-tipo-btn:hover[b-g42nkhjucy] { opacity: 1; }
.aj-tipo-btn i[b-g42nkhjucy] { font-size: 1.6rem; }
.aj-tipo-btn > div[b-g42nkhjucy] { display: flex; flex-direction: column; }
.aj-tipo-title[b-g42nkhjucy] { font-weight: 700; font-size: 1rem; }
.aj-tipo-sub[b-g42nkhjucy] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.aj-tipo-btn.active[b-g42nkhjucy] { opacity: 1; }
.aj-tipo-btn.aj-cre[b-g42nkhjucy] { border-color: var(--rg-success); }
.aj-tipo-btn.aj-cre i[b-g42nkhjucy] { color: var(--rg-success); }
.aj-tipo-btn.aj-deb[b-g42nkhjucy] { border-color: var(--rg-danger); }
.aj-tipo-btn.aj-deb i[b-g42nkhjucy] { color: var(--rg-danger); }
.aj-req[b-g42nkhjucy] { color: var(--rg-danger); }
.ti-actions[b-g42nkhjucy] { display: flex; justify-content: flex-end; margin-top: 0.5rem; }

@media (max-width: 640px) { .aj-tipo-bar[b-g42nkhjucy] { grid-template-columns: 1fr; } }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PagoPrestamo.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-kk33w7n5zk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kk33w7n5zk 0.3s ease-out; }
@keyframes slideUp-b-kk33w7n5zk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kk33w7n5zk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kk33w7n5zk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kk33w7n5zk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kk33w7n5zk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kk33w7n5zk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kk33w7n5zk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kk33w7n5zk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kk33w7n5zk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kk33w7n5zk] { filter: brightness(1.1); }
.btn-outline[b-kk33w7n5zk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kk33w7n5zk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kk33w7n5zk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kk33w7n5zk] { filter: brightness(1.1); }
.btn-icon[b-kk33w7n5zk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kk33w7n5zk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kk33w7n5zk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kk33w7n5zk] { color: #ef4444; }
.btn-delete:hover[b-kk33w7n5zk] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-kk33w7n5zk] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-kk33w7n5zk] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-kk33w7n5zk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kk33w7n5zk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kk33w7n5zk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kk33w7n5zk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kk33w7n5zk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kk33w7n5zk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-kk33w7n5zk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-kk33w7n5zk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kk33w7n5zk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-kk33w7n5zk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-kk33w7n5zk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kk33w7n5zk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kk33w7n5zk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kk33w7n5zk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kk33w7n5zk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kk33w7n5zk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kk33w7n5zk] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-kk33w7n5zk] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-kk33w7n5zk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-kk33w7n5zk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kk33w7n5zk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kk33w7n5zk] { background: #f1f5f9; color: #64748b; }
.badge-info[b-kk33w7n5zk] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-kk33w7n5zk] { background: #fffbeb; color: #92400e; }
.badge-danger[b-kk33w7n5zk] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-kk33w7n5zk] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-kk33w7n5zk] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-kk33w7n5zk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-kk33w7n5zk] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-kk33w7n5zk] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-kk33w7n5zk] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-kk33w7n5zk] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-kk33w7n5zk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kk33w7n5zk] { text-align: center; }
.text-muted[b-kk33w7n5zk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kk33w7n5zk], .crud-empty-state[b-kk33w7n5zk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kk33w7n5zk] { font-size: 2rem; }
.crud-spinner[b-kk33w7n5zk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kk33w7n5zk 0.6s linear infinite; }
.crud-spinner-sm[b-kk33w7n5zk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kk33w7n5zk 0.6s linear infinite; }
@keyframes spin-b-kk33w7n5zk { to { transform: rotate(360deg); } }
.spin[b-kk33w7n5zk] { animation: spin-b-kk33w7n5zk 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-kk33w7n5zk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kk33w7n5zk 0.15s ease-out; }
.modal-container[b-kk33w7n5zk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kk33w7n5zk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kk33w7n5zk 0.2s ease-out; }
.modal-lg[b-kk33w7n5zk] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-kk33w7n5zk] { max-width: 420px; }
@keyframes fadeIn-b-kk33w7n5zk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kk33w7n5zk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kk33w7n5zk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kk33w7n5zk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-kk33w7n5zk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kk33w7n5zk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kk33w7n5zk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kk33w7n5zk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kk33w7n5zk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-kk33w7n5zk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kk33w7n5zk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kk33w7n5zk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kk33w7n5zk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-kk33w7n5zk] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kk33w7n5zk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kk33w7n5zk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kk33w7n5zk] { flex: 2; }
.form-group label[b-kk33w7n5zk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kk33w7n5zk], .form-group select[b-kk33w7n5zk], .form-textarea[b-kk33w7n5zk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kk33w7n5zk], .form-group select:focus[b-kk33w7n5zk], .form-textarea:focus[b-kk33w7n5zk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kk33w7n5zk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kk33w7n5zk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kk33w7n5zk] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kk33w7n5zk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-kk33w7n5zk] { margin-top: 0; }
.form-section-title i[b-kk33w7n5zk] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-kk33w7n5zk] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-kk33w7n5zk] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-kk33w7n5zk] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-kk33w7n5zk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-kk33w7n5zk] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-kk33w7n5zk] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-kk33w7n5zk] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-kk33w7n5zk] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kk33w7n5zk] { padding: 0.75rem; }
    .crud-header[b-kk33w7n5zk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kk33w7n5zk] { font-size: 1.1rem; }
    .btn-text[b-kk33w7n5zk] { display: none; }
    .form-row[b-kk33w7n5zk] { flex-direction: column; }
    .form-row-3[b-kk33w7n5zk] { grid-template-columns: 1fr; }
    .form-row-4[b-kk33w7n5zk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kk33w7n5zk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kk33w7n5zk] { max-width: 98vw; width: 98vw; }
    .modal-body[b-kk33w7n5zk] { padding: 0.75rem; }
    .modal-tabs[b-kk33w7n5zk] { overflow-x: auto; }
    .modal-tab[b-kk33w7n5zk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-kk33w7n5zk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kk33w7n5zk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kk33w7n5zk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kk33w7n5zk] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-kk33w7n5zk] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-kk33w7n5zk] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-kk33w7n5zk] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-kk33w7n5zk] { border-bottom: none; }
.help-section p[b-kk33w7n5zk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-kk33w7n5zk], .help-section ol[b-kk33w7n5zk] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-kk33w7n5zk] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-kk33w7n5zk] { color: var(--rg-accent,#2563eb); }
.help-tip[b-kk33w7n5zk] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-kk33w7n5zk] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-kk33w7n5zk] { background: rgba(37,99,235,0.12); }
.help-table[b-kk33w7n5zk] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-kk33w7n5zk] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-kk33w7n5zk] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-kk33w7n5zk] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-kk33w7n5zk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-kk33w7n5zk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-kk33w7n5zk] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-kk33w7n5zk] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-kk33w7n5zk] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-kk33w7n5zk] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-kk33w7n5zk] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-kk33w7n5zk] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-kk33w7n5zk] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-kk33w7n5zk] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-kk33w7n5zk] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-kk33w7n5zk] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-kk33w7n5zk] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-kk33w7n5zk] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-kk33w7n5zk] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-kk33w7n5zk] { font-size: 1.6rem; }
.pos-op-btn > div[b-kk33w7n5zk] { display: flex; flex-direction: column; }
.pos-op-title[b-kk33w7n5zk] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-kk33w7n5zk] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-kk33w7n5zk] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-kk33w7n5zk] { color: var(--rg-success); }
.pos-op-ret[b-kk33w7n5zk] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-kk33w7n5zk] { color: var(--rg-danger); }

.pos-cuenta-search[b-kk33w7n5zk] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-kk33w7n5zk] { flex: 1; }

.pos-cuenta-card[b-kk33w7n5zk] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-kk33w7n5zk] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-kk33w7n5zk] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-kk33w7n5zk] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-kk33w7n5zk] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-kk33w7n5zk] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-kk33w7n5zk], .pos-res-saldos > div[b-kk33w7n5zk] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-kk33w7n5zk] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-kk33w7n5zk] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-kk33w7n5zk] { color: var(--rg-success); }
.pos-cuenta-aviso[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-kk33w7n5zk] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-kk33w7n5zk] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-kk33w7n5zk] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-kk33w7n5zk] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-kk33w7n5zk]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-kk33w7n5zk] { z-index: 2001 !important; }

.badge-warn[b-kk33w7n5zk] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-kk33w7n5zk] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-kk33w7n5zk] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-kk33w7n5zk] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-kk33w7n5zk] { grid-template-columns: 1fr; }
}

/* ── Transferencia interna ─────────────────────────────────────────────── */
.ti-grid[b-kk33w7n5zk] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.ti-col[b-kk33w7n5zk] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; padding: 1rem; }
.ti-col-title[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.45rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.65rem; }
.ti-col-title i[b-kk33w7n5zk] { color: var(--rg-accent); }
.ti-aviso[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.85rem; border-radius: 0.5rem; font-size: 0.85rem; margin-bottom: 0.85rem; }
.ti-aviso-ok[b-kk33w7n5zk] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.25); }
.ti-aviso-warn[b-kk33w7n5zk] { background: rgba(217,119,6,0.1); color: #92400e; border: 1px solid rgba(217,119,6,0.25); }
[data-mode="dark"] .ti-aviso-ok[b-kk33w7n5zk] { color: #86efac; }
[data-mode="dark"] .ti-aviso-warn[b-kk33w7n5zk] { color: #fcd34d; }
.ti-actions[b-kk33w7n5zk] { display: flex; justify-content: flex-end; margin-top: 0.5rem; }

@media (max-width: 720px) { .ti-grid[b-kk33w7n5zk] { grid-template-columns: 1fr; } }

/* ── Resultados de búsqueda de préstamo ────────────────────────────────── */
.pp-resultados[b-kk33w7n5zk] { display: flex; flex-direction: column; gap: 0.3rem; margin-top: 0.5rem; max-height: 240px; overflow-y: auto; }
.pp-result-item[b-kk33w7n5zk] { display: grid; grid-template-columns: 1fr 1.5fr auto; gap: 0.5rem; align-items: center;
    text-align: left; padding: 0.5rem 0.7rem; border: 1px solid var(--rg-border); border-radius: 0.5rem;
    background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.84rem; transition: all 0.12s; }
.pp-result-item:hover[b-kk33w7n5zk] { background: var(--rg-bg-hover); border-color: var(--rg-primary); }
.pp-result-bal[b-kk33w7n5zk] { font-family: 'Cascadia Code','Fira Code',monospace; font-weight: 700; color: var(--rg-text-primary); }

/* ── Detalle préstamo: cuotas, cargos, cascada ─────────────────────────── */
.pp-section-title[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.5rem; font-weight: 700; font-size: 0.9rem;
    color: var(--rg-text-primary); margin: 1.1rem 0 0.5rem; }
.pp-mini[b-kk33w7n5zk] { margin-bottom: 0.5rem; }
.pp-mini .crud-table th[b-kk33w7n5zk], .pp-mini .crud-table td[b-kk33w7n5zk] { padding: 0.35rem 0.55rem; font-size: 0.8rem; }
.pp-tot td[b-kk33w7n5zk] { background: var(--rg-bg-subtle); font-weight: 700; border-top: 2px solid var(--rg-border); }
.text-right[b-kk33w7n5zk] { text-align: right; }
.badge-warn[b-kk33w7n5zk] { background: rgba(217,119,6,0.14); color: #92400e; }
[data-mode="dark"] .badge-warn[b-kk33w7n5zk] { color: #fcd34d; }

.pp-pago[b-kk33w7n5zk] { margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid var(--rg-border); }
.pp-cascada[b-kk33w7n5zk] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.75rem 1rem; margin: 0.5rem 0; }
.pp-casc-title[b-kk33w7n5zk] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; font-weight: 700;
    color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.pp-casc-title i[b-kk33w7n5zk] { color: var(--rg-accent); }
.pp-casc-grid[b-kk33w7n5zk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 0.5rem; }
.pp-casc-item[b-kk33w7n5zk] { display: flex; flex-direction: column; background: var(--rg-bg-card); border: 1px solid var(--rg-border);
    border-radius: 0.45rem; padding: 0.4rem 0.6rem; }
.pp-casc-item > span:first-child[b-kk33w7n5zk] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); font-weight: 700; }
.pp-casc-item > span:last-child[b-kk33w7n5zk] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); }
.pp-casc-sobr[b-kk33w7n5zk] { border-color: var(--rg-warning); }
.btn-sm[b-kk33w7n5zk] { padding: 0.4rem 0.6rem; font-size: 0.78rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PagosCruzados.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-x1uwqown8d] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x1uwqown8d 0.3s ease-out; }
@keyframes slideUp-b-x1uwqown8d { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x1uwqown8d] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x1uwqown8d] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x1uwqown8d] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x1uwqown8d] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x1uwqown8d] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x1uwqown8d] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x1uwqown8d] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x1uwqown8d] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x1uwqown8d] { filter: brightness(1.1); }
.btn-outline[b-x1uwqown8d] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x1uwqown8d] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x1uwqown8d] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x1uwqown8d] { filter: brightness(1.1); }
.btn-icon[b-x1uwqown8d] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x1uwqown8d] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x1uwqown8d] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-x1uwqown8d] { color: #ef4444; }
.btn-delete:hover[b-x1uwqown8d] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-x1uwqown8d] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-x1uwqown8d] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-x1uwqown8d] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x1uwqown8d] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x1uwqown8d] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x1uwqown8d] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-x1uwqown8d] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-x1uwqown8d] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-x1uwqown8d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-x1uwqown8d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-x1uwqown8d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-x1uwqown8d] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-x1uwqown8d] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-x1uwqown8d] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x1uwqown8d] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x1uwqown8d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x1uwqown8d] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x1uwqown8d] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x1uwqown8d] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-x1uwqown8d] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-x1uwqown8d] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-x1uwqown8d] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-x1uwqown8d] { background: #ecfdf5; color: #065f46; }
.badge-no[b-x1uwqown8d] { background: #f1f5f9; color: #64748b; }
.badge-info[b-x1uwqown8d] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-x1uwqown8d] { background: #fffbeb; color: #92400e; }
.badge-danger[b-x1uwqown8d] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-x1uwqown8d] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-x1uwqown8d] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-x1uwqown8d] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-x1uwqown8d] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-x1uwqown8d] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-x1uwqown8d] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-x1uwqown8d] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-x1uwqown8d] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x1uwqown8d] { text-align: center; }
.text-muted[b-x1uwqown8d] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-x1uwqown8d], .crud-empty-state[b-x1uwqown8d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x1uwqown8d] { font-size: 2rem; }
.crud-spinner[b-x1uwqown8d] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x1uwqown8d 0.6s linear infinite; }
.crud-spinner-sm[b-x1uwqown8d] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x1uwqown8d 0.6s linear infinite; }
@keyframes spin-b-x1uwqown8d { to { transform: rotate(360deg); } }
.spin[b-x1uwqown8d] { animation: spin-b-x1uwqown8d 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-x1uwqown8d] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x1uwqown8d 0.15s ease-out; }
.modal-container[b-x1uwqown8d] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x1uwqown8d] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x1uwqown8d 0.2s ease-out; }
.modal-lg[b-x1uwqown8d] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-x1uwqown8d] { max-width: 420px; }
@keyframes fadeIn-b-x1uwqown8d { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x1uwqown8d { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x1uwqown8d] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x1uwqown8d] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-x1uwqown8d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x1uwqown8d] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x1uwqown8d] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x1uwqown8d] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-x1uwqown8d] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-x1uwqown8d] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-x1uwqown8d] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-x1uwqown8d] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-x1uwqown8d] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-x1uwqown8d] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-x1uwqown8d] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-x1uwqown8d] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-x1uwqown8d] { flex: 2; }
.form-group label[b-x1uwqown8d] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-x1uwqown8d], .form-group select[b-x1uwqown8d], .form-textarea[b-x1uwqown8d] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-x1uwqown8d], .form-group select:focus[b-x1uwqown8d], .form-textarea:focus[b-x1uwqown8d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-x1uwqown8d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-x1uwqown8d] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-x1uwqown8d] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-x1uwqown8d] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-x1uwqown8d] { margin-top: 0; }
.form-section-title i[b-x1uwqown8d] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-x1uwqown8d] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-x1uwqown8d] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-x1uwqown8d] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-x1uwqown8d] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-x1uwqown8d] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-x1uwqown8d] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-x1uwqown8d] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-x1uwqown8d] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-x1uwqown8d] { padding: 0.75rem; }
    .crud-header[b-x1uwqown8d] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x1uwqown8d] { font-size: 1.1rem; }
    .btn-text[b-x1uwqown8d] { display: none; }
    .form-row[b-x1uwqown8d] { flex-direction: column; }
    .form-row-3[b-x1uwqown8d] { grid-template-columns: 1fr; }
    .form-row-4[b-x1uwqown8d] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-x1uwqown8d] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x1uwqown8d] { max-width: 98vw; width: 98vw; }
    .modal-body[b-x1uwqown8d] { padding: 0.75rem; }
    .modal-tabs[b-x1uwqown8d] { overflow-x: auto; }
    .modal-tab[b-x1uwqown8d] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-x1uwqown8d] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x1uwqown8d] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x1uwqown8d] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x1uwqown8d] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-x1uwqown8d] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-x1uwqown8d] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-x1uwqown8d] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-x1uwqown8d] { border-bottom: none; }
.help-section p[b-x1uwqown8d] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-x1uwqown8d], .help-section ol[b-x1uwqown8d] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-x1uwqown8d] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-x1uwqown8d] { color: var(--rg-accent,#2563eb); }
.help-tip[b-x1uwqown8d] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-x1uwqown8d] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-x1uwqown8d] { background: rgba(37,99,235,0.12); }
.help-table[b-x1uwqown8d] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-x1uwqown8d] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-x1uwqown8d] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-x1uwqown8d] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-x1uwqown8d] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-x1uwqown8d] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-x1uwqown8d] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-x1uwqown8d] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-x1uwqown8d] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-x1uwqown8d] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-x1uwqown8d] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-x1uwqown8d] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-x1uwqown8d] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-x1uwqown8d] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-x1uwqown8d] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-x1uwqown8d] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-x1uwqown8d] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-x1uwqown8d] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-x1uwqown8d] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-x1uwqown8d] { font-size: 1.6rem; }
.pos-op-btn > div[b-x1uwqown8d] { display: flex; flex-direction: column; }
.pos-op-title[b-x1uwqown8d] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-x1uwqown8d] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-x1uwqown8d] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-x1uwqown8d] { color: var(--rg-success); }
.pos-op-ret[b-x1uwqown8d] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-x1uwqown8d] { color: var(--rg-danger); }

.pos-cuenta-search[b-x1uwqown8d] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-x1uwqown8d] { flex: 1; }

.pos-cuenta-card[b-x1uwqown8d] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-x1uwqown8d] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-x1uwqown8d] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-x1uwqown8d] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-x1uwqown8d] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-x1uwqown8d] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-x1uwqown8d], .pos-res-saldos > div[b-x1uwqown8d] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-x1uwqown8d] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-x1uwqown8d] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-x1uwqown8d] { color: var(--rg-success); }
.pos-cuenta-aviso[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-x1uwqown8d] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-x1uwqown8d] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-x1uwqown8d] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-x1uwqown8d] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-x1uwqown8d]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-x1uwqown8d] { z-index: 2001 !important; }

.badge-warn[b-x1uwqown8d] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-x1uwqown8d] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-x1uwqown8d] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-x1uwqown8d] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-x1uwqown8d] { grid-template-columns: 1fr; }
}

/* ── Transferencia externa ─────────────────────────────────────────────── */
.te-section-title[b-x1uwqown8d] { display: flex; align-items: center; gap: 0.45rem; font-weight: 700; font-size: 0.9rem;
    color: var(--rg-text-primary); margin: 1rem 0 0.6rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border); }
.te-section-title i[b-x1uwqown8d] { color: var(--rg-accent); }
.te-resumen[b-x1uwqown8d] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.75rem 1rem; margin: 0.85rem 0; }
.te-res-row[b-x1uwqown8d] { display: flex; justify-content: space-between; font-size: 0.85rem; color: var(--rg-text-secondary); padding: 0.2rem 0; }
.te-res-total[b-x1uwqown8d] { border-top: 1px dashed var(--rg-border); margin-top: 0.35rem; padding-top: 0.5rem;
    font-weight: 700; font-size: 1rem; color: var(--rg-text-primary); }
.te-tip-tran[b-x1uwqown8d] { display: flex; gap: 0.5rem; align-items: flex-start; margin-top: 0.75rem; font-size: 0.8rem;
    color: var(--rg-text-secondary); background: rgba(217,119,6,0.08); border-left: 4px solid var(--rg-warning);
    border-radius: 0 0.4rem 0.4rem 0; padding: 0.55rem 0.7rem; }
.te-tip-tran i[b-x1uwqown8d] { color: var(--rg-warning); flex-shrink: 0; margin-top: 0.1rem; }
select[b-x1uwqown8d] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; width: 100%; }
.ti-actions[b-x1uwqown8d] { display: flex; justify-content: flex-end; margin-top: 0.5rem; }

/* ── Bandeja pagos cruzados ────────────────────────────────────────────── */
.text-right[b-x1uwqown8d] { text-align: right; }
.bt-count[b-x1uwqown8d] { text-align: right; font-size: 0.8rem; color: var(--rg-text-muted); margin-top: 0.5rem; }
.badge-no[b-x1uwqown8d] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .badge-no[b-x1uwqown8d] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Parametros.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-ht4r2bcw51] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ht4r2bcw51 0.3s ease-out; }
@keyframes slideUp-b-ht4r2bcw51 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ht4r2bcw51] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ht4r2bcw51] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ht4r2bcw51] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ht4r2bcw51] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ht4r2bcw51] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ht4r2bcw51] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ht4r2bcw51] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ht4r2bcw51] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ht4r2bcw51] { filter: brightness(1.1); }
.btn-outline[b-ht4r2bcw51] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ht4r2bcw51] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ht4r2bcw51] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ht4r2bcw51] { filter: brightness(1.1); }
.btn-icon[b-ht4r2bcw51] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ht4r2bcw51] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ht4r2bcw51] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ht4r2bcw51] { color: #ef4444; }
.btn-delete:hover[b-ht4r2bcw51] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-ht4r2bcw51] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-ht4r2bcw51] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-ht4r2bcw51] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ht4r2bcw51] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ht4r2bcw51] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ht4r2bcw51] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ht4r2bcw51] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ht4r2bcw51] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-ht4r2bcw51] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-ht4r2bcw51] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ht4r2bcw51] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-ht4r2bcw51] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-ht4r2bcw51] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ht4r2bcw51] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ht4r2bcw51] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ht4r2bcw51] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ht4r2bcw51] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ht4r2bcw51] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ht4r2bcw51] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-ht4r2bcw51] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-ht4r2bcw51] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-ht4r2bcw51] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ht4r2bcw51] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ht4r2bcw51] { background: #f1f5f9; color: #64748b; }
.badge-info[b-ht4r2bcw51] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-ht4r2bcw51] { background: #fffbeb; color: #92400e; }
.badge-danger[b-ht4r2bcw51] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-ht4r2bcw51] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-ht4r2bcw51] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-ht4r2bcw51] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-ht4r2bcw51] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-ht4r2bcw51] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-ht4r2bcw51] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-ht4r2bcw51] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-ht4r2bcw51] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ht4r2bcw51] { text-align: center; }
.text-muted[b-ht4r2bcw51] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ht4r2bcw51], .crud-empty-state[b-ht4r2bcw51] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ht4r2bcw51] { font-size: 2rem; }
.crud-spinner[b-ht4r2bcw51] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ht4r2bcw51 0.6s linear infinite; }
.crud-spinner-sm[b-ht4r2bcw51] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ht4r2bcw51 0.6s linear infinite; }
@keyframes spin-b-ht4r2bcw51 { to { transform: rotate(360deg); } }
.spin[b-ht4r2bcw51] { animation: spin-b-ht4r2bcw51 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-ht4r2bcw51] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ht4r2bcw51 0.15s ease-out; }
.modal-container[b-ht4r2bcw51] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ht4r2bcw51] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ht4r2bcw51 0.2s ease-out; }
.modal-lg[b-ht4r2bcw51] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-ht4r2bcw51] { max-width: 420px; }
@keyframes fadeIn-b-ht4r2bcw51 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ht4r2bcw51 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ht4r2bcw51] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ht4r2bcw51] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ht4r2bcw51] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ht4r2bcw51] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ht4r2bcw51] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ht4r2bcw51] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ht4r2bcw51] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-ht4r2bcw51] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ht4r2bcw51] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ht4r2bcw51] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ht4r2bcw51] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-ht4r2bcw51] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ht4r2bcw51] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ht4r2bcw51] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ht4r2bcw51] { flex: 2; }
.form-group label[b-ht4r2bcw51] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ht4r2bcw51], .form-group select[b-ht4r2bcw51], .form-textarea[b-ht4r2bcw51] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ht4r2bcw51], .form-group select:focus[b-ht4r2bcw51], .form-textarea:focus[b-ht4r2bcw51] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ht4r2bcw51] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ht4r2bcw51] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ht4r2bcw51] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ht4r2bcw51] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-ht4r2bcw51] { margin-top: 0; }
.form-section-title i[b-ht4r2bcw51] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-ht4r2bcw51] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-ht4r2bcw51] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-ht4r2bcw51] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-ht4r2bcw51] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-ht4r2bcw51] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-ht4r2bcw51] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-ht4r2bcw51] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-ht4r2bcw51] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ht4r2bcw51] { padding: 0.75rem; }
    .crud-header[b-ht4r2bcw51] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ht4r2bcw51] { font-size: 1.1rem; }
    .btn-text[b-ht4r2bcw51] { display: none; }
    .form-row[b-ht4r2bcw51] { flex-direction: column; }
    .form-row-3[b-ht4r2bcw51] { grid-template-columns: 1fr; }
    .form-row-4[b-ht4r2bcw51] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ht4r2bcw51] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ht4r2bcw51] { max-width: 98vw; width: 98vw; }
    .modal-body[b-ht4r2bcw51] { padding: 0.75rem; }
    .modal-tabs[b-ht4r2bcw51] { overflow-x: auto; }
    .modal-tab[b-ht4r2bcw51] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ht4r2bcw51] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ht4r2bcw51] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ht4r2bcw51] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ht4r2bcw51] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-ht4r2bcw51] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-ht4r2bcw51] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ht4r2bcw51] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-ht4r2bcw51] { border-bottom: none; }
.help-section p[b-ht4r2bcw51] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-ht4r2bcw51], .help-section ol[b-ht4r2bcw51] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ht4r2bcw51] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-ht4r2bcw51] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ht4r2bcw51] { color: var(--rg-accent,#2563eb); }
.help-tip[b-ht4r2bcw51] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-ht4r2bcw51] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-ht4r2bcw51] { background: rgba(37,99,235,0.12); }
.help-table[b-ht4r2bcw51] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-ht4r2bcw51] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-ht4r2bcw51] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-ht4r2bcw51] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PersonalOperativoCaja.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-719m0gheh3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-719m0gheh3 0.3s ease-out; }
@keyframes slideUp-b-719m0gheh3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-719m0gheh3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-719m0gheh3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-719m0gheh3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-719m0gheh3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-719m0gheh3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-719m0gheh3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-719m0gheh3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-719m0gheh3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-719m0gheh3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-719m0gheh3] { filter: brightness(1.1); }
.btn-outline[b-719m0gheh3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-719m0gheh3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-719m0gheh3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-719m0gheh3] { filter: brightness(1.1); }
.btn-icon[b-719m0gheh3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-719m0gheh3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-719m0gheh3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-719m0gheh3] { color: #ef4444; }
.btn-delete:hover[b-719m0gheh3] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-719m0gheh3] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-719m0gheh3] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-719m0gheh3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-719m0gheh3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-719m0gheh3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-719m0gheh3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-719m0gheh3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-719m0gheh3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-719m0gheh3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-719m0gheh3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-719m0gheh3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-719m0gheh3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-719m0gheh3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-719m0gheh3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-719m0gheh3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-719m0gheh3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-719m0gheh3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-719m0gheh3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-719m0gheh3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-719m0gheh3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-719m0gheh3] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-719m0gheh3] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-719m0gheh3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-719m0gheh3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-719m0gheh3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-719m0gheh3] { background: #f1f5f9; color: #64748b; }
.badge-info[b-719m0gheh3] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-719m0gheh3] { background: #fffbeb; color: #92400e; }
.badge-danger[b-719m0gheh3] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-719m0gheh3] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-719m0gheh3] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-719m0gheh3] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-719m0gheh3] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-719m0gheh3] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-719m0gheh3] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-719m0gheh3] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-719m0gheh3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-719m0gheh3] { text-align: center; }
.text-muted[b-719m0gheh3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-719m0gheh3], .crud-empty-state[b-719m0gheh3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-719m0gheh3] { font-size: 2rem; }
.crud-spinner[b-719m0gheh3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-719m0gheh3 0.6s linear infinite; }
.crud-spinner-sm[b-719m0gheh3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-719m0gheh3 0.6s linear infinite; }
@keyframes spin-b-719m0gheh3 { to { transform: rotate(360deg); } }
.spin[b-719m0gheh3] { animation: spin-b-719m0gheh3 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-719m0gheh3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-719m0gheh3 0.15s ease-out; }
.modal-container[b-719m0gheh3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-719m0gheh3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-719m0gheh3 0.2s ease-out; }
.modal-lg[b-719m0gheh3] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-719m0gheh3] { max-width: 420px; }
@keyframes fadeIn-b-719m0gheh3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-719m0gheh3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-719m0gheh3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-719m0gheh3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-719m0gheh3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-719m0gheh3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-719m0gheh3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-719m0gheh3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-719m0gheh3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-719m0gheh3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-719m0gheh3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-719m0gheh3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-719m0gheh3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-719m0gheh3] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-719m0gheh3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-719m0gheh3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-719m0gheh3] { flex: 2; }
.form-group label[b-719m0gheh3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-719m0gheh3], .form-group select[b-719m0gheh3], .form-textarea[b-719m0gheh3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-719m0gheh3], .form-group select:focus[b-719m0gheh3], .form-textarea:focus[b-719m0gheh3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-719m0gheh3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-719m0gheh3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-719m0gheh3] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-719m0gheh3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-719m0gheh3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-719m0gheh3] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-719m0gheh3] { margin-top: 0; }
.form-section-title i[b-719m0gheh3] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-719m0gheh3] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-719m0gheh3] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-719m0gheh3] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-719m0gheh3] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-719m0gheh3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-719m0gheh3] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-719m0gheh3] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-719m0gheh3] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-719m0gheh3] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-719m0gheh3] { padding: 0.75rem; }
    .crud-header[b-719m0gheh3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-719m0gheh3] { font-size: 1.1rem; }
    .btn-text[b-719m0gheh3] { display: none; }
    .form-row[b-719m0gheh3] { flex-direction: column; }
    .form-row-3[b-719m0gheh3] { grid-template-columns: 1fr; }
    .form-row-4[b-719m0gheh3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-719m0gheh3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-719m0gheh3] { max-width: 98vw; width: 98vw; }
    .modal-body[b-719m0gheh3] { padding: 0.75rem; }
    .modal-tabs[b-719m0gheh3] { overflow-x: auto; }
    .modal-tab[b-719m0gheh3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-719m0gheh3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-719m0gheh3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-719m0gheh3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-719m0gheh3] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-719m0gheh3] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-719m0gheh3] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-719m0gheh3] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-719m0gheh3] { border-bottom: none; }
.help-section p[b-719m0gheh3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-719m0gheh3], .help-section ol[b-719m0gheh3] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-719m0gheh3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-719m0gheh3] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-719m0gheh3] { color: var(--rg-accent,#2563eb); }
.help-tip[b-719m0gheh3] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-719m0gheh3] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-719m0gheh3] { background: rgba(37,99,235,0.12); }
.help-table[b-719m0gheh3] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-719m0gheh3] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-719m0gheh3] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-719m0gheh3] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-719m0gheh3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-719m0gheh3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-719m0gheh3] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-719m0gheh3] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-719m0gheh3] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-719m0gheh3] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-719m0gheh3] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-719m0gheh3] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-719m0gheh3] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-719m0gheh3] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-719m0gheh3] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-719m0gheh3] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-719m0gheh3] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-719m0gheh3] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PlantillasNotificacion.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-3u7gj2r9hy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3u7gj2r9hy 0.3s ease-out; }
@keyframes slideUp-b-3u7gj2r9hy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3u7gj2r9hy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3u7gj2r9hy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3u7gj2r9hy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3u7gj2r9hy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3u7gj2r9hy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3u7gj2r9hy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3u7gj2r9hy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3u7gj2r9hy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3u7gj2r9hy] { filter: brightness(1.1); }
.btn-outline[b-3u7gj2r9hy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3u7gj2r9hy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3u7gj2r9hy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3u7gj2r9hy] { filter: brightness(1.1); }
.btn-icon[b-3u7gj2r9hy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3u7gj2r9hy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3u7gj2r9hy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3u7gj2r9hy] { color: #ef4444; }
.btn-delete:hover[b-3u7gj2r9hy] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-3u7gj2r9hy] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-3u7gj2r9hy] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-3u7gj2r9hy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3u7gj2r9hy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3u7gj2r9hy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3u7gj2r9hy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3u7gj2r9hy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3u7gj2r9hy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-3u7gj2r9hy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-3u7gj2r9hy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3u7gj2r9hy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-3u7gj2r9hy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-3u7gj2r9hy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3u7gj2r9hy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3u7gj2r9hy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3u7gj2r9hy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3u7gj2r9hy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3u7gj2r9hy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3u7gj2r9hy] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-3u7gj2r9hy] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-3u7gj2r9hy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-3u7gj2r9hy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3u7gj2r9hy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3u7gj2r9hy] { background: #f1f5f9; color: #64748b; }
.badge-info[b-3u7gj2r9hy] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-3u7gj2r9hy] { background: #fffbeb; color: #92400e; }
.badge-danger[b-3u7gj2r9hy] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-3u7gj2r9hy] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-3u7gj2r9hy] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-3u7gj2r9hy] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-3u7gj2r9hy] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-3u7gj2r9hy] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-3u7gj2r9hy] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-3u7gj2r9hy] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-3u7gj2r9hy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3u7gj2r9hy] { text-align: center; }
.text-muted[b-3u7gj2r9hy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3u7gj2r9hy], .crud-empty-state[b-3u7gj2r9hy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3u7gj2r9hy] { font-size: 2rem; }
.crud-spinner[b-3u7gj2r9hy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3u7gj2r9hy 0.6s linear infinite; }
.crud-spinner-sm[b-3u7gj2r9hy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3u7gj2r9hy 0.6s linear infinite; }
@keyframes spin-b-3u7gj2r9hy { to { transform: rotate(360deg); } }
.spin[b-3u7gj2r9hy] { animation: spin-b-3u7gj2r9hy 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-3u7gj2r9hy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3u7gj2r9hy 0.15s ease-out; }
.modal-container[b-3u7gj2r9hy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3u7gj2r9hy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3u7gj2r9hy 0.2s ease-out; }
.modal-lg[b-3u7gj2r9hy] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-3u7gj2r9hy] { max-width: 420px; }
@keyframes fadeIn-b-3u7gj2r9hy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3u7gj2r9hy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3u7gj2r9hy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3u7gj2r9hy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-3u7gj2r9hy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3u7gj2r9hy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3u7gj2r9hy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3u7gj2r9hy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3u7gj2r9hy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-3u7gj2r9hy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3u7gj2r9hy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3u7gj2r9hy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3u7gj2r9hy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3u7gj2r9hy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3u7gj2r9hy] { flex: 2; }
.form-group label[b-3u7gj2r9hy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3u7gj2r9hy], .form-group select[b-3u7gj2r9hy], .form-textarea[b-3u7gj2r9hy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3u7gj2r9hy], .form-group select:focus[b-3u7gj2r9hy], .form-textarea:focus[b-3u7gj2r9hy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3u7gj2r9hy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3u7gj2r9hy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3u7gj2r9hy] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3u7gj2r9hy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-3u7gj2r9hy] { margin-top: 0; }
.form-section-title i[b-3u7gj2r9hy] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-3u7gj2r9hy] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-3u7gj2r9hy] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-3u7gj2r9hy] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-3u7gj2r9hy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-3u7gj2r9hy] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-3u7gj2r9hy] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-3u7gj2r9hy] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-3u7gj2r9hy] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3u7gj2r9hy] { padding: 0.75rem; }
    .crud-header[b-3u7gj2r9hy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3u7gj2r9hy] { font-size: 1.1rem; }
    .btn-text[b-3u7gj2r9hy] { display: none; }
    .form-row[b-3u7gj2r9hy] { flex-direction: column; }
    .form-row-3[b-3u7gj2r9hy] { grid-template-columns: 1fr; }
    .form-row-4[b-3u7gj2r9hy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3u7gj2r9hy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3u7gj2r9hy] { max-width: 98vw; width: 98vw; }
    .modal-body[b-3u7gj2r9hy] { padding: 0.75rem; }
    .modal-tabs[b-3u7gj2r9hy] { overflow-x: auto; }
    .modal-tab[b-3u7gj2r9hy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-3u7gj2r9hy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3u7gj2r9hy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3u7gj2r9hy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3u7gj2r9hy] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-3u7gj2r9hy] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-3u7gj2r9hy] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-3u7gj2r9hy] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-3u7gj2r9hy] { border-bottom: none; }
.help-section p[b-3u7gj2r9hy] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-3u7gj2r9hy], .help-section ol[b-3u7gj2r9hy] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-3u7gj2r9hy] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-3u7gj2r9hy] { color: var(--rg-accent,#2563eb); }
.help-tip[b-3u7gj2r9hy] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-3u7gj2r9hy] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-3u7gj2r9hy] { background: rgba(37,99,235,0.12); }
.help-table[b-3u7gj2r9hy] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-3u7gj2r9hy] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-3u7gj2r9hy] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-3u7gj2r9hy] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-3u7gj2r9hy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-3u7gj2r9hy] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-3u7gj2r9hy] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-3u7gj2r9hy] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-3u7gj2r9hy] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-3u7gj2r9hy] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-3u7gj2r9hy] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-3u7gj2r9hy] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-3u7gj2r9hy] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-3u7gj2r9hy] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-3u7gj2r9hy] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-3u7gj2r9hy] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-3u7gj2r9hy] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-3u7gj2r9hy] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-3u7gj2r9hy] { font-size: 1.6rem; }
.pos-op-btn > div[b-3u7gj2r9hy] { display: flex; flex-direction: column; }
.pos-op-title[b-3u7gj2r9hy] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-3u7gj2r9hy] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-3u7gj2r9hy] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-3u7gj2r9hy] { color: var(--rg-success); }
.pos-op-ret[b-3u7gj2r9hy] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-3u7gj2r9hy] { color: var(--rg-danger); }

.pos-cuenta-search[b-3u7gj2r9hy] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-3u7gj2r9hy] { flex: 1; }

.pos-cuenta-card[b-3u7gj2r9hy] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-3u7gj2r9hy] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-3u7gj2r9hy] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-3u7gj2r9hy] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-3u7gj2r9hy] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-3u7gj2r9hy], .pos-res-saldos > div[b-3u7gj2r9hy] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-3u7gj2r9hy] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-3u7gj2r9hy] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-3u7gj2r9hy] { color: var(--rg-success); }
.pos-cuenta-aviso[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-3u7gj2r9hy] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-3u7gj2r9hy] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-3u7gj2r9hy] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-3u7gj2r9hy] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-3u7gj2r9hy]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-3u7gj2r9hy] { z-index: 2001 !important; }

.badge-warn[b-3u7gj2r9hy] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-3u7gj2r9hy] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-3u7gj2r9hy] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-3u7gj2r9hy] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-3u7gj2r9hy] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-3u7gj2r9hy] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-3u7gj2r9hy] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-3u7gj2r9hy] { margin-bottom: 0; }
.dv-periodo input[b-3u7gj2r9hy], .dv-periodo select[b-3u7gj2r9hy] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-3u7gj2r9hy] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-3u7gj2r9hy] { text-align: right; }
.badge-warn[b-3u7gj2r9hy] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-3u7gj2r9hy] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-3u7gj2r9hy] { flex-direction: column; align-items: stretch; } .dv-periodo[b-3u7gj2r9hy], .dv-acciones[b-3u7gj2r9hy] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-3u7gj2r9hy] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-3u7gj2r9hy] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-3u7gj2r9hy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-3u7gj2r9hy] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-3u7gj2r9hy] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-3u7gj2r9hy] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-3u7gj2r9hy] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-3u7gj2r9hy] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-3u7gj2r9hy] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-3u7gj2r9hy] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-3u7gj2r9hy] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-3u7gj2r9hy] { border-bottom: none; }
.config-toggle-label[b-3u7gj2r9hy] { flex: 1; }
.config-toggle-name[b-3u7gj2r9hy] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-3u7gj2r9hy] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-3u7gj2r9hy] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-3u7gj2r9hy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3u7gj2r9hy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-3u7gj2r9hy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3u7gj2r9hy], .form-group select[b-3u7gj2r9hy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PreferenciaCliente.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-pz6ntvvt5p] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pz6ntvvt5p 0.3s ease-out; }
@keyframes slideUp-b-pz6ntvvt5p { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pz6ntvvt5p] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pz6ntvvt5p] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pz6ntvvt5p] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pz6ntvvt5p] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pz6ntvvt5p] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pz6ntvvt5p] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pz6ntvvt5p] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pz6ntvvt5p] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pz6ntvvt5p] { filter: brightness(1.1); }
.btn-outline[b-pz6ntvvt5p] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pz6ntvvt5p] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pz6ntvvt5p] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pz6ntvvt5p] { filter: brightness(1.1); }
.btn-icon[b-pz6ntvvt5p] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pz6ntvvt5p] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pz6ntvvt5p] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pz6ntvvt5p] { color: #ef4444; }
.btn-delete:hover[b-pz6ntvvt5p] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-pz6ntvvt5p] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-pz6ntvvt5p] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-pz6ntvvt5p] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pz6ntvvt5p] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pz6ntvvt5p] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pz6ntvvt5p] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pz6ntvvt5p] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pz6ntvvt5p] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-pz6ntvvt5p] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-pz6ntvvt5p] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pz6ntvvt5p] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-pz6ntvvt5p] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-pz6ntvvt5p] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pz6ntvvt5p] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pz6ntvvt5p] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pz6ntvvt5p] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pz6ntvvt5p] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pz6ntvvt5p] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pz6ntvvt5p] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-pz6ntvvt5p] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-pz6ntvvt5p] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-pz6ntvvt5p] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pz6ntvvt5p] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pz6ntvvt5p] { background: #f1f5f9; color: #64748b; }
.badge-info[b-pz6ntvvt5p] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-pz6ntvvt5p] { background: #fffbeb; color: #92400e; }
.badge-danger[b-pz6ntvvt5p] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-pz6ntvvt5p] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-pz6ntvvt5p] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-pz6ntvvt5p] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-pz6ntvvt5p] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-pz6ntvvt5p] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-pz6ntvvt5p] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-pz6ntvvt5p] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-pz6ntvvt5p] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pz6ntvvt5p] { text-align: center; }
.text-muted[b-pz6ntvvt5p] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pz6ntvvt5p], .crud-empty-state[b-pz6ntvvt5p] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pz6ntvvt5p] { font-size: 2rem; }
.crud-spinner[b-pz6ntvvt5p] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pz6ntvvt5p 0.6s linear infinite; }
.crud-spinner-sm[b-pz6ntvvt5p] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pz6ntvvt5p 0.6s linear infinite; }
@keyframes spin-b-pz6ntvvt5p { to { transform: rotate(360deg); } }
.spin[b-pz6ntvvt5p] { animation: spin-b-pz6ntvvt5p 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-pz6ntvvt5p] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pz6ntvvt5p 0.15s ease-out; }
.modal-container[b-pz6ntvvt5p] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pz6ntvvt5p] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pz6ntvvt5p 0.2s ease-out; }
.modal-lg[b-pz6ntvvt5p] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-pz6ntvvt5p] { max-width: 420px; }
@keyframes fadeIn-b-pz6ntvvt5p { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pz6ntvvt5p { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pz6ntvvt5p] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pz6ntvvt5p] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-pz6ntvvt5p] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pz6ntvvt5p] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pz6ntvvt5p] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pz6ntvvt5p] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pz6ntvvt5p] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-pz6ntvvt5p] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pz6ntvvt5p] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pz6ntvvt5p] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pz6ntvvt5p] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pz6ntvvt5p] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pz6ntvvt5p] { flex: 2; }
.form-group label[b-pz6ntvvt5p] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pz6ntvvt5p], .form-group select[b-pz6ntvvt5p], .form-textarea[b-pz6ntvvt5p] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pz6ntvvt5p], .form-group select:focus[b-pz6ntvvt5p], .form-textarea:focus[b-pz6ntvvt5p] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pz6ntvvt5p] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pz6ntvvt5p] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pz6ntvvt5p] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pz6ntvvt5p] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-pz6ntvvt5p] { margin-top: 0; }
.form-section-title i[b-pz6ntvvt5p] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-pz6ntvvt5p] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-pz6ntvvt5p] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-pz6ntvvt5p] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-pz6ntvvt5p] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-pz6ntvvt5p] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-pz6ntvvt5p] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-pz6ntvvt5p] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-pz6ntvvt5p] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pz6ntvvt5p] { padding: 0.75rem; }
    .crud-header[b-pz6ntvvt5p] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pz6ntvvt5p] { font-size: 1.1rem; }
    .btn-text[b-pz6ntvvt5p] { display: none; }
    .form-row[b-pz6ntvvt5p] { flex-direction: column; }
    .form-row-3[b-pz6ntvvt5p] { grid-template-columns: 1fr; }
    .form-row-4[b-pz6ntvvt5p] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pz6ntvvt5p] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pz6ntvvt5p] { max-width: 98vw; width: 98vw; }
    .modal-body[b-pz6ntvvt5p] { padding: 0.75rem; }
    .modal-tabs[b-pz6ntvvt5p] { overflow-x: auto; }
    .modal-tab[b-pz6ntvvt5p] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-pz6ntvvt5p] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pz6ntvvt5p] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pz6ntvvt5p] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pz6ntvvt5p] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-pz6ntvvt5p] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-pz6ntvvt5p] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-pz6ntvvt5p] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-pz6ntvvt5p] { border-bottom: none; }
.help-section p[b-pz6ntvvt5p] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-pz6ntvvt5p], .help-section ol[b-pz6ntvvt5p] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-pz6ntvvt5p] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-pz6ntvvt5p] { color: var(--rg-accent,#2563eb); }
.help-tip[b-pz6ntvvt5p] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-pz6ntvvt5p] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-pz6ntvvt5p] { background: rgba(37,99,235,0.12); }
.help-table[b-pz6ntvvt5p] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-pz6ntvvt5p] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-pz6ntvvt5p] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-pz6ntvvt5p] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-pz6ntvvt5p] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-pz6ntvvt5p] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-pz6ntvvt5p] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-pz6ntvvt5p] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-pz6ntvvt5p] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-pz6ntvvt5p] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-pz6ntvvt5p] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-pz6ntvvt5p] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-pz6ntvvt5p] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-pz6ntvvt5p] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-pz6ntvvt5p] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-pz6ntvvt5p] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-pz6ntvvt5p] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-pz6ntvvt5p] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-pz6ntvvt5p] { font-size: 1.6rem; }
.pos-op-btn > div[b-pz6ntvvt5p] { display: flex; flex-direction: column; }
.pos-op-title[b-pz6ntvvt5p] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-pz6ntvvt5p] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-pz6ntvvt5p] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-pz6ntvvt5p] { color: var(--rg-success); }
.pos-op-ret[b-pz6ntvvt5p] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-pz6ntvvt5p] { color: var(--rg-danger); }

.pos-cuenta-search[b-pz6ntvvt5p] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-pz6ntvvt5p] { flex: 1; }

.pos-cuenta-card[b-pz6ntvvt5p] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-pz6ntvvt5p] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-pz6ntvvt5p] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-pz6ntvvt5p] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-pz6ntvvt5p] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-pz6ntvvt5p], .pos-res-saldos > div[b-pz6ntvvt5p] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-pz6ntvvt5p] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-pz6ntvvt5p] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-pz6ntvvt5p] { color: var(--rg-success); }
.pos-cuenta-aviso[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-pz6ntvvt5p] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-pz6ntvvt5p] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-pz6ntvvt5p] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-pz6ntvvt5p] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-pz6ntvvt5p]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-pz6ntvvt5p] { z-index: 2001 !important; }

.badge-warn[b-pz6ntvvt5p] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-pz6ntvvt5p] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-pz6ntvvt5p] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-pz6ntvvt5p] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-pz6ntvvt5p] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-pz6ntvvt5p] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-pz6ntvvt5p] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-pz6ntvvt5p] { margin-bottom: 0; }
.dv-periodo input[b-pz6ntvvt5p], .dv-periodo select[b-pz6ntvvt5p] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-pz6ntvvt5p] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-pz6ntvvt5p] { text-align: right; }
.badge-warn[b-pz6ntvvt5p] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-pz6ntvvt5p] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-pz6ntvvt5p] { flex-direction: column; align-items: stretch; } .dv-periodo[b-pz6ntvvt5p], .dv-acciones[b-pz6ntvvt5p] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-pz6ntvvt5p] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-pz6ntvvt5p] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-pz6ntvvt5p] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-pz6ntvvt5p] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-pz6ntvvt5p] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-pz6ntvvt5p] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-pz6ntvvt5p] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-pz6ntvvt5p] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-pz6ntvvt5p] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-pz6ntvvt5p] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-pz6ntvvt5p] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-pz6ntvvt5p] { border-bottom: none; }
.config-toggle-label[b-pz6ntvvt5p] { flex: 1; }
.config-toggle-name[b-pz6ntvvt5p] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-pz6ntvvt5p] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-pz6ntvvt5p] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-pz6ntvvt5p] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pz6ntvvt5p] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-pz6ntvvt5p] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pz6ntvvt5p], .form-group select[b-pz6ntvvt5p] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_ProcesoDevengo.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-mupt92u95u] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-mupt92u95u 0.3s ease-out; }
@keyframes slideUp-b-mupt92u95u { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-mupt92u95u] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-mupt92u95u] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-mupt92u95u] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-mupt92u95u] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-mupt92u95u] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-mupt92u95u] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-mupt92u95u] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-mupt92u95u] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-mupt92u95u] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-mupt92u95u] { filter: brightness(1.1); }
.btn-outline[b-mupt92u95u] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-mupt92u95u] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-mupt92u95u] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-mupt92u95u] { filter: brightness(1.1); }
.btn-icon[b-mupt92u95u] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-mupt92u95u] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-mupt92u95u] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-mupt92u95u] { color: #ef4444; }
.btn-delete:hover[b-mupt92u95u] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-mupt92u95u] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-mupt92u95u] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-mupt92u95u] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-mupt92u95u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-mupt92u95u] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-mupt92u95u] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-mupt92u95u] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-mupt92u95u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-mupt92u95u] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-mupt92u95u] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-mupt92u95u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-mupt92u95u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-mupt92u95u] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-mupt92u95u] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-mupt92u95u] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-mupt92u95u] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-mupt92u95u] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-mupt92u95u] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-mupt92u95u] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-mupt92u95u] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-mupt92u95u] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-mupt92u95u] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-mupt92u95u] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-mupt92u95u] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-mupt92u95u] { background: #ecfdf5; color: #065f46; }
.badge-no[b-mupt92u95u] { background: #f1f5f9; color: #64748b; }
.badge-info[b-mupt92u95u] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-mupt92u95u] { background: #fffbeb; color: #92400e; }
.badge-danger[b-mupt92u95u] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-mupt92u95u] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-mupt92u95u] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-mupt92u95u] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-mupt92u95u] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-mupt92u95u] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-mupt92u95u] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-mupt92u95u] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-mupt92u95u] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-mupt92u95u] { text-align: center; }
.text-muted[b-mupt92u95u] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-mupt92u95u], .crud-empty-state[b-mupt92u95u] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-mupt92u95u] { font-size: 2rem; }
.crud-spinner[b-mupt92u95u] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-mupt92u95u 0.6s linear infinite; }
.crud-spinner-sm[b-mupt92u95u] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-mupt92u95u 0.6s linear infinite; }
@keyframes spin-b-mupt92u95u { to { transform: rotate(360deg); } }
.spin[b-mupt92u95u] { animation: spin-b-mupt92u95u 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-mupt92u95u] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-mupt92u95u 0.15s ease-out; }
.modal-container[b-mupt92u95u] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-mupt92u95u] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-mupt92u95u 0.2s ease-out; }
.modal-lg[b-mupt92u95u] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-mupt92u95u] { max-width: 420px; }
@keyframes fadeIn-b-mupt92u95u { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-mupt92u95u { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-mupt92u95u] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-mupt92u95u] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-mupt92u95u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-mupt92u95u] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-mupt92u95u] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-mupt92u95u] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-mupt92u95u] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-mupt92u95u] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-mupt92u95u] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-mupt92u95u] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-mupt92u95u] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-mupt92u95u] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-mupt92u95u] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-mupt92u95u] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-mupt92u95u] { flex: 2; }
.form-group label[b-mupt92u95u] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-mupt92u95u], .form-group select[b-mupt92u95u], .form-textarea[b-mupt92u95u] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-mupt92u95u], .form-group select:focus[b-mupt92u95u], .form-textarea:focus[b-mupt92u95u] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-mupt92u95u] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-mupt92u95u] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-mupt92u95u] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-mupt92u95u] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-mupt92u95u] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-mupt92u95u] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-mupt92u95u] { margin-top: 0; }
.form-section-title i[b-mupt92u95u] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-mupt92u95u] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-mupt92u95u] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-mupt92u95u] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-mupt92u95u] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-mupt92u95u] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-mupt92u95u] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-mupt92u95u] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-mupt92u95u] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-mupt92u95u] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-mupt92u95u] { padding: 0.75rem; }
    .crud-header[b-mupt92u95u] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-mupt92u95u] { font-size: 1.1rem; }
    .btn-text[b-mupt92u95u] { display: none; }
    .form-row[b-mupt92u95u] { flex-direction: column; }
    .form-row-3[b-mupt92u95u] { grid-template-columns: 1fr; }
    .form-row-4[b-mupt92u95u] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-mupt92u95u] { width: 98%; max-height: 95vh; }
    .modal-lg[b-mupt92u95u] { max-width: 98vw; width: 98vw; }
    .modal-body[b-mupt92u95u] { padding: 0.75rem; }
    .modal-tabs[b-mupt92u95u] { overflow-x: auto; }
    .modal-tab[b-mupt92u95u] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-mupt92u95u] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-mupt92u95u] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-mupt92u95u] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-mupt92u95u] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-mupt92u95u] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-mupt92u95u] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-mupt92u95u] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-mupt92u95u] { border-bottom: none; }
.help-section p[b-mupt92u95u] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-mupt92u95u], .help-section ol[b-mupt92u95u] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-mupt92u95u] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-mupt92u95u] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-mupt92u95u] { color: var(--rg-accent,#2563eb); }
.help-tip[b-mupt92u95u] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-mupt92u95u] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-mupt92u95u] { background: rgba(37,99,235,0.12); }
.help-table[b-mupt92u95u] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-mupt92u95u] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-mupt92u95u] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-mupt92u95u] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-mupt92u95u] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-mupt92u95u] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-mupt92u95u] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-mupt92u95u] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-mupt92u95u] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-mupt92u95u] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-mupt92u95u] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-mupt92u95u] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-mupt92u95u] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-mupt92u95u] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-mupt92u95u] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-mupt92u95u] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-mupt92u95u] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-mupt92u95u] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-mupt92u95u] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-mupt92u95u] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-mupt92u95u] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-mupt92u95u] { font-size: 1.6rem; }
.pos-op-btn > div[b-mupt92u95u] { display: flex; flex-direction: column; }
.pos-op-title[b-mupt92u95u] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-mupt92u95u] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-mupt92u95u] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-mupt92u95u] { color: var(--rg-success); }
.pos-op-ret[b-mupt92u95u] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-mupt92u95u] { color: var(--rg-danger); }

.pos-cuenta-search[b-mupt92u95u] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-mupt92u95u] { flex: 1; }

.pos-cuenta-card[b-mupt92u95u] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-mupt92u95u] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-mupt92u95u] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-mupt92u95u] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-mupt92u95u] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-mupt92u95u] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-mupt92u95u] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-mupt92u95u], .pos-res-saldos > div[b-mupt92u95u] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-mupt92u95u] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-mupt92u95u] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-mupt92u95u] { color: var(--rg-success); }
.pos-cuenta-aviso[b-mupt92u95u] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-mupt92u95u] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-mupt92u95u] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-mupt92u95u] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-mupt92u95u] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-mupt92u95u]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-mupt92u95u] { z-index: 2001 !important; }

.badge-warn[b-mupt92u95u] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-mupt92u95u] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-mupt92u95u] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-mupt92u95u] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-mupt92u95u] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-mupt92u95u] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-mupt92u95u] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-mupt92u95u] { margin-bottom: 0; }
.dv-periodo input[b-mupt92u95u], .dv-periodo select[b-mupt92u95u] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-mupt92u95u] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-mupt92u95u] { text-align: right; }
.badge-warn[b-mupt92u95u] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-mupt92u95u] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-mupt92u95u] { flex-direction: column; align-items: stretch; } .dv-periodo[b-mupt92u95u], .dv-acciones[b-mupt92u95u] { width: 100%; } }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Productos.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-9wph7vt949] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9wph7vt949 0.3s ease-out; }
@keyframes slideUp-b-9wph7vt949 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9wph7vt949] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9wph7vt949] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9wph7vt949] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9wph7vt949] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9wph7vt949] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9wph7vt949] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9wph7vt949] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9wph7vt949] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9wph7vt949] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9wph7vt949] { filter: brightness(1.1); }
.btn-outline[b-9wph7vt949] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9wph7vt949] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9wph7vt949] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9wph7vt949] { filter: brightness(1.1); }
.btn-icon[b-9wph7vt949] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9wph7vt949] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9wph7vt949] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9wph7vt949] { color: #ef4444; }
.btn-delete:hover[b-9wph7vt949] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-9wph7vt949] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-9wph7vt949] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-9wph7vt949] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9wph7vt949] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9wph7vt949] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9wph7vt949] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9wph7vt949] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9wph7vt949] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9wph7vt949] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9wph7vt949] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-9wph7vt949] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-9wph7vt949] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9wph7vt949] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-9wph7vt949] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-9wph7vt949] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9wph7vt949] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9wph7vt949] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9wph7vt949] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9wph7vt949] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9wph7vt949] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9wph7vt949] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-9wph7vt949] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-9wph7vt949] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-9wph7vt949] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9wph7vt949] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9wph7vt949] { background: #f1f5f9; color: #64748b; }
.badge-info[b-9wph7vt949] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-9wph7vt949] { background: #fffbeb; color: #92400e; }
.badge-danger[b-9wph7vt949] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-9wph7vt949] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-9wph7vt949] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-9wph7vt949] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-9wph7vt949] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-9wph7vt949] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-9wph7vt949] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-9wph7vt949] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-9wph7vt949] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9wph7vt949] { text-align: center; }
.text-muted[b-9wph7vt949] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9wph7vt949], .crud-empty-state[b-9wph7vt949] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9wph7vt949] { font-size: 2rem; }
.crud-spinner[b-9wph7vt949] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9wph7vt949 0.6s linear infinite; }
.crud-spinner-sm[b-9wph7vt949] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9wph7vt949 0.6s linear infinite; }
@keyframes spin-b-9wph7vt949 { to { transform: rotate(360deg); } }
.spin[b-9wph7vt949] { animation: spin-b-9wph7vt949 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-9wph7vt949] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9wph7vt949 0.15s ease-out; }
.modal-container[b-9wph7vt949] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9wph7vt949] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9wph7vt949 0.2s ease-out; }
.modal-lg[b-9wph7vt949] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-9wph7vt949] { max-width: 420px; }
@keyframes fadeIn-b-9wph7vt949 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9wph7vt949 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9wph7vt949] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9wph7vt949] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-9wph7vt949] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9wph7vt949] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9wph7vt949] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9wph7vt949] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9wph7vt949] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-9wph7vt949] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9wph7vt949] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9wph7vt949] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9wph7vt949] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-9wph7vt949] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9wph7vt949] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9wph7vt949] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9wph7vt949] { flex: 2; }
.form-group label[b-9wph7vt949] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9wph7vt949], .form-group select[b-9wph7vt949], .form-textarea[b-9wph7vt949] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9wph7vt949], .form-group select:focus[b-9wph7vt949], .form-textarea:focus[b-9wph7vt949] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9wph7vt949] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9wph7vt949] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9wph7vt949] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-9wph7vt949] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9wph7vt949] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-9wph7vt949] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-9wph7vt949] { margin-top: 0; }
.form-section-title i[b-9wph7vt949] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-9wph7vt949] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-9wph7vt949] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-9wph7vt949] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-9wph7vt949] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-9wph7vt949] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-9wph7vt949] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-9wph7vt949] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-9wph7vt949] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-9wph7vt949] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9wph7vt949] { padding: 0.75rem; }
    .crud-header[b-9wph7vt949] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9wph7vt949] { font-size: 1.1rem; }
    .btn-text[b-9wph7vt949] { display: none; }
    .form-row[b-9wph7vt949] { flex-direction: column; }
    .form-row-3[b-9wph7vt949] { grid-template-columns: 1fr; }
    .form-row-4[b-9wph7vt949] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9wph7vt949] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9wph7vt949] { max-width: 98vw; width: 98vw; }
    .modal-body[b-9wph7vt949] { padding: 0.75rem; }
    .modal-tabs[b-9wph7vt949] { overflow-x: auto; }
    .modal-tab[b-9wph7vt949] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-9wph7vt949] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9wph7vt949] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9wph7vt949] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9wph7vt949] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-9wph7vt949] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-9wph7vt949] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-9wph7vt949] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-9wph7vt949] { border-bottom: none; }
.help-section p[b-9wph7vt949] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-9wph7vt949], .help-section ol[b-9wph7vt949] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-9wph7vt949] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-9wph7vt949] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-9wph7vt949] { color: var(--rg-accent,#2563eb); }
.help-tip[b-9wph7vt949] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-9wph7vt949] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-9wph7vt949] { background: rgba(37,99,235,0.12); }
.help-table[b-9wph7vt949] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-9wph7vt949] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-9wph7vt949] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-9wph7vt949] { background: rgba(255,255,255,0.04); }

/* Botones toggle activar/inactivar (reemplazan al de eliminar) */
.btn-icon.btn-toggle-on[b-9wph7vt949] {
    color: var(--rg-text-muted);
    border-color: var(--rg-border);
}
.btn-icon.btn-toggle-on:hover[b-9wph7vt949] {
    background: rgba(22,163,74,0.1);
    color: var(--rg-success, #16a34a);
    border-color: rgba(22,163,74,0.3);
}
.btn-icon.btn-toggle-off[b-9wph7vt949] {
    color: var(--rg-success, #16a34a);
}
.btn-icon.btn-toggle-off:hover[b-9wph7vt949] {
    background: rgba(217,119,6,0.10);
    color: var(--rg-warning, #d97706);
    border-color: rgba(217,119,6,0.3);
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PsvBandeja.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-wrsga7gvry] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wrsga7gvry 0.3s ease-out; }
@keyframes slideUp-b-wrsga7gvry { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wrsga7gvry] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wrsga7gvry] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wrsga7gvry] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wrsga7gvry] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wrsga7gvry] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wrsga7gvry] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wrsga7gvry] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wrsga7gvry] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wrsga7gvry] { filter: brightness(1.1); }
.btn-outline[b-wrsga7gvry] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wrsga7gvry] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wrsga7gvry] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wrsga7gvry] { filter: brightness(1.1); }
.btn-icon[b-wrsga7gvry] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wrsga7gvry] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wrsga7gvry] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wrsga7gvry] { color: #ef4444; }
.btn-delete:hover[b-wrsga7gvry] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-wrsga7gvry] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-wrsga7gvry] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-wrsga7gvry] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wrsga7gvry] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wrsga7gvry] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wrsga7gvry] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wrsga7gvry] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wrsga7gvry] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-wrsga7gvry] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-wrsga7gvry] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wrsga7gvry] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-wrsga7gvry] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-wrsga7gvry] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wrsga7gvry] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wrsga7gvry] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wrsga7gvry] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wrsga7gvry] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wrsga7gvry] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wrsga7gvry] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-wrsga7gvry] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-wrsga7gvry] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-wrsga7gvry] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wrsga7gvry] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wrsga7gvry] { background: #f1f5f9; color: #64748b; }
.badge-info[b-wrsga7gvry] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-wrsga7gvry] { background: #fffbeb; color: #92400e; }
.badge-danger[b-wrsga7gvry] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-wrsga7gvry] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-wrsga7gvry] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-wrsga7gvry] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-wrsga7gvry] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-wrsga7gvry] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-wrsga7gvry] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-wrsga7gvry] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-wrsga7gvry] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wrsga7gvry] { text-align: center; }
.text-muted[b-wrsga7gvry] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wrsga7gvry], .crud-empty-state[b-wrsga7gvry] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wrsga7gvry] { font-size: 2rem; }
.crud-spinner[b-wrsga7gvry] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wrsga7gvry 0.6s linear infinite; }
.crud-spinner-sm[b-wrsga7gvry] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wrsga7gvry 0.6s linear infinite; }
@keyframes spin-b-wrsga7gvry { to { transform: rotate(360deg); } }
.spin[b-wrsga7gvry] { animation: spin-b-wrsga7gvry 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-wrsga7gvry] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wrsga7gvry 0.15s ease-out; }
.modal-container[b-wrsga7gvry] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wrsga7gvry] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wrsga7gvry 0.2s ease-out; }
.modal-lg[b-wrsga7gvry] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-wrsga7gvry] { max-width: 420px; }
@keyframes fadeIn-b-wrsga7gvry { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wrsga7gvry { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wrsga7gvry] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wrsga7gvry] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-wrsga7gvry] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wrsga7gvry] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wrsga7gvry] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wrsga7gvry] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wrsga7gvry] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-wrsga7gvry] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wrsga7gvry] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wrsga7gvry] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wrsga7gvry] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-wrsga7gvry] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wrsga7gvry] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wrsga7gvry] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wrsga7gvry] { flex: 2; }
.form-group label[b-wrsga7gvry] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wrsga7gvry], .form-group select[b-wrsga7gvry], .form-textarea[b-wrsga7gvry] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wrsga7gvry], .form-group select:focus[b-wrsga7gvry], .form-textarea:focus[b-wrsga7gvry] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wrsga7gvry] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wrsga7gvry] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wrsga7gvry] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wrsga7gvry] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-wrsga7gvry] { margin-top: 0; }
.form-section-title i[b-wrsga7gvry] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-wrsga7gvry] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-wrsga7gvry] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-wrsga7gvry] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-wrsga7gvry] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-wrsga7gvry] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-wrsga7gvry] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-wrsga7gvry] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-wrsga7gvry] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wrsga7gvry] { padding: 0.75rem; }
    .crud-header[b-wrsga7gvry] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wrsga7gvry] { font-size: 1.1rem; }
    .btn-text[b-wrsga7gvry] { display: none; }
    .form-row[b-wrsga7gvry] { flex-direction: column; }
    .form-row-3[b-wrsga7gvry] { grid-template-columns: 1fr; }
    .form-row-4[b-wrsga7gvry] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wrsga7gvry] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wrsga7gvry] { max-width: 98vw; width: 98vw; }
    .modal-body[b-wrsga7gvry] { padding: 0.75rem; }
    .modal-tabs[b-wrsga7gvry] { overflow-x: auto; }
    .modal-tab[b-wrsga7gvry] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-wrsga7gvry] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wrsga7gvry] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wrsga7gvry] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wrsga7gvry] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-wrsga7gvry] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-wrsga7gvry] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-wrsga7gvry] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-wrsga7gvry] { border-bottom: none; }
.help-section p[b-wrsga7gvry] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-wrsga7gvry], .help-section ol[b-wrsga7gvry] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-wrsga7gvry] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-wrsga7gvry] { color: var(--rg-accent,#2563eb); }
.help-tip[b-wrsga7gvry] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-wrsga7gvry] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-wrsga7gvry] { background: rgba(37,99,235,0.12); }
.help-table[b-wrsga7gvry] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-wrsga7gvry] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-wrsga7gvry] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-wrsga7gvry] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-wrsga7gvry] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-wrsga7gvry] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-wrsga7gvry] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-wrsga7gvry] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-wrsga7gvry] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-wrsga7gvry] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-wrsga7gvry] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-wrsga7gvry] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-wrsga7gvry] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-wrsga7gvry] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-wrsga7gvry] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-wrsga7gvry] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-wrsga7gvry] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-wrsga7gvry] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

.crud-filter-row[b-wrsga7gvry] { display: flex; gap: 0.5rem; align-items: flex-end; padding: 0.5rem 0; flex-wrap: wrap; }
.row-rev[b-wrsga7gvry] { opacity: 0.55; text-decoration: line-through; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PsvCaptura.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-k5z0k3er57] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-k5z0k3er57 0.3s ease-out; }
@keyframes slideUp-b-k5z0k3er57 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-k5z0k3er57] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-k5z0k3er57] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-k5z0k3er57] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-k5z0k3er57] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-k5z0k3er57] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-k5z0k3er57] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-k5z0k3er57] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-k5z0k3er57] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-k5z0k3er57] { filter: brightness(1.1); }
.btn-outline[b-k5z0k3er57] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-k5z0k3er57] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-k5z0k3er57] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-k5z0k3er57] { filter: brightness(1.1); }
.btn-icon[b-k5z0k3er57] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-k5z0k3er57] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-k5z0k3er57] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-k5z0k3er57] { color: #ef4444; }
.btn-delete:hover[b-k5z0k3er57] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-k5z0k3er57] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-k5z0k3er57] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-k5z0k3er57] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-k5z0k3er57] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-k5z0k3er57] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-k5z0k3er57] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-k5z0k3er57] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-k5z0k3er57] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-k5z0k3er57] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-k5z0k3er57] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-k5z0k3er57] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-k5z0k3er57] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-k5z0k3er57] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-k5z0k3er57] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-k5z0k3er57] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-k5z0k3er57] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-k5z0k3er57] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-k5z0k3er57] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-k5z0k3er57] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-k5z0k3er57] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-k5z0k3er57] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-k5z0k3er57] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-k5z0k3er57] { background: #ecfdf5; color: #065f46; }
.badge-no[b-k5z0k3er57] { background: #f1f5f9; color: #64748b; }
.badge-info[b-k5z0k3er57] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-k5z0k3er57] { background: #fffbeb; color: #92400e; }
.badge-danger[b-k5z0k3er57] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-k5z0k3er57] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-k5z0k3er57] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-k5z0k3er57] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-k5z0k3er57] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-k5z0k3er57] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-k5z0k3er57] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-k5z0k3er57] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-k5z0k3er57] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-k5z0k3er57] { text-align: center; }
.text-muted[b-k5z0k3er57] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-k5z0k3er57], .crud-empty-state[b-k5z0k3er57] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-k5z0k3er57] { font-size: 2rem; }
.crud-spinner[b-k5z0k3er57] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-k5z0k3er57 0.6s linear infinite; }
.crud-spinner-sm[b-k5z0k3er57] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-k5z0k3er57 0.6s linear infinite; }
@keyframes spin-b-k5z0k3er57 { to { transform: rotate(360deg); } }
.spin[b-k5z0k3er57] { animation: spin-b-k5z0k3er57 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-k5z0k3er57] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-k5z0k3er57 0.15s ease-out; }
.modal-container[b-k5z0k3er57] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-k5z0k3er57] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-k5z0k3er57 0.2s ease-out; }
.modal-lg[b-k5z0k3er57] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-k5z0k3er57] { max-width: 420px; }
@keyframes fadeIn-b-k5z0k3er57 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-k5z0k3er57 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-k5z0k3er57] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-k5z0k3er57] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-k5z0k3er57] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-k5z0k3er57] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-k5z0k3er57] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-k5z0k3er57] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-k5z0k3er57] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-k5z0k3er57] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-k5z0k3er57] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-k5z0k3er57] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-k5z0k3er57] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-k5z0k3er57] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-k5z0k3er57] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-k5z0k3er57] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-k5z0k3er57] { flex: 2; }
.form-group label[b-k5z0k3er57] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-k5z0k3er57], .form-group select[b-k5z0k3er57], .form-textarea[b-k5z0k3er57] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-k5z0k3er57], .form-group select:focus[b-k5z0k3er57], .form-textarea:focus[b-k5z0k3er57] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-k5z0k3er57] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-k5z0k3er57] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-k5z0k3er57] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-k5z0k3er57] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-k5z0k3er57] { margin-top: 0; }
.form-section-title i[b-k5z0k3er57] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-k5z0k3er57] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-k5z0k3er57] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-k5z0k3er57] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-k5z0k3er57] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-k5z0k3er57] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-k5z0k3er57] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-k5z0k3er57] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-k5z0k3er57] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-k5z0k3er57] { padding: 0.75rem; }
    .crud-header[b-k5z0k3er57] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-k5z0k3er57] { font-size: 1.1rem; }
    .btn-text[b-k5z0k3er57] { display: none; }
    .form-row[b-k5z0k3er57] { flex-direction: column; }
    .form-row-3[b-k5z0k3er57] { grid-template-columns: 1fr; }
    .form-row-4[b-k5z0k3er57] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-k5z0k3er57] { width: 98%; max-height: 95vh; }
    .modal-lg[b-k5z0k3er57] { max-width: 98vw; width: 98vw; }
    .modal-body[b-k5z0k3er57] { padding: 0.75rem; }
    .modal-tabs[b-k5z0k3er57] { overflow-x: auto; }
    .modal-tab[b-k5z0k3er57] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-k5z0k3er57] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-k5z0k3er57] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-k5z0k3er57] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-k5z0k3er57] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-k5z0k3er57] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-k5z0k3er57] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-k5z0k3er57] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-k5z0k3er57] { border-bottom: none; }
.help-section p[b-k5z0k3er57] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-k5z0k3er57], .help-section ol[b-k5z0k3er57] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-k5z0k3er57] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-k5z0k3er57] { color: var(--rg-accent,#2563eb); }
.help-tip[b-k5z0k3er57] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-k5z0k3er57] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-k5z0k3er57] { background: rgba(37,99,235,0.12); }
.help-table[b-k5z0k3er57] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-k5z0k3er57] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-k5z0k3er57] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-k5z0k3er57] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-k5z0k3er57] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-k5z0k3er57] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-k5z0k3er57] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-k5z0k3er57] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-k5z0k3er57] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-k5z0k3er57] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-k5z0k3er57] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-k5z0k3er57] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-k5z0k3er57] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-k5z0k3er57] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-k5z0k3er57] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-k5z0k3er57] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-k5z0k3er57] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-k5z0k3er57] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

.psv-cap-layout[b-k5z0k3er57] { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1rem; padding: 0.5rem 0; }
@media (max-width: 980px) { .psv-cap-layout[b-k5z0k3er57] { grid-template-columns: 1fr; } }
.psv-cap-form[b-k5z0k3er57] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.psv-cap-list[b-k5z0k3er57] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1rem; max-height: 70vh; overflow-y: auto; }
.psv-consulta-card[b-k5z0k3er57] { display: flex; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid; margin: 0.6rem 0; }
.psv-consulta-card i[b-k5z0k3er57] { font-size: 1.6rem; flex-shrink: 0; }
.psv-consulta-card.ok[b-k5z0k3er57] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.psv-consulta-card.warn[b-k5z0k3er57] { background: #fffbeb; border-color: #fde68a; color: #92400e; }
[data-mode="dark"] .psv-consulta-card.ok[b-k5z0k3er57] { background: rgba(16,185,129,0.12); border-color: rgba(16,185,129,0.4); color: #86efac; }
[data-mode="dark"] .psv-consulta-card.warn[b-k5z0k3er57] { background: rgba(217,119,6,0.12); border-color: rgba(217,119,6,0.4); color: #fcd34d; }
.psv-consulta-body[b-k5z0k3er57] { display: flex; flex-direction: column; gap: 0.2rem; }
.psv-consulta-line[b-k5z0k3er57] { font-size: 0.82rem; }
.psv-totales[b-k5z0k3er57] { margin-top: 1rem; padding: 0.85rem 1rem; background: var(--rg-bg-sidebar, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; }
[data-mode="dark"] .psv-totales[b-k5z0k3er57] { background: rgba(255,255,255,0.03); }
.psv-tot-row[b-k5z0k3er57] { display: flex; justify-content: space-between; align-items: baseline; padding: 0.2rem 0; font-size: 0.85rem; }
.psv-tot-row span[b-k5z0k3er57] { color: var(--rg-text-secondary, #475569); }
.psv-tot-row strong[b-k5z0k3er57] { font-family: 'Cascadia Code', monospace; }
.psv-tot-total[b-k5z0k3er57] { border-top: 1px solid var(--rg-border, #e2e8f0); margin-top: 0.4rem; padding-top: 0.5rem; font-size: 1.05rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.psv-tot-total strong[b-k5z0k3er57] { color: var(--rg-accent, #4f46e5); font-size: 1.1rem; }
.text-success[b-k5z0k3er57] { color: #16a34a; }
.crud-table.sm th[b-k5z0k3er57], .crud-table.sm td[b-k5z0k3er57] { padding: 0.35rem 0.5rem; font-size: 0.72rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PsvEndpoints.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-tcgxwaok6s] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tcgxwaok6s 0.3s ease-out; }
@keyframes slideUp-b-tcgxwaok6s { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tcgxwaok6s] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tcgxwaok6s] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tcgxwaok6s] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tcgxwaok6s] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tcgxwaok6s] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tcgxwaok6s] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tcgxwaok6s] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tcgxwaok6s] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tcgxwaok6s] { filter: brightness(1.1); }
.btn-outline[b-tcgxwaok6s] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tcgxwaok6s] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tcgxwaok6s] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tcgxwaok6s] { filter: brightness(1.1); }
.btn-icon[b-tcgxwaok6s] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tcgxwaok6s] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tcgxwaok6s] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tcgxwaok6s] { color: #ef4444; }
.btn-delete:hover[b-tcgxwaok6s] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-tcgxwaok6s] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-tcgxwaok6s] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-tcgxwaok6s] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tcgxwaok6s] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tcgxwaok6s] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tcgxwaok6s] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tcgxwaok6s] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tcgxwaok6s] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-tcgxwaok6s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-tcgxwaok6s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tcgxwaok6s] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-tcgxwaok6s] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-tcgxwaok6s] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tcgxwaok6s] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tcgxwaok6s] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tcgxwaok6s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tcgxwaok6s] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tcgxwaok6s] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tcgxwaok6s] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-tcgxwaok6s] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-tcgxwaok6s] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-tcgxwaok6s] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tcgxwaok6s] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tcgxwaok6s] { background: #f1f5f9; color: #64748b; }
.badge-info[b-tcgxwaok6s] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-tcgxwaok6s] { background: #fffbeb; color: #92400e; }
.badge-danger[b-tcgxwaok6s] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-tcgxwaok6s] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-tcgxwaok6s] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-tcgxwaok6s] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-tcgxwaok6s] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-tcgxwaok6s] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-tcgxwaok6s] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-tcgxwaok6s] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-tcgxwaok6s] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tcgxwaok6s] { text-align: center; }
.text-muted[b-tcgxwaok6s] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tcgxwaok6s], .crud-empty-state[b-tcgxwaok6s] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tcgxwaok6s] { font-size: 2rem; }
.crud-spinner[b-tcgxwaok6s] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tcgxwaok6s 0.6s linear infinite; }
.crud-spinner-sm[b-tcgxwaok6s] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tcgxwaok6s 0.6s linear infinite; }
@keyframes spin-b-tcgxwaok6s { to { transform: rotate(360deg); } }
.spin[b-tcgxwaok6s] { animation: spin-b-tcgxwaok6s 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-tcgxwaok6s] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tcgxwaok6s 0.15s ease-out; }
.modal-container[b-tcgxwaok6s] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tcgxwaok6s] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tcgxwaok6s 0.2s ease-out; }
.modal-lg[b-tcgxwaok6s] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-tcgxwaok6s] { max-width: 420px; }
@keyframes fadeIn-b-tcgxwaok6s { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tcgxwaok6s { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tcgxwaok6s] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tcgxwaok6s] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-tcgxwaok6s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tcgxwaok6s] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tcgxwaok6s] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tcgxwaok6s] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tcgxwaok6s] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-tcgxwaok6s] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tcgxwaok6s] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tcgxwaok6s] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tcgxwaok6s] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-tcgxwaok6s] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tcgxwaok6s] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tcgxwaok6s] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tcgxwaok6s] { flex: 2; }
.form-group label[b-tcgxwaok6s] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tcgxwaok6s], .form-group select[b-tcgxwaok6s], .form-textarea[b-tcgxwaok6s] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tcgxwaok6s], .form-group select:focus[b-tcgxwaok6s], .form-textarea:focus[b-tcgxwaok6s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tcgxwaok6s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tcgxwaok6s] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tcgxwaok6s] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tcgxwaok6s] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-tcgxwaok6s] { margin-top: 0; }
.form-section-title i[b-tcgxwaok6s] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-tcgxwaok6s] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-tcgxwaok6s] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-tcgxwaok6s] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-tcgxwaok6s] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-tcgxwaok6s] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-tcgxwaok6s] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-tcgxwaok6s] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-tcgxwaok6s] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tcgxwaok6s] { padding: 0.75rem; }
    .crud-header[b-tcgxwaok6s] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tcgxwaok6s] { font-size: 1.1rem; }
    .btn-text[b-tcgxwaok6s] { display: none; }
    .form-row[b-tcgxwaok6s] { flex-direction: column; }
    .form-row-3[b-tcgxwaok6s] { grid-template-columns: 1fr; }
    .form-row-4[b-tcgxwaok6s] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tcgxwaok6s] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tcgxwaok6s] { max-width: 98vw; width: 98vw; }
    .modal-body[b-tcgxwaok6s] { padding: 0.75rem; }
    .modal-tabs[b-tcgxwaok6s] { overflow-x: auto; }
    .modal-tab[b-tcgxwaok6s] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-tcgxwaok6s] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tcgxwaok6s] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tcgxwaok6s] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tcgxwaok6s] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-tcgxwaok6s] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-tcgxwaok6s] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-tcgxwaok6s] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-tcgxwaok6s] { border-bottom: none; }
.help-section p[b-tcgxwaok6s] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-tcgxwaok6s], .help-section ol[b-tcgxwaok6s] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-tcgxwaok6s] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-tcgxwaok6s] { color: var(--rg-accent,#2563eb); }
.help-tip[b-tcgxwaok6s] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-tcgxwaok6s] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-tcgxwaok6s] { background: rgba(37,99,235,0.12); }
.help-table[b-tcgxwaok6s] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-tcgxwaok6s] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-tcgxwaok6s] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-tcgxwaok6s] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-tcgxwaok6s] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-tcgxwaok6s] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-tcgxwaok6s] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-tcgxwaok6s] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-tcgxwaok6s] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-tcgxwaok6s] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-tcgxwaok6s] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-tcgxwaok6s] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-tcgxwaok6s] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-tcgxwaok6s] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-tcgxwaok6s] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-tcgxwaok6s] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-tcgxwaok6s] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-tcgxwaok6s] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

.crud-filter-row[b-tcgxwaok6s] { display: flex; gap: 0.5rem; align-items: flex-end; padding: 0.5rem 0; flex-wrap: wrap; }
.json-edit[b-tcgxwaok6s] { width: 100%; font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.78rem; padding: 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; resize: vertical; margin-bottom: 0.5rem; }
.json-edit:focus[b-tcgxwaok6s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
code[b-tcgxwaok6s] { background: var(--rg-bg-sidebar, #f1f5f9); padding: 0.1rem 0.35rem; border-radius: 0.25rem; font-family: 'Cascadia Code', monospace; font-size: 0.78rem; color: var(--rg-accent, #4f46e5); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PsvProveedores.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-v8xl4ytd6x] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-v8xl4ytd6x 0.3s ease-out; }
@keyframes slideUp-b-v8xl4ytd6x { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-v8xl4ytd6x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-v8xl4ytd6x] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-v8xl4ytd6x] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-v8xl4ytd6x] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-v8xl4ytd6x] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-v8xl4ytd6x] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-v8xl4ytd6x] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-v8xl4ytd6x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-v8xl4ytd6x] { filter: brightness(1.1); }
.btn-outline[b-v8xl4ytd6x] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-v8xl4ytd6x] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-v8xl4ytd6x] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-v8xl4ytd6x] { filter: brightness(1.1); }
.btn-icon[b-v8xl4ytd6x] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-v8xl4ytd6x] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-v8xl4ytd6x] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-v8xl4ytd6x] { color: #ef4444; }
.btn-delete:hover[b-v8xl4ytd6x] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-v8xl4ytd6x] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-v8xl4ytd6x] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-v8xl4ytd6x] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-v8xl4ytd6x] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-v8xl4ytd6x] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-v8xl4ytd6x] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-v8xl4ytd6x] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-v8xl4ytd6x] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-v8xl4ytd6x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-v8xl4ytd6x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-v8xl4ytd6x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-v8xl4ytd6x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-v8xl4ytd6x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-v8xl4ytd6x] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-v8xl4ytd6x] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-v8xl4ytd6x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-v8xl4ytd6x] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-v8xl4ytd6x] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-v8xl4ytd6x] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-v8xl4ytd6x] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-v8xl4ytd6x] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-v8xl4ytd6x] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-v8xl4ytd6x] { background: #ecfdf5; color: #065f46; }
.badge-no[b-v8xl4ytd6x] { background: #f1f5f9; color: #64748b; }
.badge-info[b-v8xl4ytd6x] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-v8xl4ytd6x] { background: #fffbeb; color: #92400e; }
.badge-danger[b-v8xl4ytd6x] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-v8xl4ytd6x] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-v8xl4ytd6x] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-v8xl4ytd6x] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-v8xl4ytd6x] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-v8xl4ytd6x] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-v8xl4ytd6x] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-v8xl4ytd6x] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-v8xl4ytd6x] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-v8xl4ytd6x] { text-align: center; }
.text-muted[b-v8xl4ytd6x] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-v8xl4ytd6x], .crud-empty-state[b-v8xl4ytd6x] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-v8xl4ytd6x] { font-size: 2rem; }
.crud-spinner[b-v8xl4ytd6x] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-v8xl4ytd6x 0.6s linear infinite; }
.crud-spinner-sm[b-v8xl4ytd6x] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-v8xl4ytd6x 0.6s linear infinite; }
@keyframes spin-b-v8xl4ytd6x { to { transform: rotate(360deg); } }
.spin[b-v8xl4ytd6x] { animation: spin-b-v8xl4ytd6x 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-v8xl4ytd6x] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-v8xl4ytd6x 0.15s ease-out; }
.modal-container[b-v8xl4ytd6x] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-v8xl4ytd6x] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-v8xl4ytd6x 0.2s ease-out; }
.modal-lg[b-v8xl4ytd6x] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-v8xl4ytd6x] { max-width: 420px; }
@keyframes fadeIn-b-v8xl4ytd6x { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-v8xl4ytd6x { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-v8xl4ytd6x] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-v8xl4ytd6x] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-v8xl4ytd6x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-v8xl4ytd6x] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-v8xl4ytd6x] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-v8xl4ytd6x] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-v8xl4ytd6x] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-v8xl4ytd6x] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-v8xl4ytd6x] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-v8xl4ytd6x] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-v8xl4ytd6x] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-v8xl4ytd6x] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-v8xl4ytd6x] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-v8xl4ytd6x] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-v8xl4ytd6x] { flex: 2; }
.form-group label[b-v8xl4ytd6x] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-v8xl4ytd6x], .form-group select[b-v8xl4ytd6x], .form-textarea[b-v8xl4ytd6x] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-v8xl4ytd6x], .form-group select:focus[b-v8xl4ytd6x], .form-textarea:focus[b-v8xl4ytd6x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-v8xl4ytd6x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-v8xl4ytd6x] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-v8xl4ytd6x] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-v8xl4ytd6x] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-v8xl4ytd6x] { margin-top: 0; }
.form-section-title i[b-v8xl4ytd6x] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-v8xl4ytd6x] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-v8xl4ytd6x] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-v8xl4ytd6x] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-v8xl4ytd6x] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-v8xl4ytd6x] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-v8xl4ytd6x] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-v8xl4ytd6x] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-v8xl4ytd6x] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-v8xl4ytd6x] { padding: 0.75rem; }
    .crud-header[b-v8xl4ytd6x] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-v8xl4ytd6x] { font-size: 1.1rem; }
    .btn-text[b-v8xl4ytd6x] { display: none; }
    .form-row[b-v8xl4ytd6x] { flex-direction: column; }
    .form-row-3[b-v8xl4ytd6x] { grid-template-columns: 1fr; }
    .form-row-4[b-v8xl4ytd6x] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-v8xl4ytd6x] { width: 98%; max-height: 95vh; }
    .modal-lg[b-v8xl4ytd6x] { max-width: 98vw; width: 98vw; }
    .modal-body[b-v8xl4ytd6x] { padding: 0.75rem; }
    .modal-tabs[b-v8xl4ytd6x] { overflow-x: auto; }
    .modal-tab[b-v8xl4ytd6x] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-v8xl4ytd6x] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-v8xl4ytd6x] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-v8xl4ytd6x] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-v8xl4ytd6x] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-v8xl4ytd6x] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-v8xl4ytd6x] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-v8xl4ytd6x] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-v8xl4ytd6x] { border-bottom: none; }
.help-section p[b-v8xl4ytd6x] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-v8xl4ytd6x], .help-section ol[b-v8xl4ytd6x] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-v8xl4ytd6x] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-v8xl4ytd6x] { color: var(--rg-accent,#2563eb); }
.help-tip[b-v8xl4ytd6x] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-v8xl4ytd6x] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-v8xl4ytd6x] { background: rgba(37,99,235,0.12); }
.help-table[b-v8xl4ytd6x] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-v8xl4ytd6x] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-v8xl4ytd6x] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-v8xl4ytd6x] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-v8xl4ytd6x] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-v8xl4ytd6x] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-v8xl4ytd6x] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-v8xl4ytd6x] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-v8xl4ytd6x] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-v8xl4ytd6x] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-v8xl4ytd6x] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-v8xl4ytd6x] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-v8xl4ytd6x] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-v8xl4ytd6x] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-v8xl4ytd6x] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-v8xl4ytd6x] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-v8xl4ytd6x] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-v8xl4ytd6x] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

.crud-filter-row[b-v8xl4ytd6x] { display: flex; gap: 0.5rem; align-items: flex-end; padding: 0.5rem 0; flex-wrap: wrap; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_PsvServicios.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-5okz3l6los] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5okz3l6los 0.3s ease-out; }
@keyframes slideUp-b-5okz3l6los { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5okz3l6los] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5okz3l6los] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5okz3l6los] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5okz3l6los] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5okz3l6los] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5okz3l6los] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5okz3l6los] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5okz3l6los] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5okz3l6los] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5okz3l6los] { filter: brightness(1.1); }
.btn-outline[b-5okz3l6los] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5okz3l6los] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5okz3l6los] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5okz3l6los] { filter: brightness(1.1); }
.btn-icon[b-5okz3l6los] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5okz3l6los] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5okz3l6los] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5okz3l6los] { color: #ef4444; }
.btn-delete:hover[b-5okz3l6los] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-5okz3l6los] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-5okz3l6los] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-5okz3l6los] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-5okz3l6los] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5okz3l6los] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-5okz3l6los] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-5okz3l6los] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5okz3l6los] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5okz3l6los] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5okz3l6los] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-5okz3l6los] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-5okz3l6los] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5okz3l6los] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-5okz3l6los] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-5okz3l6los] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5okz3l6los] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5okz3l6los] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5okz3l6los] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-5okz3l6los] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5okz3l6los] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-5okz3l6los] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-5okz3l6los] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-5okz3l6los] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-5okz3l6los] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5okz3l6los] { background: #ecfdf5; color: #065f46; }
.badge-no[b-5okz3l6los] { background: #f1f5f9; color: #64748b; }
.badge-info[b-5okz3l6los] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-5okz3l6los] { background: #fffbeb; color: #92400e; }
.badge-danger[b-5okz3l6los] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-5okz3l6los] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-5okz3l6los] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-5okz3l6los] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-5okz3l6los] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-5okz3l6los] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-5okz3l6los] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-5okz3l6los] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-5okz3l6los] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-5okz3l6los] { text-align: center; }
.text-muted[b-5okz3l6los] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-5okz3l6los], .crud-empty-state[b-5okz3l6los] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5okz3l6los] { font-size: 2rem; }
.crud-spinner[b-5okz3l6los] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5okz3l6los 0.6s linear infinite; }
.crud-spinner-sm[b-5okz3l6los] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5okz3l6los 0.6s linear infinite; }
@keyframes spin-b-5okz3l6los { to { transform: rotate(360deg); } }
.spin[b-5okz3l6los] { animation: spin-b-5okz3l6los 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-5okz3l6los] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5okz3l6los 0.15s ease-out; }
.modal-container[b-5okz3l6los] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5okz3l6los] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5okz3l6los 0.2s ease-out; }
.modal-lg[b-5okz3l6los] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-5okz3l6los] { max-width: 420px; }
@keyframes fadeIn-b-5okz3l6los { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5okz3l6los { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-5okz3l6los] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5okz3l6los] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-5okz3l6los] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5okz3l6los] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5okz3l6los] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5okz3l6los] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-5okz3l6los] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-5okz3l6los] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-5okz3l6los] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-5okz3l6los] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-5okz3l6los] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-5okz3l6los] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-5okz3l6los] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-5okz3l6los] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-5okz3l6los] { flex: 2; }
.form-group label[b-5okz3l6los] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5okz3l6los], .form-group select[b-5okz3l6los], .form-textarea[b-5okz3l6los] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5okz3l6los], .form-group select:focus[b-5okz3l6los], .form-textarea:focus[b-5okz3l6los] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-5okz3l6los] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-5okz3l6los] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-5okz3l6los] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-5okz3l6los] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-5okz3l6los] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-5okz3l6los] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-5okz3l6los] { margin-top: 0; }
.form-section-title i[b-5okz3l6los] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-5okz3l6los] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-5okz3l6los] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-5okz3l6los] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-5okz3l6los] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-5okz3l6los] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-5okz3l6los] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-5okz3l6los] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-5okz3l6los] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-5okz3l6los] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-5okz3l6los] { padding: 0.75rem; }
    .crud-header[b-5okz3l6los] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5okz3l6los] { font-size: 1.1rem; }
    .btn-text[b-5okz3l6los] { display: none; }
    .form-row[b-5okz3l6los] { flex-direction: column; }
    .form-row-3[b-5okz3l6los] { grid-template-columns: 1fr; }
    .form-row-4[b-5okz3l6los] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-5okz3l6los] { width: 98%; max-height: 95vh; }
    .modal-lg[b-5okz3l6los] { max-width: 98vw; width: 98vw; }
    .modal-body[b-5okz3l6los] { padding: 0.75rem; }
    .modal-tabs[b-5okz3l6los] { overflow-x: auto; }
    .modal-tab[b-5okz3l6los] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-5okz3l6los] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5okz3l6los] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5okz3l6los] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5okz3l6los] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-5okz3l6los] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-5okz3l6los] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-5okz3l6los] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-5okz3l6los] { border-bottom: none; }
.help-section p[b-5okz3l6los] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-5okz3l6los], .help-section ol[b-5okz3l6los] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-5okz3l6los] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-5okz3l6los] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-5okz3l6los] { color: var(--rg-accent,#2563eb); }
.help-tip[b-5okz3l6los] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-5okz3l6los] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-5okz3l6los] { background: rgba(37,99,235,0.12); }
.help-table[b-5okz3l6los] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-5okz3l6los] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-5okz3l6los] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-5okz3l6los] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-5okz3l6los] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-5okz3l6los] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-5okz3l6los] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-5okz3l6los] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-5okz3l6los] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-5okz3l6los] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-5okz3l6los] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-5okz3l6los] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-5okz3l6los] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-5okz3l6los] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-5okz3l6los] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-5okz3l6los] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-5okz3l6los] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-5okz3l6los] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

.crud-filter-row[b-5okz3l6los] { display: flex; gap: 0.5rem; align-items: flex-end; padding: 0.5rem 0; flex-wrap: wrap; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_Reporte623.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-h8lmep7pqt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h8lmep7pqt 0.3s ease-out; }
@keyframes slideUp-b-h8lmep7pqt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h8lmep7pqt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h8lmep7pqt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h8lmep7pqt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h8lmep7pqt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h8lmep7pqt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h8lmep7pqt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h8lmep7pqt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h8lmep7pqt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h8lmep7pqt] { filter: brightness(1.1); }
.btn-outline[b-h8lmep7pqt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h8lmep7pqt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h8lmep7pqt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h8lmep7pqt] { filter: brightness(1.1); }
.btn-icon[b-h8lmep7pqt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h8lmep7pqt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h8lmep7pqt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h8lmep7pqt] { color: #ef4444; }
.btn-delete:hover[b-h8lmep7pqt] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-h8lmep7pqt] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-h8lmep7pqt] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-h8lmep7pqt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h8lmep7pqt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h8lmep7pqt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h8lmep7pqt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h8lmep7pqt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h8lmep7pqt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-h8lmep7pqt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-h8lmep7pqt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h8lmep7pqt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-h8lmep7pqt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-h8lmep7pqt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h8lmep7pqt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h8lmep7pqt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h8lmep7pqt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h8lmep7pqt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h8lmep7pqt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h8lmep7pqt] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-h8lmep7pqt] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-h8lmep7pqt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-h8lmep7pqt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h8lmep7pqt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h8lmep7pqt] { background: #f1f5f9; color: #64748b; }
.badge-info[b-h8lmep7pqt] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-h8lmep7pqt] { background: #fffbeb; color: #92400e; }
.badge-danger[b-h8lmep7pqt] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-h8lmep7pqt] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-h8lmep7pqt] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-h8lmep7pqt] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-h8lmep7pqt] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-h8lmep7pqt] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-h8lmep7pqt] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-h8lmep7pqt] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-h8lmep7pqt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h8lmep7pqt] { text-align: center; }
.text-muted[b-h8lmep7pqt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h8lmep7pqt], .crud-empty-state[b-h8lmep7pqt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h8lmep7pqt] { font-size: 2rem; }
.crud-spinner[b-h8lmep7pqt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h8lmep7pqt 0.6s linear infinite; }
.crud-spinner-sm[b-h8lmep7pqt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h8lmep7pqt 0.6s linear infinite; }
@keyframes spin-b-h8lmep7pqt { to { transform: rotate(360deg); } }
.spin[b-h8lmep7pqt] { animation: spin-b-h8lmep7pqt 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-h8lmep7pqt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h8lmep7pqt 0.15s ease-out; }
.modal-container[b-h8lmep7pqt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h8lmep7pqt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h8lmep7pqt 0.2s ease-out; }
.modal-lg[b-h8lmep7pqt] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-h8lmep7pqt] { max-width: 420px; }
@keyframes fadeIn-b-h8lmep7pqt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h8lmep7pqt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h8lmep7pqt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h8lmep7pqt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-h8lmep7pqt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h8lmep7pqt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h8lmep7pqt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h8lmep7pqt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h8lmep7pqt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-h8lmep7pqt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h8lmep7pqt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h8lmep7pqt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h8lmep7pqt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h8lmep7pqt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h8lmep7pqt] { flex: 2; }
.form-group label[b-h8lmep7pqt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h8lmep7pqt], .form-group select[b-h8lmep7pqt], .form-textarea[b-h8lmep7pqt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h8lmep7pqt], .form-group select:focus[b-h8lmep7pqt], .form-textarea:focus[b-h8lmep7pqt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h8lmep7pqt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h8lmep7pqt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h8lmep7pqt] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h8lmep7pqt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-h8lmep7pqt] { margin-top: 0; }
.form-section-title i[b-h8lmep7pqt] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-h8lmep7pqt] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-h8lmep7pqt] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-h8lmep7pqt] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-h8lmep7pqt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-h8lmep7pqt] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-h8lmep7pqt] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-h8lmep7pqt] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-h8lmep7pqt] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h8lmep7pqt] { padding: 0.75rem; }
    .crud-header[b-h8lmep7pqt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h8lmep7pqt] { font-size: 1.1rem; }
    .btn-text[b-h8lmep7pqt] { display: none; }
    .form-row[b-h8lmep7pqt] { flex-direction: column; }
    .form-row-3[b-h8lmep7pqt] { grid-template-columns: 1fr; }
    .form-row-4[b-h8lmep7pqt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h8lmep7pqt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h8lmep7pqt] { max-width: 98vw; width: 98vw; }
    .modal-body[b-h8lmep7pqt] { padding: 0.75rem; }
    .modal-tabs[b-h8lmep7pqt] { overflow-x: auto; }
    .modal-tab[b-h8lmep7pqt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-h8lmep7pqt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h8lmep7pqt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h8lmep7pqt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h8lmep7pqt] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-h8lmep7pqt] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-h8lmep7pqt] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-h8lmep7pqt] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-h8lmep7pqt] { border-bottom: none; }
.help-section p[b-h8lmep7pqt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-h8lmep7pqt], .help-section ol[b-h8lmep7pqt] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-h8lmep7pqt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-h8lmep7pqt] { color: var(--rg-accent,#2563eb); }
.help-tip[b-h8lmep7pqt] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-h8lmep7pqt] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-h8lmep7pqt] { background: rgba(37,99,235,0.12); }
.help-table[b-h8lmep7pqt] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-h8lmep7pqt] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-h8lmep7pqt] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-h8lmep7pqt] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-h8lmep7pqt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-h8lmep7pqt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-h8lmep7pqt] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-h8lmep7pqt] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-h8lmep7pqt] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-h8lmep7pqt] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-h8lmep7pqt] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-h8lmep7pqt] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-h8lmep7pqt] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-h8lmep7pqt] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-h8lmep7pqt] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-h8lmep7pqt] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-h8lmep7pqt] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-h8lmep7pqt] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-h8lmep7pqt] { font-size: 1.6rem; }
.pos-op-btn > div[b-h8lmep7pqt] { display: flex; flex-direction: column; }
.pos-op-title[b-h8lmep7pqt] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-h8lmep7pqt] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-h8lmep7pqt] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-h8lmep7pqt] { color: var(--rg-success); }
.pos-op-ret[b-h8lmep7pqt] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-h8lmep7pqt] { color: var(--rg-danger); }

.pos-cuenta-search[b-h8lmep7pqt] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-h8lmep7pqt] { flex: 1; }

.pos-cuenta-card[b-h8lmep7pqt] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-h8lmep7pqt] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-h8lmep7pqt] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-h8lmep7pqt] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-h8lmep7pqt] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-h8lmep7pqt], .pos-res-saldos > div[b-h8lmep7pqt] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-h8lmep7pqt] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-h8lmep7pqt] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-h8lmep7pqt] { color: var(--rg-success); }
.pos-cuenta-aviso[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-h8lmep7pqt] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-h8lmep7pqt] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-h8lmep7pqt] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-h8lmep7pqt] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-h8lmep7pqt]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-h8lmep7pqt] { z-index: 2001 !important; }

.badge-warn[b-h8lmep7pqt] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-h8lmep7pqt] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-h8lmep7pqt] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-h8lmep7pqt] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-h8lmep7pqt] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-h8lmep7pqt] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-h8lmep7pqt] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-h8lmep7pqt] { margin-bottom: 0; }
.dv-periodo input[b-h8lmep7pqt], .dv-periodo select[b-h8lmep7pqt] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-h8lmep7pqt] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-h8lmep7pqt] { text-align: right; }
.badge-warn[b-h8lmep7pqt] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-h8lmep7pqt] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-h8lmep7pqt] { flex-direction: column; align-items: stretch; } .dv-periodo[b-h8lmep7pqt], .dv-acciones[b-h8lmep7pqt] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-h8lmep7pqt] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-h8lmep7pqt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-h8lmep7pqt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-h8lmep7pqt] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-h8lmep7pqt] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-h8lmep7pqt] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-h8lmep7pqt] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-h8lmep7pqt] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-h8lmep7pqt] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-h8lmep7pqt] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-h8lmep7pqt] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-h8lmep7pqt] { border-bottom: none; }
.config-toggle-label[b-h8lmep7pqt] { flex: 1; }
.config-toggle-name[b-h8lmep7pqt] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-h8lmep7pqt] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-h8lmep7pqt] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-h8lmep7pqt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h8lmep7pqt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-h8lmep7pqt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h8lmep7pqt], .form-group select[b-h8lmep7pqt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_ReporteIT1.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-kfym42gbdp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kfym42gbdp 0.3s ease-out; }
@keyframes slideUp-b-kfym42gbdp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kfym42gbdp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kfym42gbdp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kfym42gbdp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kfym42gbdp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kfym42gbdp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kfym42gbdp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kfym42gbdp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kfym42gbdp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kfym42gbdp] { filter: brightness(1.1); }
.btn-outline[b-kfym42gbdp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kfym42gbdp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kfym42gbdp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kfym42gbdp] { filter: brightness(1.1); }
.btn-icon[b-kfym42gbdp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kfym42gbdp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kfym42gbdp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kfym42gbdp] { color: #ef4444; }
.btn-delete:hover[b-kfym42gbdp] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-kfym42gbdp] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-kfym42gbdp] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-kfym42gbdp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kfym42gbdp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kfym42gbdp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kfym42gbdp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kfym42gbdp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kfym42gbdp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-kfym42gbdp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-kfym42gbdp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kfym42gbdp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-kfym42gbdp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-kfym42gbdp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kfym42gbdp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kfym42gbdp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kfym42gbdp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kfym42gbdp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kfym42gbdp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kfym42gbdp] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-kfym42gbdp] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-kfym42gbdp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-kfym42gbdp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kfym42gbdp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kfym42gbdp] { background: #f1f5f9; color: #64748b; }
.badge-info[b-kfym42gbdp] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-kfym42gbdp] { background: #fffbeb; color: #92400e; }
.badge-danger[b-kfym42gbdp] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-kfym42gbdp] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-kfym42gbdp] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-kfym42gbdp] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-kfym42gbdp] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-kfym42gbdp] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-kfym42gbdp] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-kfym42gbdp] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-kfym42gbdp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kfym42gbdp] { text-align: center; }
.text-muted[b-kfym42gbdp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kfym42gbdp], .crud-empty-state[b-kfym42gbdp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kfym42gbdp] { font-size: 2rem; }
.crud-spinner[b-kfym42gbdp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kfym42gbdp 0.6s linear infinite; }
.crud-spinner-sm[b-kfym42gbdp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kfym42gbdp 0.6s linear infinite; }
@keyframes spin-b-kfym42gbdp { to { transform: rotate(360deg); } }
.spin[b-kfym42gbdp] { animation: spin-b-kfym42gbdp 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-kfym42gbdp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kfym42gbdp 0.15s ease-out; }
.modal-container[b-kfym42gbdp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kfym42gbdp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kfym42gbdp 0.2s ease-out; }
.modal-lg[b-kfym42gbdp] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-kfym42gbdp] { max-width: 420px; }
@keyframes fadeIn-b-kfym42gbdp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kfym42gbdp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kfym42gbdp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kfym42gbdp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-kfym42gbdp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kfym42gbdp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kfym42gbdp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kfym42gbdp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kfym42gbdp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-kfym42gbdp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kfym42gbdp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kfym42gbdp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kfym42gbdp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kfym42gbdp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kfym42gbdp] { flex: 2; }
.form-group label[b-kfym42gbdp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kfym42gbdp], .form-group select[b-kfym42gbdp], .form-textarea[b-kfym42gbdp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kfym42gbdp], .form-group select:focus[b-kfym42gbdp], .form-textarea:focus[b-kfym42gbdp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kfym42gbdp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kfym42gbdp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kfym42gbdp] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kfym42gbdp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-kfym42gbdp] { margin-top: 0; }
.form-section-title i[b-kfym42gbdp] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-kfym42gbdp] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-kfym42gbdp] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-kfym42gbdp] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-kfym42gbdp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-kfym42gbdp] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-kfym42gbdp] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-kfym42gbdp] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-kfym42gbdp] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kfym42gbdp] { padding: 0.75rem; }
    .crud-header[b-kfym42gbdp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kfym42gbdp] { font-size: 1.1rem; }
    .btn-text[b-kfym42gbdp] { display: none; }
    .form-row[b-kfym42gbdp] { flex-direction: column; }
    .form-row-3[b-kfym42gbdp] { grid-template-columns: 1fr; }
    .form-row-4[b-kfym42gbdp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kfym42gbdp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kfym42gbdp] { max-width: 98vw; width: 98vw; }
    .modal-body[b-kfym42gbdp] { padding: 0.75rem; }
    .modal-tabs[b-kfym42gbdp] { overflow-x: auto; }
    .modal-tab[b-kfym42gbdp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-kfym42gbdp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kfym42gbdp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kfym42gbdp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kfym42gbdp] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-kfym42gbdp] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-kfym42gbdp] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-kfym42gbdp] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-kfym42gbdp] { border-bottom: none; }
.help-section p[b-kfym42gbdp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-kfym42gbdp], .help-section ol[b-kfym42gbdp] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-kfym42gbdp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-kfym42gbdp] { color: var(--rg-accent,#2563eb); }
.help-tip[b-kfym42gbdp] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-kfym42gbdp] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-kfym42gbdp] { background: rgba(37,99,235,0.12); }
.help-table[b-kfym42gbdp] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-kfym42gbdp] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-kfym42gbdp] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-kfym42gbdp] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-kfym42gbdp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-kfym42gbdp] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-kfym42gbdp] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-kfym42gbdp] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-kfym42gbdp] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-kfym42gbdp] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-kfym42gbdp] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-kfym42gbdp] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-kfym42gbdp] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-kfym42gbdp] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-kfym42gbdp] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-kfym42gbdp] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-kfym42gbdp] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-kfym42gbdp] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-kfym42gbdp] { font-size: 1.6rem; }
.pos-op-btn > div[b-kfym42gbdp] { display: flex; flex-direction: column; }
.pos-op-title[b-kfym42gbdp] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-kfym42gbdp] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-kfym42gbdp] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-kfym42gbdp] { color: var(--rg-success); }
.pos-op-ret[b-kfym42gbdp] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-kfym42gbdp] { color: var(--rg-danger); }

.pos-cuenta-search[b-kfym42gbdp] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-kfym42gbdp] { flex: 1; }

.pos-cuenta-card[b-kfym42gbdp] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-kfym42gbdp] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-kfym42gbdp] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-kfym42gbdp] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-kfym42gbdp] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-kfym42gbdp], .pos-res-saldos > div[b-kfym42gbdp] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-kfym42gbdp] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-kfym42gbdp] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-kfym42gbdp] { color: var(--rg-success); }
.pos-cuenta-aviso[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-kfym42gbdp] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-kfym42gbdp] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-kfym42gbdp] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-kfym42gbdp] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-kfym42gbdp]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-kfym42gbdp] { z-index: 2001 !important; }

.badge-warn[b-kfym42gbdp] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-kfym42gbdp] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-kfym42gbdp] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-kfym42gbdp] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-kfym42gbdp] { grid-template-columns: 1fr; }
}

/* ── Proceso de devengo ────────────────────────────────────────────────── */
.dv-toolbar[b-kfym42gbdp] { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.dv-periodo[b-kfym42gbdp] { display: flex; gap: 0.6rem; align-items: flex-end; }
.dv-periodo .form-group[b-kfym42gbdp] { margin-bottom: 0; }
.dv-periodo input[b-kfym42gbdp], .dv-periodo select[b-kfym42gbdp] { background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; min-width: 110px; }
.dv-acciones[b-kfym42gbdp] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.text-right[b-kfym42gbdp] { text-align: right; }
.badge-warn[b-kfym42gbdp] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-kfym42gbdp] { color: #fcd34d; }

@media (max-width: 720px) { .dv-toolbar[b-kfym42gbdp] { flex-direction: column; align-items: stretch; } .dv-periodo[b-kfym42gbdp], .dv-acciones[b-kfym42gbdp] { width: 100%; } }

/* ── Nómina — estilos adicionales ────────────────────────────── */
.lote-info-grid[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.lote-info-item[b-kfym42gbdp] { display: flex; flex-direction: column; gap: 0.15rem; }
.lote-info-lbl[b-kfym42gbdp] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-grid[b-kfym42gbdp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-kfym42gbdp] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-kfym42gbdp] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted,#94a3b8); }
.kpi-value[b-kfym42gbdp] { font-size: 1.2rem; font-weight: 800; color: var(--rg-text-primary,#1e293b); }
.upload-zone[b-kfym42gbdp] { border: 2px dashed var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 2.5rem; text-align: center; color: var(--rg-text-muted,#94a3b8); transition: all 0.2s; }
.upload-zone:hover[b-kfym42gbdp] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: rgba(79,70,229,0.03); }
.preview-block[b-kfym42gbdp] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; font-family: monospace; font-size: 0.75rem; color: var(--rg-text-primary,#1e293b); white-space: pre; overflow-x: auto; margin-top: 1rem; }
.notif-config-card[b-kfym42gbdp] { background: var(--rg-bg-card,#fff); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.75rem; padding: 1.25rem; }
.config-toggle-row[b-kfym42gbdp] { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.config-toggle-row:last-child[b-kfym42gbdp] { border-bottom: none; }
.config-toggle-label[b-kfym42gbdp] { flex: 1; }
.config-toggle-name[b-kfym42gbdp] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary,#1e293b); }
.config-toggle-desc[b-kfym42gbdp] { font-size: 0.72rem; color: var(--rg-text-muted,#94a3b8); }
.config-toggle-row input[type="checkbox"][b-kfym42gbdp] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent,#4f46e5); }
.form-row[b-kfym42gbdp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kfym42gbdp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-kfym42gbdp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kfym42gbdp], .form-group select[b-kfym42gbdp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_SolicitarReverso.razor.rz.scp.css */
/* ============================================================
   FrmAho_SolicitarReverso — Solicitud de Reverso de Movimiento
   ============================================================ */

.crud-container[b-ikoq3mfk2b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ikoq3mfk2b 0.3s ease-out; }
@keyframes slideUp-b-ikoq3mfk2b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-ikoq3mfk2b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ikoq3mfk2b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ikoq3mfk2b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ikoq3mfk2b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ikoq3mfk2b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ikoq3mfk2b] { display: flex; gap: 0.5rem; }

.btn-crud[b-ikoq3mfk2b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ikoq3mfk2b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ikoq3mfk2b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ikoq3mfk2b] { filter: brightness(1.1); }
.btn-outline[b-ikoq3mfk2b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ikoq3mfk2b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ikoq3mfk2b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ikoq3mfk2b] { filter: brightness(1.1); }

.crud-alert[b-ikoq3mfk2b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ikoq3mfk2b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ikoq3mfk2b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ikoq3mfk2b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-empty-state[b-ikoq3mfk2b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ikoq3mfk2b] { font-size: 2rem; }

.font-mono[b-ikoq3mfk2b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

@keyframes spin-b-ikoq3mfk2b { to { transform: rotate(360deg); } }
.spin[b-ikoq3mfk2b] { animation: spin-b-ikoq3mfk2b 0.8s linear infinite; }

/* ── Barra de búsqueda ─────────────────────────────────────── */
.rev-search-bar[b-ikoq3mfk2b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1rem 1.25rem; margin-bottom: 1rem; }
.rev-search-label[b-ikoq3mfk2b] { display: block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.rev-search-input-row[b-ikoq3mfk2b] { display: flex; gap: 0.5rem; }
.rev-search-input[b-ikoq3mfk2b] { flex: 1; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.85rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.rev-search-input:focus[b-ikoq3mfk2b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* ── Tarjeta del movimiento ────────────────────────────────── */
.rev-mov-card[b-ikoq3mfk2b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; overflow: hidden; }
.rev-mov-header[b-ikoq3mfk2b] { display: flex; align-items: center; gap: 0.75rem; padding: 0.875rem 1.25rem; background: var(--rg-bg-subtle, #f8fafc); border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.rev-mov-icon[b-ikoq3mfk2b] { font-size: 1.5rem; color: var(--rg-accent, #4f46e5); }
.rev-mov-num[b-ikoq3mfk2b] { display: block; font-weight: 700; font-size: 1rem; font-family: 'Cascadia Code', 'Fira Code', monospace; color: var(--rg-text-primary, #1e293b); }
.rev-mov-meta[b-ikoq3mfk2b] { display: block; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); }
.rev-mov-estado[b-ikoq3mfk2b] { margin-left: auto; }

.rev-mov-details[b-ikoq3mfk2b] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; padding: 1rem 1.25rem; }
.rev-mov-detail-item[b-ikoq3mfk2b] { display: flex; flex-direction: column; gap: 0.15rem; }
.rev-detail-wide[b-ikoq3mfk2b] { grid-column: span 3; }
.rev-detail-label[b-ikoq3mfk2b] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.rev-detail-value[b-ikoq3mfk2b] { font-size: 0.85rem; color: var(--rg-text-primary, #1e293b); font-weight: 500; }

/* ── Sección de motivo ─────────────────────────────────────── */
.rev-motivo-section[b-ikoq3mfk2b] { padding: 0.875rem 1.25rem 0.75rem; display: flex; flex-direction: column; gap: 0.3rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.rev-motivo-label[b-ikoq3mfk2b] { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-secondary, #475569); }
.rev-required[b-ikoq3mfk2b] { color: #ef4444; }
.rev-motivo-input[b-ikoq3mfk2b] { padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; font-size: 0.85rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; resize: vertical; font-family: inherit; }
.rev-motivo-input:focus[b-ikoq3mfk2b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.rev-char-count[b-ikoq3mfk2b] { font-size: 0.65rem; color: var(--rg-text-muted, #94a3b8); text-align: right; }
.rev-actions[b-ikoq3mfk2b] { padding: 0 1.25rem 1rem; display: flex; justify-content: flex-end; gap: 0.5rem; }

/* Badges */
.badge[b-ikoq3mfk2b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ikoq3mfk2b] { background: #ecfdf5; color: #065f46; }
.badge-danger[b-ikoq3mfk2b] { background: #fef2f2; color: #991b1b; }
[data-mode="dark"] .badge-yes[b-ikoq3mfk2b] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-danger[b-ikoq3mfk2b] { background: rgba(220,38,38,0.18); color: #fca5a5; }

/* Modal */
.modal-backdrop[b-ikoq3mfk2b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ikoq3mfk2b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ikoq3mfk2b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-ikoq3mfk2b] { max-width: 880px; }
.modal-sm[b-ikoq3mfk2b] { max-width: 420px; }
.modal-header[b-ikoq3mfk2b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ikoq3mfk2b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ikoq3mfk2b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ikoq3mfk2b] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-ikoq3mfk2b] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-ikoq3mfk2b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.btn-help[b-ikoq3mfk2b] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-ikoq3mfk2b] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-ikoq3mfk2b] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

.help-icon-header[b-ikoq3mfk2b] { color: var(--rg-accent, #2563eb); }
.help-body[b-ikoq3mfk2b] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ikoq3mfk2b] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-ikoq3mfk2b] { border-bottom: none; }
.help-section p[b-ikoq3mfk2b] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-ikoq3mfk2b] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ikoq3mfk2b] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-ikoq3mfk2b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ikoq3mfk2b] { color: var(--rg-accent, #2563eb); }
.help-tip[b-ikoq3mfk2b] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-ikoq3mfk2b] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-ikoq3mfk2b] { background: rgba(37,99,235,0.12); }
.help-steps[b-ikoq3mfk2b] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-ikoq3mfk2b] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-ikoq3mfk2b] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent, #2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; }
.help-step div[b-ikoq3mfk2b] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); padding-top: 0.1rem; }

@media (max-width: 768px) {
    .rev-mov-details[b-ikoq3mfk2b] { grid-template-columns: 1fr 1fr; }
    .rev-detail-wide[b-ikoq3mfk2b] { grid-column: span 2; }
    .rev-search-input-row[b-ikoq3mfk2b] { flex-direction: column; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_TipoCaso.razor.rz.scp.css */
/* ============================================================
   FrmAho_TipoCaso — Estilos CRUD Tipos de Caso
   Copia del patrón estándar Frmclientes.razor.css
   ============================================================ */

.crud-container[b-is1iwwp05m] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-is1iwwp05m 0.3s ease-out; }
@keyframes slideUp-b-is1iwwp05m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-is1iwwp05m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-is1iwwp05m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-is1iwwp05m] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-is1iwwp05m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-is1iwwp05m] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-is1iwwp05m] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-is1iwwp05m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-is1iwwp05m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-is1iwwp05m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-is1iwwp05m] { filter: brightness(1.1); }
.btn-outline[b-is1iwwp05m] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-is1iwwp05m] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-is1iwwp05m] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-is1iwwp05m] { filter: brightness(1.1); }
.btn-icon[b-is1iwwp05m] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-is1iwwp05m] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-is1iwwp05m] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-is1iwwp05m] { color: #ef4444; }
.btn-delete:hover[b-is1iwwp05m] { background: rgba(239, 68, 68, 0.1); }

/* Botón Ayuda */
.btn-help[b-is1iwwp05m] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-is1iwwp05m] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-is1iwwp05m] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-is1iwwp05m] { background: rgba(37,99,235,0.25); }

/* Alert */
.crud-alert[b-is1iwwp05m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-is1iwwp05m] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-is1iwwp05m] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
[data-mode="dark"] .crud-alert.success[b-is1iwwp05m] { background: rgba(6,95,70,0.15); color: #86efac; border-color: rgba(134,239,172,0.3); }
[data-mode="dark"] .crud-alert.error[b-is1iwwp05m] { background: rgba(153,27,27,0.15); color: #fca5a5; border-color: rgba(252,165,165,0.3); }
.crud-alert-close[b-is1iwwp05m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-is1iwwp05m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-is1iwwp05m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: flex; align-items: center; padding: 0.1rem; }
.crud-search-btn:hover[b-is1iwwp05m] { color: var(--rg-accent, #4f46e5); }
.crud-search-bar input[b-is1iwwp05m] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-is1iwwp05m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-is1iwwp05m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-is1iwwp05m] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-is1iwwp05m] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-is1iwwp05m] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-is1iwwp05m] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-is1iwwp05m] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-is1iwwp05m] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-is1iwwp05m] { width: 80px; text-align: center; white-space: nowrap; }

/* Icon de tipo */
.tc-icon[b-is1iwwp05m] { width: 32px; height: 32px; border-radius: 50%; background: rgba(79,70,229,0.1); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1rem; }

/* Badges */
.badge[b-is1iwwp05m] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-is1iwwp05m] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.2); }
.badge-no[b-is1iwwp05m] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-yes[b-is1iwwp05m] { color: #86efac; }
[data-mode="dark"] .badge-no[b-is1iwwp05m] { color: var(--rg-text-muted, #94a3b8); }

/* Utilities */
.font-mono[b-is1iwwp05m] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-is1iwwp05m] { text-align: center; }
.text-muted[b-is1iwwp05m] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-is1iwwp05m], .crud-empty-state[b-is1iwwp05m] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-is1iwwp05m] { font-size: 2rem; }
.crud-spinner[b-is1iwwp05m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-is1iwwp05m 0.6s linear infinite; }
@keyframes spin-b-is1iwwp05m { to { transform: rotate(360deg); } }
.spin[b-is1iwwp05m] { animation: spin-b-is1iwwp05m 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-is1iwwp05m] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-is1iwwp05m 0.15s ease-out; }
.modal-container[b-is1iwwp05m] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-is1iwwp05m] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-is1iwwp05m 0.2s ease-out; }
.modal-lg[b-is1iwwp05m] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-is1iwwp05m] { max-width: 420px; }
@keyframes fadeIn-b-is1iwwp05m { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-is1iwwp05m { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-is1iwwp05m] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-is1iwwp05m] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-is1iwwp05m] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-is1iwwp05m] { color: #dc2626; }
.modal-close[b-is1iwwp05m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-is1iwwp05m] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-is1iwwp05m] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-is1iwwp05m] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-is1iwwp05m] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-is1iwwp05m] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-is1iwwp05m] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-is1iwwp05m], .form-group select[b-is1iwwp05m], .form-textarea[b-is1iwwp05m] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-is1iwwp05m], .form-group select:focus[b-is1iwwp05m], .form-textarea:focus[b-is1iwwp05m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-textarea[b-is1iwwp05m] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-is1iwwp05m] { flex: 1; display: flex; align-items: center; }
.form-check[b-is1iwwp05m] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-is1iwwp05m] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Ayuda */
.help-icon-header[b-is1iwwp05m] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-is1iwwp05m] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-is1iwwp05m] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-is1iwwp05m] { border-bottom: none; }
.help-section p[b-is1iwwp05m] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-is1iwwp05m] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-is1iwwp05m] { color: var(--rg-accent,#2563eb); }
.help-tip[b-is1iwwp05m] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-is1iwwp05m] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-is1iwwp05m] { background: rgba(37,99,235,0.12); }
.help-steps[b-is1iwwp05m] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-is1iwwp05m] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-is1iwwp05m] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-is1iwwp05m] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-is1iwwp05m] { padding: 0.75rem; }
    .crud-header[b-is1iwwp05m] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-is1iwwp05m] { display: none; }
    .form-row[b-is1iwwp05m] { flex-direction: column; }
    .modal-dialog[b-is1iwwp05m] { width: 98%; }
    .modal-lg[b-is1iwwp05m] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_TiposOp.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-bjxz2ksrds] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bjxz2ksrds 0.3s ease-out; }
@keyframes slideUp-b-bjxz2ksrds { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bjxz2ksrds] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bjxz2ksrds] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bjxz2ksrds] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bjxz2ksrds] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bjxz2ksrds] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bjxz2ksrds] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bjxz2ksrds] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bjxz2ksrds] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bjxz2ksrds] { filter: brightness(1.1); }
.btn-outline[b-bjxz2ksrds] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bjxz2ksrds] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bjxz2ksrds] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bjxz2ksrds] { filter: brightness(1.1); }
.btn-icon[b-bjxz2ksrds] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bjxz2ksrds] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bjxz2ksrds] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bjxz2ksrds] { color: #ef4444; }
.btn-delete:hover[b-bjxz2ksrds] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-bjxz2ksrds] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-bjxz2ksrds] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-bjxz2ksrds] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bjxz2ksrds] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bjxz2ksrds] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bjxz2ksrds] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bjxz2ksrds] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bjxz2ksrds] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-bjxz2ksrds] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-bjxz2ksrds] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bjxz2ksrds] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-bjxz2ksrds] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-bjxz2ksrds] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bjxz2ksrds] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bjxz2ksrds] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bjxz2ksrds] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bjxz2ksrds] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bjxz2ksrds] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bjxz2ksrds] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-bjxz2ksrds] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-bjxz2ksrds] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-bjxz2ksrds] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bjxz2ksrds] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bjxz2ksrds] { background: #f1f5f9; color: #64748b; }
.badge-info[b-bjxz2ksrds] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-bjxz2ksrds] { background: #fffbeb; color: #92400e; }
.badge-danger[b-bjxz2ksrds] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-bjxz2ksrds] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-bjxz2ksrds] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-bjxz2ksrds] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-bjxz2ksrds] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-bjxz2ksrds] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-bjxz2ksrds] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-bjxz2ksrds] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-bjxz2ksrds] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bjxz2ksrds] { text-align: center; }
.text-muted[b-bjxz2ksrds] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bjxz2ksrds], .crud-empty-state[b-bjxz2ksrds] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bjxz2ksrds] { font-size: 2rem; }
.crud-spinner[b-bjxz2ksrds] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bjxz2ksrds 0.6s linear infinite; }
.crud-spinner-sm[b-bjxz2ksrds] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bjxz2ksrds 0.6s linear infinite; }
@keyframes spin-b-bjxz2ksrds { to { transform: rotate(360deg); } }
.spin[b-bjxz2ksrds] { animation: spin-b-bjxz2ksrds 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-bjxz2ksrds] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bjxz2ksrds 0.15s ease-out; }
.modal-container[b-bjxz2ksrds] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bjxz2ksrds] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bjxz2ksrds 0.2s ease-out; }
.modal-lg[b-bjxz2ksrds] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-bjxz2ksrds] { max-width: 420px; }
@keyframes fadeIn-b-bjxz2ksrds { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bjxz2ksrds { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bjxz2ksrds] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bjxz2ksrds] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-bjxz2ksrds] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bjxz2ksrds] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bjxz2ksrds] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bjxz2ksrds] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bjxz2ksrds] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-bjxz2ksrds] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bjxz2ksrds] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bjxz2ksrds] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bjxz2ksrds] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-bjxz2ksrds] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bjxz2ksrds] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bjxz2ksrds] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bjxz2ksrds] { flex: 2; }
.form-group label[b-bjxz2ksrds] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bjxz2ksrds], .form-group select[b-bjxz2ksrds], .form-textarea[b-bjxz2ksrds] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bjxz2ksrds], .form-group select:focus[b-bjxz2ksrds], .form-textarea:focus[b-bjxz2ksrds] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bjxz2ksrds] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bjxz2ksrds] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bjxz2ksrds] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bjxz2ksrds] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-bjxz2ksrds] { margin-top: 0; }
.form-section-title i[b-bjxz2ksrds] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-bjxz2ksrds] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-bjxz2ksrds] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-bjxz2ksrds] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-bjxz2ksrds] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-bjxz2ksrds] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-bjxz2ksrds] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-bjxz2ksrds] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-bjxz2ksrds] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bjxz2ksrds] { padding: 0.75rem; }
    .crud-header[b-bjxz2ksrds] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bjxz2ksrds] { font-size: 1.1rem; }
    .btn-text[b-bjxz2ksrds] { display: none; }
    .form-row[b-bjxz2ksrds] { flex-direction: column; }
    .form-row-3[b-bjxz2ksrds] { grid-template-columns: 1fr; }
    .form-row-4[b-bjxz2ksrds] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bjxz2ksrds] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bjxz2ksrds] { max-width: 98vw; width: 98vw; }
    .modal-body[b-bjxz2ksrds] { padding: 0.75rem; }
    .modal-tabs[b-bjxz2ksrds] { overflow-x: auto; }
    .modal-tab[b-bjxz2ksrds] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-bjxz2ksrds] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bjxz2ksrds] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bjxz2ksrds] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bjxz2ksrds] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-bjxz2ksrds] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-bjxz2ksrds] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-bjxz2ksrds] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-bjxz2ksrds] { border-bottom: none; }
.help-section p[b-bjxz2ksrds] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-bjxz2ksrds], .help-section ol[b-bjxz2ksrds] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-bjxz2ksrds] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-bjxz2ksrds] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-bjxz2ksrds] { color: var(--rg-accent,#2563eb); }
.help-tip[b-bjxz2ksrds] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-bjxz2ksrds] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-bjxz2ksrds] { background: rgba(37,99,235,0.12); }
.help-table[b-bjxz2ksrds] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-bjxz2ksrds] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-bjxz2ksrds] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-bjxz2ksrds] { background: rgba(255,255,255,0.04); }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_TransferenciaExterna.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-7mltfpuw25] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7mltfpuw25 0.3s ease-out; }
@keyframes slideUp-b-7mltfpuw25 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7mltfpuw25] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7mltfpuw25] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7mltfpuw25] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7mltfpuw25] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7mltfpuw25] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7mltfpuw25] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7mltfpuw25] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7mltfpuw25] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7mltfpuw25] { filter: brightness(1.1); }
.btn-outline[b-7mltfpuw25] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7mltfpuw25] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7mltfpuw25] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7mltfpuw25] { filter: brightness(1.1); }
.btn-icon[b-7mltfpuw25] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7mltfpuw25] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7mltfpuw25] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7mltfpuw25] { color: #ef4444; }
.btn-delete:hover[b-7mltfpuw25] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-7mltfpuw25] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-7mltfpuw25] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-7mltfpuw25] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7mltfpuw25] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7mltfpuw25] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7mltfpuw25] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7mltfpuw25] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7mltfpuw25] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-7mltfpuw25] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-7mltfpuw25] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7mltfpuw25] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-7mltfpuw25] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-7mltfpuw25] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7mltfpuw25] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7mltfpuw25] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7mltfpuw25] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7mltfpuw25] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7mltfpuw25] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7mltfpuw25] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-7mltfpuw25] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-7mltfpuw25] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-7mltfpuw25] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7mltfpuw25] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7mltfpuw25] { background: #f1f5f9; color: #64748b; }
.badge-info[b-7mltfpuw25] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-7mltfpuw25] { background: #fffbeb; color: #92400e; }
.badge-danger[b-7mltfpuw25] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-7mltfpuw25] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-7mltfpuw25] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-7mltfpuw25] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-7mltfpuw25] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-7mltfpuw25] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-7mltfpuw25] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-7mltfpuw25] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-7mltfpuw25] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7mltfpuw25] { text-align: center; }
.text-muted[b-7mltfpuw25] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7mltfpuw25], .crud-empty-state[b-7mltfpuw25] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7mltfpuw25] { font-size: 2rem; }
.crud-spinner[b-7mltfpuw25] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7mltfpuw25 0.6s linear infinite; }
.crud-spinner-sm[b-7mltfpuw25] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7mltfpuw25 0.6s linear infinite; }
@keyframes spin-b-7mltfpuw25 { to { transform: rotate(360deg); } }
.spin[b-7mltfpuw25] { animation: spin-b-7mltfpuw25 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7mltfpuw25] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7mltfpuw25 0.15s ease-out; }
.modal-container[b-7mltfpuw25] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7mltfpuw25] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7mltfpuw25 0.2s ease-out; }
.modal-lg[b-7mltfpuw25] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-7mltfpuw25] { max-width: 420px; }
@keyframes fadeIn-b-7mltfpuw25 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7mltfpuw25 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7mltfpuw25] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7mltfpuw25] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7mltfpuw25] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7mltfpuw25] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7mltfpuw25] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7mltfpuw25] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7mltfpuw25] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-7mltfpuw25] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7mltfpuw25] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7mltfpuw25] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7mltfpuw25] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-7mltfpuw25] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7mltfpuw25] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7mltfpuw25] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7mltfpuw25] { flex: 2; }
.form-group label[b-7mltfpuw25] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7mltfpuw25], .form-group select[b-7mltfpuw25], .form-textarea[b-7mltfpuw25] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7mltfpuw25], .form-group select:focus[b-7mltfpuw25], .form-textarea:focus[b-7mltfpuw25] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7mltfpuw25] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7mltfpuw25] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7mltfpuw25] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7mltfpuw25] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-7mltfpuw25] { margin-top: 0; }
.form-section-title i[b-7mltfpuw25] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-7mltfpuw25] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-7mltfpuw25] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-7mltfpuw25] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-7mltfpuw25] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-7mltfpuw25] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-7mltfpuw25] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-7mltfpuw25] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-7mltfpuw25] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7mltfpuw25] { padding: 0.75rem; }
    .crud-header[b-7mltfpuw25] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7mltfpuw25] { font-size: 1.1rem; }
    .btn-text[b-7mltfpuw25] { display: none; }
    .form-row[b-7mltfpuw25] { flex-direction: column; }
    .form-row-3[b-7mltfpuw25] { grid-template-columns: 1fr; }
    .form-row-4[b-7mltfpuw25] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7mltfpuw25] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7mltfpuw25] { max-width: 98vw; width: 98vw; }
    .modal-body[b-7mltfpuw25] { padding: 0.75rem; }
    .modal-tabs[b-7mltfpuw25] { overflow-x: auto; }
    .modal-tab[b-7mltfpuw25] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-7mltfpuw25] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7mltfpuw25] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7mltfpuw25] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7mltfpuw25] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-7mltfpuw25] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7mltfpuw25] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7mltfpuw25] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7mltfpuw25] { border-bottom: none; }
.help-section p[b-7mltfpuw25] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-7mltfpuw25], .help-section ol[b-7mltfpuw25] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-7mltfpuw25] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7mltfpuw25] { color: var(--rg-accent,#2563eb); }
.help-tip[b-7mltfpuw25] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7mltfpuw25] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7mltfpuw25] { background: rgba(37,99,235,0.12); }
.help-table[b-7mltfpuw25] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-7mltfpuw25] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-7mltfpuw25] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-7mltfpuw25] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-7mltfpuw25] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-7mltfpuw25] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-7mltfpuw25] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-7mltfpuw25] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-7mltfpuw25] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-7mltfpuw25] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-7mltfpuw25] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-7mltfpuw25] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-7mltfpuw25] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-7mltfpuw25] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-7mltfpuw25] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-7mltfpuw25] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-7mltfpuw25] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-7mltfpuw25] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-7mltfpuw25] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-7mltfpuw25] { font-size: 1.6rem; }
.pos-op-btn > div[b-7mltfpuw25] { display: flex; flex-direction: column; }
.pos-op-title[b-7mltfpuw25] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-7mltfpuw25] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-7mltfpuw25] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-7mltfpuw25] { color: var(--rg-success); }
.pos-op-ret[b-7mltfpuw25] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-7mltfpuw25] { color: var(--rg-danger); }

.pos-cuenta-search[b-7mltfpuw25] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-7mltfpuw25] { flex: 1; }

.pos-cuenta-card[b-7mltfpuw25] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-7mltfpuw25] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-7mltfpuw25] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-7mltfpuw25] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-7mltfpuw25] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-7mltfpuw25] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-7mltfpuw25], .pos-res-saldos > div[b-7mltfpuw25] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-7mltfpuw25] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-7mltfpuw25] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-7mltfpuw25] { color: var(--rg-success); }
.pos-cuenta-aviso[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-7mltfpuw25] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-7mltfpuw25] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-7mltfpuw25] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-7mltfpuw25] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-7mltfpuw25]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-7mltfpuw25] { z-index: 2001 !important; }

.badge-warn[b-7mltfpuw25] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-7mltfpuw25] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-7mltfpuw25] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-7mltfpuw25] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-7mltfpuw25] { grid-template-columns: 1fr; }
}

/* ── Transferencia externa ─────────────────────────────────────────────── */
.te-section-title[b-7mltfpuw25] { display: flex; align-items: center; gap: 0.45rem; font-weight: 700; font-size: 0.9rem;
    color: var(--rg-text-primary); margin: 1rem 0 0.6rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border); }
.te-section-title i[b-7mltfpuw25] { color: var(--rg-accent); }
.te-resumen[b-7mltfpuw25] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.75rem 1rem; margin: 0.85rem 0; }
.te-res-row[b-7mltfpuw25] { display: flex; justify-content: space-between; font-size: 0.85rem; color: var(--rg-text-secondary); padding: 0.2rem 0; }
.te-res-total[b-7mltfpuw25] { border-top: 1px dashed var(--rg-border); margin-top: 0.35rem; padding-top: 0.5rem;
    font-weight: 700; font-size: 1rem; color: var(--rg-text-primary); }
.te-tip-tran[b-7mltfpuw25] { display: flex; gap: 0.5rem; align-items: flex-start; margin-top: 0.75rem; font-size: 0.8rem;
    color: var(--rg-text-secondary); background: rgba(217,119,6,0.08); border-left: 4px solid var(--rg-warning);
    border-radius: 0 0.4rem 0.4rem 0; padding: 0.55rem 0.7rem; }
.te-tip-tran i[b-7mltfpuw25] { color: var(--rg-warning); flex-shrink: 0; margin-top: 0.1rem; }
select[b-7mltfpuw25] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; width: 100%; }
.ti-actions[b-7mltfpuw25] { display: flex; justify-content: flex-end; margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_TransferenciaInterna.razor.rz.scp.css */
/* ============================================================
   Ahorros — Estilos CRUD + Cards + Tabs + Responsive
   (copia del estándar Frmclientes.razor.css + bloque de ayuda)
   ============================================================ */

.crud-container[b-lp915m34x4] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lp915m34x4 0.3s ease-out; }
@keyframes slideUp-b-lp915m34x4 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lp915m34x4] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lp915m34x4] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lp915m34x4] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lp915m34x4] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lp915m34x4] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lp915m34x4] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lp915m34x4] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lp915m34x4] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lp915m34x4] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lp915m34x4] { filter: brightness(1.1); }
.btn-outline[b-lp915m34x4] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lp915m34x4] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lp915m34x4] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lp915m34x4] { filter: brightness(1.1); }
.btn-icon[b-lp915m34x4] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lp915m34x4] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lp915m34x4] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lp915m34x4] { color: #ef4444; }
.btn-delete:hover[b-lp915m34x4] { background: rgba(239, 68, 68, 0.1); }
.btn-view[b-lp915m34x4] { color: var(--rg-text-secondary, #475569); }
.btn-view:hover[b-lp915m34x4] { background: var(--rg-bg-hover, #f1f5f9); }
.view-toggle[b-lp915m34x4] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lp915m34x4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lp915m34x4] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lp915m34x4] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lp915m34x4] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lp915m34x4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lp915m34x4] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lp915m34x4] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-lp915m34x4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); display: inline-flex; align-items: center; }
.crud-search-clear[b-lp915m34x4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lp915m34x4] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-filter-select[b-lp915m34x4] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.3rem 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }

/* Grid */
.crud-grid-wrapper[b-lp915m34x4] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lp915m34x4] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lp915m34x4] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lp915m34x4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lp915m34x4] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lp915m34x4] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lp915m34x4] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-lp915m34x4] { text-align: right; }

/* Avatar mini */
.client-photo-sm[b-lp915m34x4] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }

/* Badges */
.badge[b-lp915m34x4] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lp915m34x4] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lp915m34x4] { background: #f1f5f9; color: #64748b; }
.badge-info[b-lp915m34x4] { background: #eff6ff; color: #1e40af; }
.badge-warn[b-lp915m34x4] { background: #fffbeb; color: #92400e; }
.badge-danger[b-lp915m34x4] { background: #fef2f2; color: #991b1b; }
.badge-gray[b-lp915m34x4] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-lp915m34x4] { background: rgba(16,185,129,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-lp915m34x4] { background: rgba(148,163,184,0.15); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-lp915m34x4] { background: rgba(37,99,235,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-warn[b-lp915m34x4] { background: rgba(217,119,6,0.18); color: #fcd34d; }
[data-mode="dark"] .badge-danger[b-lp915m34x4] { background: rgba(220,38,38,0.18); color: #fca5a5; }
[data-mode="dark"] .badge-gray[b-lp915m34x4] { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* Utilities */
.font-mono[b-lp915m34x4] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lp915m34x4] { text-align: center; }
.text-muted[b-lp915m34x4] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lp915m34x4], .crud-empty-state[b-lp915m34x4] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lp915m34x4] { font-size: 2rem; }
.crud-spinner[b-lp915m34x4] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lp915m34x4 0.6s linear infinite; }
.crud-spinner-sm[b-lp915m34x4] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lp915m34x4 0.6s linear infinite; }
@keyframes spin-b-lp915m34x4 { to { transform: rotate(360deg); } }
.spin[b-lp915m34x4] { animation: spin-b-lp915m34x4 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-lp915m34x4] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lp915m34x4 0.15s ease-out; }
.modal-container[b-lp915m34x4] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lp915m34x4] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lp915m34x4 0.2s ease-out; }
.modal-lg[b-lp915m34x4] { max-width: 880px; width: calc(100% - 2rem); }
.modal-sm[b-lp915m34x4] { max-width: 420px; }
@keyframes fadeIn-b-lp915m34x4 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lp915m34x4 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lp915m34x4] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lp915m34x4] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-lp915m34x4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lp915m34x4] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lp915m34x4] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lp915m34x4] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lp915m34x4] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.modal-tab[b-lp915m34x4] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lp915m34x4] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lp915m34x4] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lp915m34x4] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-lp915m34x4] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lp915m34x4] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lp915m34x4] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lp915m34x4] { flex: 2; }
.form-group label[b-lp915m34x4] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lp915m34x4], .form-group select[b-lp915m34x4], .form-textarea[b-lp915m34x4] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lp915m34x4], .form-group select:focus[b-lp915m34x4], .form-textarea:focus[b-lp915m34x4] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lp915m34x4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lp915m34x4] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lp915m34x4] { flex: 1; display: flex; align-items: center; padding-top: 1rem; }
.form-check[b-lp915m34x4] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lp915m34x4] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Section header dentro de modal/form */
.form-section-title[b-lp915m34x4] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.form-section-title:first-child[b-lp915m34x4] { margin-top: 0; }
.form-section-title i[b-lp915m34x4] { color: var(--rg-accent, #4f46e5); }

/* Toggle destacado */
.toggle-highlight[b-lp915m34x4] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.8rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-sidebar, #f8fafc); margin-bottom: 0.5rem; }
.toggle-highlight input[type="checkbox"][b-lp915m34x4] { width: 1.1rem; height: 1.1rem; accent-color: var(--rg-accent, #4f46e5); }
.toggle-highlight span[b-lp915m34x4] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.toggle-highlight small[b-lp915m34x4] { display: block; font-size: 0.68rem; font-weight: 400; color: var(--rg-text-muted, #94a3b8); text-transform: none; letter-spacing: normal; }

/* Big success panel (apertura) */
.success-panel[b-lp915m34x4] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 2rem; border: 1px solid #a7f3d0; background: #ecfdf5; border-radius: 0.75rem; text-align: center; margin-bottom: 1rem; }
[data-mode="dark"] .success-panel[b-lp915m34x4] { background: rgba(16,185,129,0.1); border-color: rgba(16,185,129,0.3); }
.success-panel i[b-lp915m34x4] { font-size: 2.5rem; color: #10b981; }
.success-panel .sp-label[b-lp915m34x4] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.success-panel .sp-num[b-lp915m34x4] { font-size: 1.5rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lp915m34x4] { padding: 0.75rem; }
    .crud-header[b-lp915m34x4] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lp915m34x4] { font-size: 1.1rem; }
    .btn-text[b-lp915m34x4] { display: none; }
    .form-row[b-lp915m34x4] { flex-direction: column; }
    .form-row-3[b-lp915m34x4] { grid-template-columns: 1fr; }
    .form-row-4[b-lp915m34x4] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lp915m34x4] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lp915m34x4] { max-width: 98vw; width: 98vw; }
    .modal-body[b-lp915m34x4] { padding: 0.75rem; }
    .modal-tabs[b-lp915m34x4] { overflow-x: auto; }
    .modal-tab[b-lp915m34x4] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-lp915m34x4] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lp915m34x4] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lp915m34x4] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lp915m34x4] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-lp915m34x4] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-lp915m34x4] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-lp915m34x4] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-lp915m34x4] { border-bottom: none; }
.help-section p[b-lp915m34x4] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-lp915m34x4], .help-section ol[b-lp915m34x4] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-lp915m34x4] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-lp915m34x4] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-lp915m34x4] { color: var(--rg-accent,#2563eb); }
.help-tip[b-lp915m34x4] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-lp915m34x4] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-lp915m34x4] { background: rgba(37,99,235,0.12); }
.help-table[b-lp915m34x4] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-lp915m34x4] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-lp915m34x4] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-lp915m34x4] { background: rgba(255,255,255,0.04); }

/* ── KPI cards (POS / Dashboard) ─────────────────────────────────────── */
.kpi-grid[b-lp915m34x4] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi-card[b-lp915m34x4] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.85rem 1rem; display: flex; flex-direction: column; gap: 0.2rem; }
.kpi-label[b-lp915m34x4] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.kpi-value[b-lp915m34x4] { font-size: 1.35rem; font-weight: 800; color: var(--rg-text-primary, #1e293b); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.kpi-sub[b-lp915m34x4] { font-size: 0.7rem; color: var(--rg-text-secondary, #475569); }

/* Diferencia arqueo destacada */
.diff-panel[b-lp915m34x4] { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); margin: 0.75rem 0; }
.diff-panel .diff-num[b-lp915m34x4] { font-size: 1.25rem; font-weight: 800; font-family: 'Cascadia Code', monospace; }
.diff-faltante[b-lp915m34x4] { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.diff-sobrante[b-lp915m34x4] { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.diff-cuadrada[b-lp915m34x4] { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
[data-mode="dark"] .diff-faltante[b-lp915m34x4] { background: rgba(220,38,38,.12); color: #fca5a5; }
[data-mode="dark"] .diff-sobrante[b-lp915m34x4] { background: rgba(16,185,129,.12); color: #86efac; }
[data-mode="dark"] .diff-cuadrada[b-lp915m34x4] { background: rgba(37,99,235,.12); color: #93c5fd; }

.btn-sm[b-lp915m34x4] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Operaciones POS (Fase 3) ──────────────────────────────────────────── */
.pos-ops-bar[b-lp915m34x4] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.pos-op-btn[b-lp915m34x4] { display: flex; align-items: center; gap: 0.85rem; padding: 1rem 1.25rem; border-radius: 0.75rem;
    border: 1px solid var(--rg-border); background: var(--rg-bg-card); cursor: pointer; text-align: left;
    transition: all 0.15s; color: var(--rg-text-primary); }
.pos-op-btn:hover[b-lp915m34x4] { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.pos-op-btn i[b-lp915m34x4] { font-size: 1.6rem; }
.pos-op-btn > div[b-lp915m34x4] { display: flex; flex-direction: column; }
.pos-op-title[b-lp915m34x4] { font-weight: 700; font-size: 1rem; }
.pos-op-sub[b-lp915m34x4] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-op-dep[b-lp915m34x4] { border-left: 4px solid var(--rg-success); }
.pos-op-dep i[b-lp915m34x4] { color: var(--rg-success); }
.pos-op-ret[b-lp915m34x4] { border-left: 4px solid var(--rg-danger); }
.pos-op-ret i[b-lp915m34x4] { color: var(--rg-danger); }

.pos-cuenta-search[b-lp915m34x4] { display: flex; gap: 0.5rem; align-items: stretch; }
.pos-cuenta-search input[b-lp915m34x4] { flex: 1; }

.pos-cuenta-card[b-lp915m34x4] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem;
    padding: 0.85rem 1rem; margin: 0.5rem 0 0.85rem; }
.pos-cuenta-row[b-lp915m34x4] { display: flex; align-items: center; gap: 0.65rem; }
.pos-cuenta-row > i[b-lp915m34x4] { font-size: 1.4rem; color: var(--rg-text-muted); }
.pos-cuenta-row > div[b-lp915m34x4] { display: flex; flex-direction: column; flex: 1; }
.pos-cuenta-nombre[b-lp915m34x4] { font-weight: 700; color: var(--rg-text-primary); }
.pos-cuenta-meta[b-lp915m34x4] { font-size: 0.78rem; color: var(--rg-text-secondary); }
.pos-cuenta-saldos[b-lp915m34x4] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; margin-top: 0.75rem; }
.pos-cuenta-saldos > div[b-lp915m34x4], .pos-res-saldos > div[b-lp915m34x4] { display: flex; flex-direction: column; background: var(--rg-bg-card);
    border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; }
.pos-saldo-lbl[b-lp915m34x4] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 700; }
.pos-saldo-val[b-lp915m34x4] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.pos-saldo-disp[b-lp915m34x4] { color: var(--rg-success); }
.pos-cuenta-aviso[b-lp915m34x4] { display: flex; align-items: center; gap: 0.45rem; margin-top: 0.65rem; font-size: 0.82rem;
    color: var(--rg-danger); background: rgba(220,38,38,0.07); border-radius: 0.4rem; padding: 0.5rem 0.65rem; }

.pos-res-saldos[b-lp915m34x4] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: 0.5rem; }

/* Recibo post-operación */
.ps-recibo-info[b-lp915m34x4] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-lp915m34x4] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.ps-value[b-lp915m34x4] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }

/* Modales anidados */
.modal-backdrop-nested[b-lp915m34x4]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-lp915m34x4] { z-index: 2001 !important; }

.badge-warn[b-lp915m34x4] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .badge-warn[b-lp915m34x4] { color: #fcd34d; }

@media (max-width: 640px) {
    .pos-ops-bar[b-lp915m34x4] { grid-template-columns: 1fr; }
    .pos-cuenta-saldos[b-lp915m34x4] { grid-template-columns: 1fr; }
    .pos-res-saldos[b-lp915m34x4] { grid-template-columns: 1fr; }
}

/* ── Transferencia interna ─────────────────────────────────────────────── */
.ti-grid[b-lp915m34x4] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.ti-col[b-lp915m34x4] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; padding: 1rem; }
.ti-col-title[b-lp915m34x4] { display: flex; align-items: center; gap: 0.45rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.65rem; }
.ti-col-title i[b-lp915m34x4] { color: var(--rg-accent); }
.ti-aviso[b-lp915m34x4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.85rem; border-radius: 0.5rem; font-size: 0.85rem; margin-bottom: 0.85rem; }
.ti-aviso-ok[b-lp915m34x4] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.25); }
.ti-aviso-warn[b-lp915m34x4] { background: rgba(217,119,6,0.1); color: #92400e; border: 1px solid rgba(217,119,6,0.25); }
[data-mode="dark"] .ti-aviso-ok[b-lp915m34x4] { color: #86efac; }
[data-mode="dark"] .ti-aviso-warn[b-lp915m34x4] { color: #fcd34d; }
.ti-actions[b-lp915m34x4] { display: flex; justify-content: flex-end; margin-top: 0.5rem; }

@media (max-width: 720px) { .ti-grid[b-lp915m34x4] { grid-template-columns: 1fr; } }
/* _content/Rgclouds.Web/Components/Pages/Ahorros/FrmAho_VisorEvidencias.razor.rz.scp.css */
/* ============================================================
   FrmAho_VisorEvidencias — Galería de evidencias fotográficas
   ============================================================ */

.crud-container[b-ngp01rzuok] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ngp01rzuok 0.3s ease-out; }
@keyframes slideUp-b-ngp01rzuok { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-ngp01rzuok] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ngp01rzuok] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ngp01rzuok] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ngp01rzuok] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ngp01rzuok] { display: flex; gap: 0.5rem; }

.btn-crud[b-ngp01rzuok] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ngp01rzuok] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ngp01rzuok] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ngp01rzuok] { filter: brightness(1.1); }
.btn-outline[b-ngp01rzuok] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ngp01rzuok] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ngp01rzuok] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ngp01rzuok] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ngp01rzuok] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-loading[b-ngp01rzuok], .crud-empty-state[b-ngp01rzuok] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ngp01rzuok] { font-size: 2rem; }
.crud-spinner[b-ngp01rzuok] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ngp01rzuok 0.6s linear infinite; }
@keyframes spin-b-ngp01rzuok { to { transform: rotate(360deg); } }
.spin[b-ngp01rzuok] { animation: spin-b-ngp01rzuok 0.8s linear infinite; }

.font-mono[b-ngp01rzuok] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* ── Sección de búsqueda ───────────────────────────────────── */
.ev-search-bar[b-ngp01rzuok] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1rem 1.25rem; margin-bottom: 1rem; }
.ev-select[b-ngp01rzuok] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; width: 100%; }
.form-row[b-ngp01rzuok] { display: flex; gap: 0.6rem; align-items: flex-end; }
.form-group[b-ngp01rzuok] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ngp01rzuok] { flex: 2; }
.form-group label[b-ngp01rzuok] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ngp01rzuok] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; }
.form-group input:focus[b-ngp01rzuok] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* ── Meta bar ──────────────────────────────────────────────── */
.ev-meta-bar[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.75rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle, #f8fafc); border-radius: 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); }
.ev-meta-sep[b-ngp01rzuok] { color: var(--rg-border, #e2e8f0); }

/* ── Galería responsive ────────────────────────────────────── */
.ev-gallery[b-ngp01rzuok] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.75rem; }
.ev-thumb[b-ngp01rzuok] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; overflow: hidden; cursor: pointer; transition: all 0.15s; }
.ev-thumb:hover[b-ngp01rzuok] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 4px 12px rgba(0,0,0,0.1); transform: translateY(-2px); }
.ev-thumb-img[b-ngp01rzuok] { width: 100%; height: 140px; object-fit: cover; display: block; }
.ev-thumb-placeholder[b-ngp01rzuok] { width: 100%; height: 140px; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); font-size: 2rem; }
.ev-thumb-info[b-ngp01rzuok] { padding: 0.5rem 0.6rem; }
.ev-thumb-name[b-ngp01rzuok] { display: block; font-size: 0.65rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-thumb-date[b-ngp01rzuok] { display: block; font-size: 0.6rem; color: var(--rg-text-muted, #94a3b8); margin-top: 0.1rem; }

/* ── Visor ampliado ────────────────────────────────────────── */
.ev-viewer-backdrop[b-ngp01rzuok] { position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.ev-viewer-dialog[b-ngp01rzuok] { background: var(--rg-bg-card, #1e293b); border-radius: 0.75rem; width: 95vw; max-width: 900px; max-height: 92vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 30px 80px rgba(0,0,0,0.5); }
.ev-viewer-header[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; border-bottom: 1px solid rgba(255,255,255,0.1); flex-shrink: 0; }
.ev-viewer-title[b-ngp01rzuok] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary, #f1f5f9); flex-shrink: 0; }
.ev-viewer-meta[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); flex: 1; flex-wrap: wrap; }
.ev-viewer-close[b-ngp01rzuok] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1.1rem; padding: 0.25rem; border-radius: 0.25rem; margin-left: auto; }
.ev-viewer-close:hover[b-ngp01rzuok] { color: #fff; background: rgba(255,255,255,0.1); }
.ev-viewer-body[b-ngp01rzuok] { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.ev-viewer-img[b-ngp01rzuok] { max-width: 100%; max-height: 75vh; object-fit: contain; border-radius: 0.5rem; }

/* Modal base (Ayuda) */
.modal-backdrop[b-ngp01rzuok] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ngp01rzuok] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ngp01rzuok] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-ngp01rzuok] { max-width: 880px; }
.modal-header[b-ngp01rzuok] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ngp01rzuok] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ngp01rzuok] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ngp01rzuok] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-ngp01rzuok] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-ngp01rzuok] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.btn-help[b-ngp01rzuok] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-ngp01rzuok] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-ngp01rzuok] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

.help-icon-header[b-ngp01rzuok] { color: var(--rg-accent, #2563eb); }
.help-body[b-ngp01rzuok] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-ngp01rzuok] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-ngp01rzuok] { border-bottom: none; }
.help-section p[b-ngp01rzuok] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-ngp01rzuok] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-ngp01rzuok] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-ngp01rzuok] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-ngp01rzuok] { color: var(--rg-accent, #2563eb); }
.help-tip[b-ngp01rzuok] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-ngp01rzuok] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; }
[data-mode="dark"] .help-tip[b-ngp01rzuok] { background: rgba(37,99,235,0.12); }
.help-steps[b-ngp01rzuok] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-ngp01rzuok] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-ngp01rzuok] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent, #2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; }
.help-step div[b-ngp01rzuok] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); padding-top: 0.1rem; }

@media (max-width: 768px) {
    .form-row[b-ngp01rzuok] { flex-direction: column; }
    .ev-gallery[b-ngp01rzuok] { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
    .ev-viewer-dialog[b-ngp01rzuok] { width: 99vw; max-height: 98vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Ahorros/Frmcj_cierres_consulta.razor.rz.scp.css */
.cc-container[b-jo59fsyw19] { padding:1rem 1.25rem; animation:ccUp-b-jo59fsyw19 .35s ease-out; }
@keyframes ccUp-b-jo59fsyw19 { from { opacity:0; transform:translateY(12px);} to { opacity:1; transform:none; } }

.cc-header[b-jo59fsyw19] { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; flex-wrap:wrap; }
.cc-header-left[b-jo59fsyw19] { display:flex; align-items:center; gap:.75rem; }
.cc-header-icon[b-jo59fsyw19] { font-size:1.6rem; color:var(--rg-accent,#2563eb); }
.cc-title[b-jo59fsyw19] { margin:0; font-size:1.25rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.cc-subtitle[b-jo59fsyw19] { font-size:.85rem; color:var(--rg-text-secondary,#475569); }

.cc-alert[b-jo59fsyw19] { display:flex; justify-content:space-between; align-items:center; gap:.75rem; padding:.6rem .85rem; border-radius:.5rem; margin-bottom:.85rem; font-size:.85rem; }
.cc-alert.success[b-jo59fsyw19] { background:rgba(22,163,74,.1); color:var(--rg-success,#16a34a); border:1px solid rgba(22,163,74,.3); }
.cc-alert.error[b-jo59fsyw19]   { background:rgba(220,38,38,.1); color:var(--rg-danger,#dc2626); border:1px solid rgba(220,38,38,.3); }
.cc-alert-close[b-jo59fsyw19] { background:none; border:none; cursor:pointer; color:inherit; }

.cc-filtros[b-jo59fsyw19] { display:flex; gap:.75rem; align-items:flex-end; flex-wrap:wrap; margin-bottom:1rem;
    background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem .9rem; }
.cc-field[b-jo59fsyw19] { display:flex; flex-direction:column; gap:.25rem; }
.cc-field label[b-jo59fsyw19] { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted,#94a3b8); }
.cc-field input[b-jo59fsyw19] { background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b); border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; padding:.4rem .6rem; }
.cc-btn-buscar[b-jo59fsyw19] { align-self:flex-end; }

.cc-empty[b-jo59fsyw19] { display:flex; flex-direction:column; align-items:center; gap:.6rem; padding:3rem 1rem; color:var(--rg-text-muted,#94a3b8); font-size:.9rem; }
.cc-empty i[b-jo59fsyw19] { font-size:2rem; }
.cc-spinner[b-jo59fsyw19] { width:2rem; height:2rem; border:3px solid var(--rg-border,#e2e8f0); border-top-color:var(--rg-accent,#2563eb); border-radius:50%; animation:ccSpin-b-jo59fsyw19 .7s linear infinite; }
@keyframes ccSpin-b-jo59fsyw19 { to { transform:rotate(360deg);} }
.spin[b-jo59fsyw19] { animation:ccSpin-b-jo59fsyw19 1s linear infinite; display:inline-block; }

.cc-grid-wrapper[b-jo59fsyw19] { border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; overflow:hidden; max-height:calc(100vh - 300px); overflow-y:auto; }
.cc-table[b-jo59fsyw19] { width:100%; border-collapse:collapse; font-size:.85rem; }
.cc-table thead th[b-jo59fsyw19] { position:sticky; top:0; background:var(--rg-bg-subtle,#f1f5f9); color:var(--rg-text-secondary,#475569); text-align:left; padding:.55rem .7rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.03em; border-bottom:2px solid var(--rg-border,#e2e8f0); }
.cc-table tbody td[b-jo59fsyw19] { padding:.5rem .7rem; border-bottom:1px solid var(--rg-border,#e2e8f0); color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-card,#fff); }
.cc-table tbody tr:hover td[b-jo59fsyw19] { background:var(--rg-bg-hover,#f1f5f9); }
.text-right[b-jo59fsyw19] { text-align:right; } .text-center[b-jo59fsyw19] { text-align:center; }
.font-mono[b-jo59fsyw19] { font-family:'Cascadia Code','Fira Code',monospace; }
.cc-ok[b-jo59fsyw19]  { color:var(--rg-success,#16a34a); font-weight:600; }
.cc-dif[b-jo59fsyw19] { color:var(--rg-danger,#dc2626); font-weight:600; }

.cc-act[b-jo59fsyw19] { background:none; border:1px solid var(--rg-border,#e2e8f0); border-radius:.4rem; padding:.25rem .5rem; margin:0 .1rem; cursor:pointer; color:var(--rg-accent,#2563eb); }
.cc-act:hover[b-jo59fsyw19] { background:rgba(37,99,235,.1); }

/* ── Modal (obligatorio por CSS isolation) ── */
.modal-backdrop[b-jo59fsyw19] { position:fixed; inset:0; background:rgba(0,0,0,0.4); backdrop-filter:blur(4px); z-index:1000; }
.modal-container[b-jo59fsyw19] { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1001; pointer-events:none; }
.modal-dialog[b-jo59fsyw19] { pointer-events:auto; background:var(--rg-bg-card,#fff); border-radius:.75rem; width:95%; max-width:680px; max-height:90vh; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,0.2); }
.modal-dialog.modal-sm[b-jo59fsyw19] { max-width:380px; }
.modal-header[b-jo59fsyw19] { display:flex; justify-content:space-between; align-items:center; padding:.75rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.modal-header h2[b-jo59fsyw19] { margin:0; font-size:1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); display:flex; align-items:center; gap:.5rem; }
.modal-close[b-jo59fsyw19] { background:none; border:none; cursor:pointer; color:var(--rg-text-muted,#94a3b8); font-size:1rem; padding:.25rem; border-radius:.25rem; }
.modal-close:hover[b-jo59fsyw19] { color:var(--rg-text-primary); background:var(--rg-bg-hover); }
.modal-body[b-jo59fsyw19] { padding:1rem 1.25rem; overflow-y:auto; flex:1; }
.modal-footer[b-jo59fsyw19] { display:flex; justify-content:flex-end; gap:.5rem; padding:.625rem 1.25rem; border-top:1px solid var(--rg-border,#e2e8f0); }

@media (max-width:760px){ .cc-filtros[b-jo59fsyw19] { flex-direction:column; align-items:stretch; } }
/* _content/Rgclouds.Web/Components/Pages/Alquiler/Frmalq_asignapropietariopropiedad.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h811vrwtrb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h811vrwtrb 0.3s ease-out; }
@keyframes slideUp-b-h811vrwtrb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h811vrwtrb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h811vrwtrb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h811vrwtrb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h811vrwtrb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h811vrwtrb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h811vrwtrb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h811vrwtrb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h811vrwtrb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h811vrwtrb] { filter: brightness(1.1); }
.btn-outline[b-h811vrwtrb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h811vrwtrb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h811vrwtrb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h811vrwtrb] { filter: brightness(1.1); }
.btn-icon[b-h811vrwtrb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h811vrwtrb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h811vrwtrb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h811vrwtrb] { color: #ef4444; }
.btn-delete:hover[b-h811vrwtrb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h811vrwtrb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h811vrwtrb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h811vrwtrb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h811vrwtrb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h811vrwtrb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h811vrwtrb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h811vrwtrb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h811vrwtrb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h811vrwtrb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h811vrwtrb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h811vrwtrb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h811vrwtrb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h811vrwtrb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h811vrwtrb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h811vrwtrb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h811vrwtrb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h811vrwtrb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h811vrwtrb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h811vrwtrb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h811vrwtrb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h811vrwtrb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h811vrwtrb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h811vrwtrb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h811vrwtrb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h811vrwtrb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h811vrwtrb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h811vrwtrb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h811vrwtrb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h811vrwtrb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h811vrwtrb] { display: block; }
.hide-on-cards[b-h811vrwtrb] { display: none !important; }
.show-on-cards[b-h811vrwtrb] { display: grid; }
.hide-on-grid[b-h811vrwtrb] { display: none !important; }

/* Badges */
.badge[b-h811vrwtrb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h811vrwtrb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h811vrwtrb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h811vrwtrb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h811vrwtrb] { text-align: center; }
.text-muted[b-h811vrwtrb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h811vrwtrb], .crud-empty-state[b-h811vrwtrb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h811vrwtrb] { font-size: 2rem; }
.crud-spinner[b-h811vrwtrb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h811vrwtrb 0.6s linear infinite; }
.crud-spinner-sm[b-h811vrwtrb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h811vrwtrb 0.6s linear infinite; }
@keyframes spin-b-h811vrwtrb { to { transform: rotate(360deg); } }
.spin[b-h811vrwtrb] { animation: spin-b-h811vrwtrb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h811vrwtrb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h811vrwtrb 0.15s ease-out; }
.modal-container[b-h811vrwtrb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h811vrwtrb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h811vrwtrb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h811vrwtrb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h811vrwtrb] { max-width: 420px; }
@keyframes fadeIn-b-h811vrwtrb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h811vrwtrb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h811vrwtrb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h811vrwtrb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h811vrwtrb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h811vrwtrb] { color: #dc2626; }
.modal-close[b-h811vrwtrb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h811vrwtrb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h811vrwtrb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h811vrwtrb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h811vrwtrb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h811vrwtrb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h811vrwtrb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h811vrwtrb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h811vrwtrb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h811vrwtrb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h811vrwtrb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h811vrwtrb] { flex: 2; }
.form-group label[b-h811vrwtrb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h811vrwtrb], .form-group select[b-h811vrwtrb], .form-textarea[b-h811vrwtrb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h811vrwtrb], .form-group select:focus[b-h811vrwtrb], .form-textarea:focus[b-h811vrwtrb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h811vrwtrb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h811vrwtrb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h811vrwtrb] { flex: 1; display: flex; align-items: center; }
.form-check[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h811vrwtrb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h811vrwtrb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h811vrwtrb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h811vrwtrb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h811vrwtrb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h811vrwtrb] { font-size: 3rem; }
.photo-placeholder span[b-h811vrwtrb] { font-size: 0.78rem; }
.photo-actions[b-h811vrwtrb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h811vrwtrb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h811vrwtrb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h811vrwtrb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h811vrwtrb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h811vrwtrb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h811vrwtrb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h811vrwtrb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h811vrwtrb] { filter: brightness(1.15); transform: scale(1.05); }
[b-h811vrwtrb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h811vrwtrb] { padding: 0.75rem; }
    .crud-header[b-h811vrwtrb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h811vrwtrb] { font-size: 1.1rem; }
    .btn-text[b-h811vrwtrb] { display: none; }
    .form-row[b-h811vrwtrb] { flex-direction: column; }
    .form-row-4[b-h811vrwtrb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h811vrwtrb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h811vrwtrb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h811vrwtrb] { padding: 0.75rem; }
    .modal-tabs[b-h811vrwtrb] { overflow-x: auto; }
    .modal-tab[b-h811vrwtrb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h811vrwtrb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h811vrwtrb] { display: grid !important; }
    .crud-cards-wrapper[b-h811vrwtrb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h811vrwtrb] { grid-template-columns: 1fr; }
    .card-details[b-h811vrwtrb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h811vrwtrb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h811vrwtrb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h811vrwtrb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h811vrwtrb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Alquiler/Frmalq_master.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hvkssu6uo0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hvkssu6uo0 0.3s ease-out; }
@keyframes slideUp-b-hvkssu6uo0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hvkssu6uo0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hvkssu6uo0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hvkssu6uo0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hvkssu6uo0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hvkssu6uo0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hvkssu6uo0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hvkssu6uo0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hvkssu6uo0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hvkssu6uo0] { filter: brightness(1.1); }
.btn-outline[b-hvkssu6uo0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hvkssu6uo0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hvkssu6uo0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hvkssu6uo0] { filter: brightness(1.1); }
.btn-icon[b-hvkssu6uo0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hvkssu6uo0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hvkssu6uo0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hvkssu6uo0] { color: #ef4444; }
.btn-delete:hover[b-hvkssu6uo0] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hvkssu6uo0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hvkssu6uo0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hvkssu6uo0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hvkssu6uo0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hvkssu6uo0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hvkssu6uo0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hvkssu6uo0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hvkssu6uo0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hvkssu6uo0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hvkssu6uo0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hvkssu6uo0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hvkssu6uo0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hvkssu6uo0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hvkssu6uo0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hvkssu6uo0] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hvkssu6uo0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hvkssu6uo0] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hvkssu6uo0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hvkssu6uo0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hvkssu6uo0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hvkssu6uo0] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hvkssu6uo0] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hvkssu6uo0] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hvkssu6uo0] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hvkssu6uo0] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hvkssu6uo0] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hvkssu6uo0] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hvkssu6uo0] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hvkssu6uo0] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hvkssu6uo0] { display: block; }
.hide-on-cards[b-hvkssu6uo0] { display: none !important; }
.show-on-cards[b-hvkssu6uo0] { display: grid; }
.hide-on-grid[b-hvkssu6uo0] { display: none !important; }

/* Badges */
.badge[b-hvkssu6uo0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hvkssu6uo0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hvkssu6uo0] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hvkssu6uo0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hvkssu6uo0] { text-align: center; }
.text-muted[b-hvkssu6uo0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hvkssu6uo0], .crud-empty-state[b-hvkssu6uo0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hvkssu6uo0] { font-size: 2rem; }
.crud-spinner[b-hvkssu6uo0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hvkssu6uo0 0.6s linear infinite; }
.crud-spinner-sm[b-hvkssu6uo0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hvkssu6uo0 0.6s linear infinite; }
@keyframes spin-b-hvkssu6uo0 { to { transform: rotate(360deg); } }
.spin[b-hvkssu6uo0] { animation: spin-b-hvkssu6uo0 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hvkssu6uo0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hvkssu6uo0 0.15s ease-out; }
.modal-container[b-hvkssu6uo0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hvkssu6uo0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hvkssu6uo0 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hvkssu6uo0] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hvkssu6uo0] { max-width: 420px; }
@keyframes fadeIn-b-hvkssu6uo0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hvkssu6uo0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hvkssu6uo0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hvkssu6uo0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hvkssu6uo0] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hvkssu6uo0] { color: #dc2626; }
.modal-close[b-hvkssu6uo0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hvkssu6uo0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hvkssu6uo0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hvkssu6uo0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hvkssu6uo0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hvkssu6uo0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hvkssu6uo0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hvkssu6uo0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hvkssu6uo0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hvkssu6uo0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hvkssu6uo0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hvkssu6uo0] { flex: 2; }
.form-group label[b-hvkssu6uo0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hvkssu6uo0], .form-group select[b-hvkssu6uo0], .form-textarea[b-hvkssu6uo0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hvkssu6uo0], .form-group select:focus[b-hvkssu6uo0], .form-textarea:focus[b-hvkssu6uo0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hvkssu6uo0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hvkssu6uo0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hvkssu6uo0] { flex: 1; display: flex; align-items: center; }
.form-check[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hvkssu6uo0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hvkssu6uo0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hvkssu6uo0] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hvkssu6uo0] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hvkssu6uo0] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hvkssu6uo0] { font-size: 3rem; }
.photo-placeholder span[b-hvkssu6uo0] { font-size: 0.78rem; }
.photo-actions[b-hvkssu6uo0] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hvkssu6uo0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hvkssu6uo0] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hvkssu6uo0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hvkssu6uo0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hvkssu6uo0] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hvkssu6uo0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hvkssu6uo0] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hvkssu6uo0] { filter: brightness(1.15); transform: scale(1.05); }
[b-hvkssu6uo0] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hvkssu6uo0] { padding: 0.75rem; }
    .crud-header[b-hvkssu6uo0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hvkssu6uo0] { font-size: 1.1rem; }
    .btn-text[b-hvkssu6uo0] { display: none; }
    .form-row[b-hvkssu6uo0] { flex-direction: column; }
    .form-row-4[b-hvkssu6uo0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hvkssu6uo0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hvkssu6uo0] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hvkssu6uo0] { padding: 0.75rem; }
    .modal-tabs[b-hvkssu6uo0] { overflow-x: auto; }
    .modal-tab[b-hvkssu6uo0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hvkssu6uo0] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hvkssu6uo0] { display: grid !important; }
    .crud-cards-wrapper[b-hvkssu6uo0] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hvkssu6uo0] { grid-template-columns: 1fr; }
    .card-details[b-hvkssu6uo0] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hvkssu6uo0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hvkssu6uo0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hvkssu6uo0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hvkssu6uo0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Alquiler/Frmalq_propiedades.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-jtamtiy8b5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jtamtiy8b5 0.3s ease-out; }
@keyframes slideUp-b-jtamtiy8b5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jtamtiy8b5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jtamtiy8b5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jtamtiy8b5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jtamtiy8b5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jtamtiy8b5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jtamtiy8b5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jtamtiy8b5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jtamtiy8b5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jtamtiy8b5] { filter: brightness(1.1); }
.btn-outline[b-jtamtiy8b5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jtamtiy8b5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jtamtiy8b5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jtamtiy8b5] { filter: brightness(1.1); }
.btn-icon[b-jtamtiy8b5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jtamtiy8b5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jtamtiy8b5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jtamtiy8b5] { color: #ef4444; }
.btn-delete:hover[b-jtamtiy8b5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-jtamtiy8b5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jtamtiy8b5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jtamtiy8b5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jtamtiy8b5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jtamtiy8b5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jtamtiy8b5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-jtamtiy8b5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jtamtiy8b5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-jtamtiy8b5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jtamtiy8b5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jtamtiy8b5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jtamtiy8b5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jtamtiy8b5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jtamtiy8b5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jtamtiy8b5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-jtamtiy8b5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-jtamtiy8b5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-jtamtiy8b5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-jtamtiy8b5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-jtamtiy8b5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-jtamtiy8b5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-jtamtiy8b5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-jtamtiy8b5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-jtamtiy8b5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-jtamtiy8b5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-jtamtiy8b5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-jtamtiy8b5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-jtamtiy8b5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-jtamtiy8b5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-jtamtiy8b5] { display: block; }
.hide-on-cards[b-jtamtiy8b5] { display: none !important; }
.show-on-cards[b-jtamtiy8b5] { display: grid; }
.hide-on-grid[b-jtamtiy8b5] { display: none !important; }

/* Badges */
.badge[b-jtamtiy8b5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jtamtiy8b5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jtamtiy8b5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-jtamtiy8b5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jtamtiy8b5] { text-align: center; }
.text-muted[b-jtamtiy8b5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jtamtiy8b5], .crud-empty-state[b-jtamtiy8b5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jtamtiy8b5] { font-size: 2rem; }
.crud-spinner[b-jtamtiy8b5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jtamtiy8b5 0.6s linear infinite; }
.crud-spinner-sm[b-jtamtiy8b5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jtamtiy8b5 0.6s linear infinite; }
@keyframes spin-b-jtamtiy8b5 { to { transform: rotate(360deg); } }
.spin[b-jtamtiy8b5] { animation: spin-b-jtamtiy8b5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-jtamtiy8b5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jtamtiy8b5 0.15s ease-out; }
.modal-container[b-jtamtiy8b5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jtamtiy8b5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jtamtiy8b5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-jtamtiy8b5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-jtamtiy8b5] { max-width: 420px; }
@keyframes fadeIn-b-jtamtiy8b5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jtamtiy8b5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jtamtiy8b5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jtamtiy8b5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-jtamtiy8b5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-jtamtiy8b5] { color: #dc2626; }
.modal-close[b-jtamtiy8b5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jtamtiy8b5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jtamtiy8b5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jtamtiy8b5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jtamtiy8b5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-jtamtiy8b5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jtamtiy8b5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jtamtiy8b5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jtamtiy8b5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jtamtiy8b5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jtamtiy8b5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jtamtiy8b5] { flex: 2; }
.form-group label[b-jtamtiy8b5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jtamtiy8b5], .form-group select[b-jtamtiy8b5], .form-textarea[b-jtamtiy8b5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jtamtiy8b5], .form-group select:focus[b-jtamtiy8b5], .form-textarea:focus[b-jtamtiy8b5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jtamtiy8b5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jtamtiy8b5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jtamtiy8b5] { flex: 1; display: flex; align-items: center; }
.form-check[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jtamtiy8b5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-jtamtiy8b5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-jtamtiy8b5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-jtamtiy8b5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-jtamtiy8b5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-jtamtiy8b5] { font-size: 3rem; }
.photo-placeholder span[b-jtamtiy8b5] { font-size: 0.78rem; }
.photo-actions[b-jtamtiy8b5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-jtamtiy8b5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-jtamtiy8b5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-jtamtiy8b5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-jtamtiy8b5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-jtamtiy8b5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-jtamtiy8b5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-jtamtiy8b5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-jtamtiy8b5] { filter: brightness(1.15); transform: scale(1.05); }
[b-jtamtiy8b5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jtamtiy8b5] { padding: 0.75rem; }
    .crud-header[b-jtamtiy8b5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jtamtiy8b5] { font-size: 1.1rem; }
    .btn-text[b-jtamtiy8b5] { display: none; }
    .form-row[b-jtamtiy8b5] { flex-direction: column; }
    .form-row-4[b-jtamtiy8b5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jtamtiy8b5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jtamtiy8b5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-jtamtiy8b5] { padding: 0.75rem; }
    .modal-tabs[b-jtamtiy8b5] { overflow-x: auto; }
    .modal-tab[b-jtamtiy8b5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-jtamtiy8b5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-jtamtiy8b5] { display: grid !important; }
    .crud-cards-wrapper[b-jtamtiy8b5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-jtamtiy8b5] { grid-template-columns: 1fr; }
    .card-details[b-jtamtiy8b5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-jtamtiy8b5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jtamtiy8b5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jtamtiy8b5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jtamtiy8b5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Alquiler/Frmalq_registracontrato.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7aj31eryu8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7aj31eryu8 0.3s ease-out; }
@keyframes slideUp-b-7aj31eryu8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7aj31eryu8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7aj31eryu8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7aj31eryu8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7aj31eryu8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7aj31eryu8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7aj31eryu8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7aj31eryu8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7aj31eryu8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7aj31eryu8] { filter: brightness(1.1); }
.btn-outline[b-7aj31eryu8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7aj31eryu8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7aj31eryu8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7aj31eryu8] { filter: brightness(1.1); }
.btn-icon[b-7aj31eryu8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7aj31eryu8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7aj31eryu8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7aj31eryu8] { color: #ef4444; }
.btn-delete:hover[b-7aj31eryu8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7aj31eryu8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7aj31eryu8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7aj31eryu8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7aj31eryu8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7aj31eryu8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7aj31eryu8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7aj31eryu8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7aj31eryu8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7aj31eryu8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7aj31eryu8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7aj31eryu8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7aj31eryu8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7aj31eryu8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7aj31eryu8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7aj31eryu8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7aj31eryu8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7aj31eryu8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7aj31eryu8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7aj31eryu8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7aj31eryu8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7aj31eryu8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7aj31eryu8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7aj31eryu8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7aj31eryu8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7aj31eryu8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7aj31eryu8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7aj31eryu8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7aj31eryu8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7aj31eryu8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7aj31eryu8] { display: block; }
.hide-on-cards[b-7aj31eryu8] { display: none !important; }
.show-on-cards[b-7aj31eryu8] { display: grid; }
.hide-on-grid[b-7aj31eryu8] { display: none !important; }

/* Badges */
.badge[b-7aj31eryu8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7aj31eryu8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7aj31eryu8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7aj31eryu8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7aj31eryu8] { text-align: center; }
.text-muted[b-7aj31eryu8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7aj31eryu8], .crud-empty-state[b-7aj31eryu8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7aj31eryu8] { font-size: 2rem; }
.crud-spinner[b-7aj31eryu8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7aj31eryu8 0.6s linear infinite; }
.crud-spinner-sm[b-7aj31eryu8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7aj31eryu8 0.6s linear infinite; }
@keyframes spin-b-7aj31eryu8 { to { transform: rotate(360deg); } }
.spin[b-7aj31eryu8] { animation: spin-b-7aj31eryu8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7aj31eryu8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7aj31eryu8 0.15s ease-out; }
.modal-container[b-7aj31eryu8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7aj31eryu8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7aj31eryu8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7aj31eryu8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7aj31eryu8] { max-width: 420px; }
@keyframes fadeIn-b-7aj31eryu8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7aj31eryu8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7aj31eryu8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7aj31eryu8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7aj31eryu8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7aj31eryu8] { color: #dc2626; }
.modal-close[b-7aj31eryu8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7aj31eryu8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7aj31eryu8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7aj31eryu8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7aj31eryu8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7aj31eryu8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7aj31eryu8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7aj31eryu8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7aj31eryu8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7aj31eryu8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7aj31eryu8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7aj31eryu8] { flex: 2; }
.form-group label[b-7aj31eryu8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7aj31eryu8], .form-group select[b-7aj31eryu8], .form-textarea[b-7aj31eryu8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7aj31eryu8], .form-group select:focus[b-7aj31eryu8], .form-textarea:focus[b-7aj31eryu8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7aj31eryu8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7aj31eryu8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7aj31eryu8] { flex: 1; display: flex; align-items: center; }
.form-check[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7aj31eryu8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7aj31eryu8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7aj31eryu8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7aj31eryu8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7aj31eryu8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7aj31eryu8] { font-size: 3rem; }
.photo-placeholder span[b-7aj31eryu8] { font-size: 0.78rem; }
.photo-actions[b-7aj31eryu8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7aj31eryu8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7aj31eryu8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7aj31eryu8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7aj31eryu8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7aj31eryu8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7aj31eryu8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7aj31eryu8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7aj31eryu8] { filter: brightness(1.15); transform: scale(1.05); }
[b-7aj31eryu8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7aj31eryu8] { padding: 0.75rem; }
    .crud-header[b-7aj31eryu8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7aj31eryu8] { font-size: 1.1rem; }
    .btn-text[b-7aj31eryu8] { display: none; }
    .form-row[b-7aj31eryu8] { flex-direction: column; }
    .form-row-4[b-7aj31eryu8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7aj31eryu8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7aj31eryu8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7aj31eryu8] { padding: 0.75rem; }
    .modal-tabs[b-7aj31eryu8] { overflow-x: auto; }
    .modal-tab[b-7aj31eryu8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7aj31eryu8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7aj31eryu8] { display: grid !important; }
    .crud-cards-wrapper[b-7aj31eryu8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7aj31eryu8] { grid-template-columns: 1fr; }
    .card-details[b-7aj31eryu8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7aj31eryu8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7aj31eryu8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7aj31eryu8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7aj31eryu8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Auditoria/AuditViewer.razor.rz.scp.css */
/* ============================================================
   AuditViewer.razor.css — Visor de auditoria + logs + resumen
   ✅ Usa SOLO tokens --rg-* (dark mode automatico)
   ✅ Sigue el patron de Frmclientes.razor.css
   ============================================================ */

/* ── Base CRUD (scoped — copiado del design system) ──── */
.crud-container[b-c9belvm8fx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c9belvm8fx 0.3s ease-out; }
@keyframes slideUp-b-c9belvm8fx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-c9belvm8fx] { animation: slideUp-b-c9belvm8fx 0.3s ease-out; }

.crud-header[b-c9belvm8fx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c9belvm8fx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c9belvm8fx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c9belvm8fx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c9belvm8fx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c9belvm8fx] { display: flex; gap: 0.5rem; }

.btn-crud[b-c9belvm8fx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c9belvm8fx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c9belvm8fx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c9belvm8fx] { filter: brightness(1.1); }
.btn-outline[b-c9belvm8fx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c9belvm8fx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-c9belvm8fx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-c9belvm8fx] { filter: brightness(1.1); }

.crud-alert[b-c9belvm8fx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c9belvm8fx] { background: rgba(34, 197, 94, 0.1); color: #065f46; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-c9belvm8fx] { background: rgba(239, 68, 68, 0.1); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-c9belvm8fx] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-c9belvm8fx] { color: #fca5a5; }
.crud-alert-close[b-c9belvm8fx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-grid-wrapper[b-c9belvm8fx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-c9belvm8fx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c9belvm8fx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c9belvm8fx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-c9belvm8fx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c9belvm8fx] { background: var(--rg-bg-hover, #f8fafc); }

.crud-tabs[b-c9belvm8fx] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; overflow-x: auto; }
.crud-tab[b-c9belvm8fx] { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.65rem 1.1rem; border: none; background: transparent; color: var(--rg-text-secondary, #475569); font-size: 0.82rem; font-weight: 600; cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -2px; transition: all 0.15s; white-space: nowrap; }
.crud-tab:hover[b-c9belvm8fx] { color: var(--rg-accent, #4f46e5); background: var(--rg-bg-hover, #f8fafc); }
.crud-tab.active[b-c9belvm8fx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }
.crud-tab i[b-c9belvm8fx] { font-size: 1rem; }
.crud-tab-badge[b-c9belvm8fx] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.25rem; padding: 0 0.4rem; border-radius: 999px; background: var(--rg-border-light, #f1f5f9); color: var(--rg-text-secondary, #475569); font-size: 0.68rem; font-weight: 700; }
.crud-tab.active .crud-tab-badge[b-c9belvm8fx] { background: var(--rg-accent, #4f46e5); color: #fff; }

.font-mono[b-c9belvm8fx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.crud-loading[b-c9belvm8fx], .crud-empty-state[b-c9belvm8fx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c9belvm8fx] { font-size: 2rem; }
.crud-spinner[b-c9belvm8fx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-c9belvm8fx 0.6s linear infinite; }
@keyframes spin-b-c9belvm8fx { to { transform: rotate(360deg); } }
.spin[b-c9belvm8fx] { animation: spin-b-c9belvm8fx 0.8s linear infinite; }

@media (max-width: 768px) {
    .crud-container[b-c9belvm8fx] { padding: 0.75rem; }
    .crud-header[b-c9belvm8fx] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-c9belvm8fx] { display: none; }
}

/* ── Barra de contexto (Empresa / Sucursal / BD) ────── */
.audit-context-bar[b-c9belvm8fx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

.audit-context-item[b-c9belvm8fx] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.audit-context-item i[b-c9belvm8fx] {
    color: var(--rg-accent, #4f46e5);
    font-size: 0.9rem;
}

.audit-context-label[b-c9belvm8fx] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted, #94a3b8);
}

.audit-context-value[b-c9belvm8fx] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}

.audit-context-sep[b-c9belvm8fx] {
    width: 1px;
    height: 1.25rem;
    background: var(--rg-border, #e2e8f0);
}

@media (max-width: 640px) {
    .audit-context-bar[b-c9belvm8fx] { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
    .audit-context-sep[b-c9belvm8fx] { display: none; }
}

/* ── Filtros ─────────────────────────────────────────── */
.audit-filters[b-c9belvm8fx] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-end;
    padding: 0.75rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #eef0f4);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
}

.audit-filter[b-c9belvm8fx] {
    display: flex;
    flex-direction: column;
    min-width: 130px;
}

.audit-filter-wide[b-c9belvm8fx] {
    flex: 1;
    min-width: 200px;
}

.audit-filter label[b-c9belvm8fx] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--rg-text-muted, #64748b);
    margin-bottom: 4px;
}

.audit-filter input[b-c9belvm8fx],
.audit-filter select[b-c9belvm8fx] {
    padding: 0.4rem 0.5rem;
    border: 1px solid var(--rg-border, #eef0f4);
    border-radius: 0.375rem;
    font-size: 0.82rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
}

.audit-filter input:focus[b-c9belvm8fx],
.audit-filter select:focus[b-c9belvm8fx] {
    outline: none;
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(var(--rg-primary-rgb, 79 70 229) / 0.15);
}

/* ── Filtros rapidos ─────────────────────────────────── */
.audit-quick-filters[b-c9belvm8fx] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-bottom: 0.75rem;
}

.audit-quick[b-c9belvm8fx] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--rg-border, #eef0f4);
    background: var(--rg-bg-card, #ffffff);
    color: var(--rg-text-secondary, #475569);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.audit-quick:hover[b-c9belvm8fx] {
    border-color: var(--rg-accent, #4f46e5);
    color: var(--rg-accent, #4f46e5);
    background: var(--rg-bg-hover, #f8fafc);
}

.audit-quick.active[b-c9belvm8fx] {
    background: var(--rg-accent, #4f46e5);
    border-color: var(--rg-accent, #4f46e5);
    color: #ffffff;
}

.audit-quick-danger[b-c9belvm8fx] {
    border-color: rgba(239, 68, 68, 0.4);
    color: #dc2626;
}

.audit-quick-danger:hover[b-c9belvm8fx] {
    background: rgba(239, 68, 68, 0.06);
    border-color: #ef4444;
    color: #b91c1c;
}

.audit-quick-danger.active[b-c9belvm8fx] {
    background: #dc2626;
    border-color: #dc2626;
    color: #ffffff;
}

[data-mode="dark"] .audit-quick-danger[b-c9belvm8fx] {
    color: #fca5a5;
    border-color: rgba(220, 38, 38, 0.5);
}

[data-mode="dark"] .audit-quick-danger:hover[b-c9belvm8fx] {
    background: rgba(220, 38, 38, 0.12);
}

/* ── Tabla: valores truncados ────────────────────────── */
.audit-val[b-c9belvm8fx] {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.76rem;
}

/* ── Accion badges ───────────────────────────────────── */
.audit-accion[b-c9belvm8fx] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.audit-accion-insert[b-c9belvm8fx] { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.audit-accion-update[b-c9belvm8fx] { background: rgba(59, 130, 246, 0.15); color: #2563eb; }
.audit-accion-delete[b-c9belvm8fx] { background: rgba(239, 68, 68, 0.15); color: #dc2626; }
.audit-accion-error[b-c9belvm8fx]  { background: rgba(239, 68, 68, 0.15); color: #dc2626; border: 1px solid rgba(239, 68, 68, 0.3); }
.audit-accion-ok[b-c9belvm8fx]     { background: rgba(34, 197, 94, 0.15); color: #16a34a; }

[data-mode="dark"] .audit-accion-insert[b-c9belvm8fx] { background: rgba(34, 197, 94, 0.18); color: #86efac; }
[data-mode="dark"] .audit-accion-update[b-c9belvm8fx] { background: rgba(59, 130, 246, 0.18); color: #93c5fd; }
[data-mode="dark"] .audit-accion-delete[b-c9belvm8fx] { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }
[data-mode="dark"] .audit-accion-error[b-c9belvm8fx]  { background: rgba(220, 38, 38, 0.22); color: #fecaca; border-color: rgba(220, 38, 38, 0.5); }
[data-mode="dark"] .audit-accion-ok[b-c9belvm8fx]     { background: rgba(34, 197, 94, 0.18); color: #bbf7d0; }

/* ── 🔴 Filas de error ──────────────────────────────── */
.audit-table tbody tr.audit-row-error td[b-c9belvm8fx] {
    background: rgba(239, 68, 68, 0.06);
}

.audit-table tbody tr.audit-row-error:hover td[b-c9belvm8fx] {
    background: rgba(239, 68, 68, 0.12);
}

.audit-table tbody tr.audit-row-error td:first-child[b-c9belvm8fx] {
    box-shadow: inset 3px 0 0 0 #dc2626;
}

[data-mode="dark"] .audit-table tbody tr.audit-row-error td[b-c9belvm8fx] {
    background: rgba(220, 38, 38, 0.12);
}

[data-mode="dark"] .audit-table tbody tr.audit-row-error:hover td[b-c9belvm8fx] {
    background: rgba(220, 38, 38, 0.22);
}

/* ── Paginacion ──────────────────────────────────────── */
.audit-pager[b-c9belvm8fx] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0.75rem;
    color: var(--rg-text-muted, #64748b);
    font-size: 0.82rem;
}

/* ── Detalle inline (expand de fila) ─────────────────── */
.audit-row[b-c9belvm8fx] { cursor: pointer; }

.audit-row-detail > td[b-c9belvm8fx] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    padding: 1rem 1.25rem;
    border-bottom: 2px solid var(--rg-border, #eef0f4);
}

[data-mode="dark"] .audit-row-detail > td[b-c9belvm8fx] {
    background: #0d1117;
    color: #e5e7eb;
}

.audit-row-detail-error > td[b-c9belvm8fx] {
    border-left: 4px solid #dc2626;
}

[data-mode="dark"] .audit-row-detail-error > td[b-c9belvm8fx] {
    background: #120808;
}

.audit-detail-inline[b-c9belvm8fx] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.audit-detail-grid[b-c9belvm8fx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.625rem 1.25rem;
}

.audit-detail-grid > div[b-c9belvm8fx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.audit-detail-grid label[b-c9belvm8fx] {
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted, #64748b);
}

.audit-detail-grid span[b-c9belvm8fx] {
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
    word-break: break-word;
}

[data-mode="dark"] .audit-detail-grid label[b-c9belvm8fx] { color: #64748b; }
[data-mode="dark"] .audit-detail-grid span[b-c9belvm8fx]  { color: #e5e7eb; }

.audit-detail-section label[b-c9belvm8fx] {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted, #64748b);
    margin-bottom: 0.375rem;
}

[data-mode="dark"] .audit-detail-section label[b-c9belvm8fx] { color: #64748b; }

/* ── JSON blocks (audit + logs) ──────────────────────── */
.audit-json[b-c9belvm8fx] {
    margin: 0;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    padding: 0.625rem 0.75rem;
    border-radius: 0.375rem;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.76rem;
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--rg-border, #eef0f4);
}

[data-mode="dark"] .audit-json[b-c9belvm8fx] {
    background: rgba(0, 0, 0, 0.4);
    color: #93c5fd;
    border-color: rgba(255, 255, 255, 0.08);
}

.audit-json.audit-json-replay[b-c9belvm8fx] {
    border-left: 3px solid #10b981;
}

[data-mode="dark"] .audit-json.audit-json-replay[b-c9belvm8fx] {
    color: #6ee7b7;
    border-color: rgba(52, 211, 153, 0.5);
}

.audit-json.audit-json-error[b-c9belvm8fx] {
    border-left: 3px solid #dc2626;
}

[data-mode="dark"] .audit-json.audit-json-error[b-c9belvm8fx] {
    background: rgba(220, 38, 38, 0.1);
    color: #fecaca;
}

/* ── Logs ────────────────────────────────────────────── */
.log-row[b-c9belvm8fx] { cursor: pointer; }

.log-row-detail > td[b-c9belvm8fx] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    padding: 0.75rem 1rem;
}

[data-mode="dark"] .log-row-detail > td[b-c9belvm8fx] {
    background: #0d1117;
    color: #e5e7eb;
}

.log-json[b-c9belvm8fx] {
    margin: 0;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.76rem;
    white-space: pre-wrap;
    word-break: break-all;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #ffffff);
    padding: 0.625rem 0.75rem;
    border-radius: 0.375rem;
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--rg-border, #eef0f4);
}

[data-mode="dark"] .log-json[b-c9belvm8fx] {
    background: rgba(0, 0, 0, 0.4);
    color: #93c5fd;
    border-color: rgba(255, 255, 255, 0.08);
}

.log-mensaje[b-c9belvm8fx] {
    white-space: pre-wrap;
    word-break: break-word;
}

[data-mode="dark"] .log-mensaje[b-c9belvm8fx] { color: #fde68a; }

.log-detail-inline[b-c9belvm8fx] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.log-detail-meta[b-c9belvm8fx] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
}

.log-detail-meta strong[b-c9belvm8fx] {
    font-weight: 600;
    color: var(--rg-text-muted, #64748b);
}

.log-detail-section label[b-c9belvm8fx] {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted, #64748b);
    margin-bottom: 0.375rem;
}

.log-level[b-c9belvm8fx] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.log-level-leve[b-c9belvm8fx]        { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); }
.log-level-alto[b-c9belvm8fx]        { background: rgba(245, 158, 11, 0.15); color: #d97706; }
.log-level-prioritario[b-c9belvm8fx] { background: rgba(239, 68, 68, 0.15); color: #dc2626; }

[data-mode="dark"] .log-level-leve[b-c9belvm8fx]        { background: rgba(148, 163, 184, 0.12); color: #94a3b8; }
[data-mode="dark"] .log-level-alto[b-c9belvm8fx]        { background: rgba(245, 158, 11, 0.18); color: #fbbf24; }
[data-mode="dark"] .log-level-prioritario[b-c9belvm8fx] { background: rgba(239, 68, 68, 0.18); color: #fca5a5; }

.log-app[b-c9belvm8fx] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.log-app-api[b-c9belvm8fx] { background: rgba(139, 92, 246, 0.12); color: #7c3aed; }
.log-app-web[b-c9belvm8fx] { background: rgba(6, 182, 212, 0.12); color: #0891b2; }

[data-mode="dark"] .log-app-api[b-c9belvm8fx] { background: rgba(139, 92, 246, 0.18); color: #c4b5fd; }
[data-mode="dark"] .log-app-web[b-c9belvm8fx] { background: rgba(6, 182, 212, 0.18); color: #67e8f9; }

/* ── Resumen (dashboard cards) ───────────────────────── */
.audit-summary[b-c9belvm8fx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 0.875rem;
}

.audit-card[b-c9belvm8fx] {
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #eef0f4);
    border-radius: 0.625rem;
    overflow: hidden;
    box-shadow: var(--rg-shadow-sm, 0 1px 3px rgba(0,0,0,0.04));
}

.audit-card-head[b-c9belvm8fx] {
    padding: 0.625rem 0.875rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border-bottom: 1px solid var(--rg-border, #eef0f4);
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.audit-card-body[b-c9belvm8fx] { padding: 0.875rem; }

.audit-card-empty[b-c9belvm8fx] {
    color: var(--rg-text-muted, #64748b);
    font-style: italic;
    text-align: center;
    padding: 1.25rem 0;
}

.audit-big-num[b-c9belvm8fx] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--rg-accent, #4f46e5);
    line-height: 1;
}

.audit-small-muted[b-c9belvm8fx] {
    font-size: 0.76rem;
    color: var(--rg-text-muted, #64748b);
    margin-top: 4px;
}

.audit-rank[b-c9belvm8fx] {
    display: flex;
    justify-content: space-between;
    padding: 0.375rem 0;
    border-bottom: 1px dashed var(--rg-border-light, #f1f5f9);
    font-size: 0.82rem;
}

.audit-rank:last-child[b-c9belvm8fx] { border-bottom: none; }

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 768px) {
    .audit-filters[b-c9belvm8fx] {
        flex-direction: column;
        align-items: stretch;
    }

    .audit-filter[b-c9belvm8fx],
    .audit-filter-wide[b-c9belvm8fx] {
        min-width: 0;
    }

    .audit-quick-filters[b-c9belvm8fx] {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .audit-summary[b-c9belvm8fx] {
        grid-template-columns: 1fr;
    }

    .audit-detail-grid[b-c9belvm8fx] {
        grid-template-columns: 1fr;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Caja/Dasdsad.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ns74w4fdpd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ns74w4fdpd 0.3s ease-out; }
@keyframes slideUp-b-ns74w4fdpd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ns74w4fdpd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ns74w4fdpd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ns74w4fdpd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ns74w4fdpd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ns74w4fdpd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ns74w4fdpd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ns74w4fdpd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ns74w4fdpd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ns74w4fdpd] { filter: brightness(1.1); }
.btn-outline[b-ns74w4fdpd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ns74w4fdpd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ns74w4fdpd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ns74w4fdpd] { filter: brightness(1.1); }
.btn-icon[b-ns74w4fdpd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ns74w4fdpd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ns74w4fdpd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ns74w4fdpd] { color: #ef4444; }
.btn-delete:hover[b-ns74w4fdpd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ns74w4fdpd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ns74w4fdpd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ns74w4fdpd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ns74w4fdpd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ns74w4fdpd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ns74w4fdpd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ns74w4fdpd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ns74w4fdpd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ns74w4fdpd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ns74w4fdpd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ns74w4fdpd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ns74w4fdpd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ns74w4fdpd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ns74w4fdpd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ns74w4fdpd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ns74w4fdpd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ns74w4fdpd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ns74w4fdpd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ns74w4fdpd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ns74w4fdpd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ns74w4fdpd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ns74w4fdpd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ns74w4fdpd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ns74w4fdpd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ns74w4fdpd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ns74w4fdpd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ns74w4fdpd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ns74w4fdpd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ns74w4fdpd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ns74w4fdpd] { display: block; }
.hide-on-cards[b-ns74w4fdpd] { display: none !important; }
.show-on-cards[b-ns74w4fdpd] { display: grid; }
.hide-on-grid[b-ns74w4fdpd] { display: none !important; }

/* Badges */
.badge[b-ns74w4fdpd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ns74w4fdpd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ns74w4fdpd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ns74w4fdpd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ns74w4fdpd] { text-align: center; }
.text-muted[b-ns74w4fdpd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ns74w4fdpd], .crud-empty-state[b-ns74w4fdpd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ns74w4fdpd] { font-size: 2rem; }
.crud-spinner[b-ns74w4fdpd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ns74w4fdpd 0.6s linear infinite; }
.crud-spinner-sm[b-ns74w4fdpd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ns74w4fdpd 0.6s linear infinite; }
@keyframes spin-b-ns74w4fdpd { to { transform: rotate(360deg); } }
.spin[b-ns74w4fdpd] { animation: spin-b-ns74w4fdpd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ns74w4fdpd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ns74w4fdpd 0.15s ease-out; }
.modal-container[b-ns74w4fdpd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ns74w4fdpd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ns74w4fdpd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ns74w4fdpd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ns74w4fdpd] { max-width: 420px; }
@keyframes fadeIn-b-ns74w4fdpd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ns74w4fdpd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ns74w4fdpd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ns74w4fdpd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ns74w4fdpd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ns74w4fdpd] { color: #dc2626; }
.modal-close[b-ns74w4fdpd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ns74w4fdpd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ns74w4fdpd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ns74w4fdpd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ns74w4fdpd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ns74w4fdpd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ns74w4fdpd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ns74w4fdpd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ns74w4fdpd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ns74w4fdpd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ns74w4fdpd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ns74w4fdpd] { flex: 2; }
.form-group label[b-ns74w4fdpd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ns74w4fdpd], .form-group select[b-ns74w4fdpd], .form-textarea[b-ns74w4fdpd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ns74w4fdpd], .form-group select:focus[b-ns74w4fdpd], .form-textarea:focus[b-ns74w4fdpd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ns74w4fdpd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ns74w4fdpd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ns74w4fdpd] { flex: 1; display: flex; align-items: center; }
.form-check[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ns74w4fdpd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ns74w4fdpd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ns74w4fdpd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ns74w4fdpd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ns74w4fdpd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ns74w4fdpd] { font-size: 3rem; }
.photo-placeholder span[b-ns74w4fdpd] { font-size: 0.78rem; }
.photo-actions[b-ns74w4fdpd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ns74w4fdpd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ns74w4fdpd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ns74w4fdpd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ns74w4fdpd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ns74w4fdpd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ns74w4fdpd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ns74w4fdpd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ns74w4fdpd] { filter: brightness(1.15); transform: scale(1.05); }
[b-ns74w4fdpd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ns74w4fdpd] { padding: 0.75rem; }
    .crud-header[b-ns74w4fdpd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ns74w4fdpd] { font-size: 1.1rem; }
    .btn-text[b-ns74w4fdpd] { display: none; }
    .form-row[b-ns74w4fdpd] { flex-direction: column; }
    .form-row-4[b-ns74w4fdpd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ns74w4fdpd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ns74w4fdpd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ns74w4fdpd] { padding: 0.75rem; }
    .modal-tabs[b-ns74w4fdpd] { overflow-x: auto; }
    .modal-tab[b-ns74w4fdpd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ns74w4fdpd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ns74w4fdpd] { display: grid !important; }
    .crud-cards-wrapper[b-ns74w4fdpd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ns74w4fdpd] { grid-template-columns: 1fr; }
    .card-details[b-ns74w4fdpd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ns74w4fdpd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ns74w4fdpd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ns74w4fdpd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ns74w4fdpd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Caja/Frmcaja.razor.rz.scp.css */
/* ============================================================
   Frmcaja.razor.css — Caja Préstamos
   Incluye: estilos CRUD estándar + estilos específicos de caja
   ============================================================ */

/* ── Animación / Container ─────────────────────────────────── */
.crud-container[b-0grflv020j] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0grflv020j 0.3s ease-out; }
@keyframes slideUp-b-0grflv020j { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ────────────────────────────────────────────────── */
.crud-header[b-0grflv020j] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0grflv020j] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0grflv020j] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-0grflv020j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-0grflv020j] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-0grflv020j] { display: flex; gap: 0.5rem; }

/* ── Botones estándar ──────────────────────────────────────── */
.btn-crud[b-0grflv020j] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0grflv020j] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0grflv020j] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0grflv020j] { filter: brightness(1.1); }
.btn-outline[b-0grflv020j] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-0grflv020j] { background: var(--rg-bg-hover); }
.btn-danger[b-0grflv020j]  { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0grflv020j] { filter: brightness(1.1); }

/* ── Alert flash ───────────────────────────────────────────── */
.crud-alert[b-0grflv020j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0grflv020j] { background: rgba(22,163,74,0.1); color: #065f46; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-0grflv020j]   { background: rgba(239,68,68,0.1); color: #991b1b;  border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-0grflv020j] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-0grflv020j]   { color: #fca5a5; }
.crud-alert-close[b-0grflv020j] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── Búsqueda ──────────────────────────────────────────────── */
.caja-search-wrapper[b-0grflv020j] { position: relative; margin-bottom: 1rem; }
.crud-search-bar[b-0grflv020j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-bar i[b-0grflv020j] { color: var(--rg-text-muted); }
.crud-search-bar input[b-0grflv020j] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-0grflv020j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.caja-spinner-sm[b-0grflv020j] { color: var(--rg-text-muted); }

/* ── Dropdown resultados ───────────────────────────────────── */
.caja-resultados[b-0grflv020j] { position: absolute; top: 100%; left: 0; right: 0; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0 0 0.5rem 0.5rem; z-index: 500; box-shadow: 0 8px 24px rgba(0,0,0,0.12); max-height: 320px; overflow-y: auto; }
.caja-resultado-item[b-0grflv020j] { display: block; width: 100%; text-align: left; padding: 0.6rem 0.875rem; background: none; border: none; border-bottom: 1px solid var(--rg-border); cursor: pointer; color: var(--rg-text-primary); transition: background 0.1s; }
.caja-resultado-item:hover[b-0grflv020j] { background: var(--rg-bg-hover); }
.res-top[b-0grflv020j] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 600; }
.res-nombre[b-0grflv020j] { color: var(--rg-text-secondary); }
.res-sub[b-0grflv020j] { font-size: 0.72rem; color: var(--rg-text-muted); margin-top: 0.15rem; }
.caja-resultados-close[b-0grflv020j] { display: block; width: 100%; padding: 0.4rem; text-align: center; font-size: 0.72rem; background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }

/* ── Empty state ───────────────────────────────────────────── */
.caja-empty-state[b-0grflv020j] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; gap: 0.75rem; color: var(--rg-text-muted); }
.caja-empty-state i[b-0grflv020j] { font-size: 3rem; }
.caja-empty-state h3[b-0grflv020j] { font-size: 1.1rem; color: var(--rg-text-primary); margin: 0; }
.caja-empty-state p[b-0grflv020j]  { font-size: 0.85rem; text-align: center; max-width: 360px; margin: 0; }

/* ── Loading ───────────────────────────────────────────────── */
.crud-loading[b-0grflv020j] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-0grflv020j] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-0grflv020j 0.6s linear infinite; }
@keyframes spin-b-0grflv020j { to { transform: rotate(360deg); } }
.spin[b-0grflv020j] { animation: spin-b-0grflv020j 0.8s linear infinite; }

/* ── Grid 2 columnas ───────────────────────────────────────── */
.caja-grid-2[b-0grflv020j] { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1rem; align-items: start; }

/* ── Columnas ──────────────────────────────────────────────── */
.caja-col-left[b-0grflv020j], .caja-col-right[b-0grflv020j] { display: flex; flex-direction: column; gap: 0.75rem; }

/* ── Panel genérico ────────────────────────────────────────── */
.caja-panel[b-0grflv020j] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; overflow: hidden; }
.caja-panel-head[b-0grflv020j] { display: flex; align-items: center; justify-content: space-between; padding: 0.625rem 0.875rem; border-bottom: 1px solid var(--rg-border); background: var(--rg-bg-subtle); }
.caja-panel-head h2[b-0grflv020j] { margin: 0; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.4rem; }
.caja-panel-body[b-0grflv020j] { padding: 0.875rem; }
.caja-panel-empty[b-0grflv020j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.875rem; font-size: 0.82rem; color: var(--rg-text-muted); }

/* ── Tarjeta info préstamo ─────────────────────────────────── */
.caja-info-card[b-0grflv020j] { background: var(--rg-bg-card); border: 2px solid var(--rg-primary); border-radius: 0.75rem; overflow: hidden; }
.caja-info-header[b-0grflv020j] { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 0.875rem; background: var(--rg-primary); }
.caja-info-icon[b-0grflv020j] { font-size: 1.5rem; color: rgba(255,255,255,0.8); }
.caja-info-prestamo[b-0grflv020j] { font-size: 1.1rem; font-weight: 700; color: #fff; }
.caja-info-cliente[b-0grflv020j] { font-size: 0.75rem; color: rgba(255,255,255,0.75); }
.caja-info-grid[b-0grflv020j] { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; }
.caja-info-item[b-0grflv020j] { padding: 0.5rem 0.75rem; border-right: 1px solid var(--rg-border); border-bottom: 1px solid var(--rg-border); }
.caja-info-item:nth-child(3n)[b-0grflv020j] { border-right: none; }
.caja-info-item:nth-last-child(-n+3):not(:nth-child(3n+1):not(:nth-last-child(-n+3)))[b-0grflv020j] { border-bottom: none; }
/* Última fila siempre sin borde inferior */
.caja-info-item:nth-last-child(1)[b-0grflv020j],
.caja-info-item:nth-last-child(2)[b-0grflv020j],
.caja-info-item:nth-last-child(3)[b-0grflv020j] { border-bottom: none; }
.caja-info-lbl[b-0grflv020j] { display: block; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.caja-info-val[b-0grflv020j] { display: block; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-primary); margin-top: 0.1rem; }

/* ── Tabla CRUD ────────────────────────────────────────────── */
.crud-grid-wrapper[b-0grflv020j] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); }
.crud-table[b-0grflv020j] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0grflv020j] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0grflv020j] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.5rem 0.625rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0grflv020j] { padding: 0.4rem 0.625rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-0grflv020j] { background: var(--rg-bg-hover); }
.crud-table tbody tr:last-child td[b-0grflv020j] { border-bottom: none; }
.text-right[b-0grflv020j] { text-align: right; }
.row-vencida td[b-0grflv020j] { background: rgba(239,68,68,0.04); }
.caja-total-row td[b-0grflv020j] { background: var(--rg-bg-subtle); font-size: 0.78rem; border-top: 2px solid var(--rg-border); }

/* ── Totales cuotas ────────────────────────────────────────── */
.caja-cuotas-totales[b-0grflv020j] { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0.5rem 0.75rem; border-top: 1px solid var(--rg-border); background: var(--rg-bg-subtle); font-size: 0.72rem; color: var(--rg-text-secondary); }

/* ── Badges ────────────────────────────────────────────────── */
.badge[b-0grflv020j] { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; }
.badge-yes[b-0grflv020j]     { background: rgba(22,163,74,0.12);  color: #166534; }
.badge-no[b-0grflv020j]      { background: rgba(100,116,139,0.12); color: #475569; }
.badge-dev[b-0grflv020j]     { background: rgba(22,163,74,0.12);  color: #166534; }
.badge-nodev[b-0grflv020j]   { background: rgba(234,179,8,0.12);  color: #854d0e; }
.badge-pend[b-0grflv020j]    { background: rgba(100,116,139,0.12); color: #475569; }
.badge-vencida[b-0grflv020j] { background: rgba(239,68,68,0.12);  color: #991b1b; }
[data-mode="dark"] .badge-yes[b-0grflv020j]    { color: #86efac; }
[data-mode="dark"] .badge-dev[b-0grflv020j]    { color: #86efac; }
[data-mode="dark"] .badge-nodev[b-0grflv020j]  { color: #fde68a; }
[data-mode="dark"] .badge-vencida[b-0grflv020j] { color: #fca5a5; }

/* ── NCF del cliente ───────────────────────────────────────── */
.caja-ncf-badge[b-0grflv020j] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .72rem;
    font-weight: 700;
    padding: .15rem .5rem;
    border-radius: 1rem;
    margin-top: .1rem;
}
.caja-ncf-ok[b-0grflv020j] {
    background: rgba(22,163,74,.12);
    color: #166534;
}
.caja-ncf-warn[b-0grflv020j] {
    background: rgba(234,179,8,.15);
    color: #854d0e;
    cursor: help;
}
[data-mode="dark"] .caja-ncf-ok[b-0grflv020j]   { color: #86efac; }
[data-mode="dark"] .caja-ncf-warn[b-0grflv020j] { color: #fde68a; }

/* Alerta NCF prominente encima de los cargos */
.caja-ncf-alert[b-0grflv020j] {
    align-items: flex-start;
    gap: .6rem;
    font-size: .82rem;
    margin-bottom: .75rem;
}

/* ── Utilidades ────────────────────────────────────────────── */
.font-mono[b-0grflv020j] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-0grflv020j] { color: var(--rg-text-muted); font-size: 0.78rem; }
.text-danger[b-0grflv020j] { color: var(--rg-danger) !important; }

/* ── Panel pago / form ─────────────────────────────────────── */
.form-group[b-0grflv020j] { display: flex; flex-direction: column; gap: 0.2rem; }
.form-group label[b-0grflv020j] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-input[b-0grflv020j] { padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; width: 100%; }
.form-input:focus[b-0grflv020j] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(26,58,92,0.12); }
.caja-amount-input[b-0grflv020j] { font-size: 1.1rem; font-weight: 700; padding: 0.5rem 0.75rem; }
.caja-amount-error[b-0grflv020j] { margin-top: 0.25rem; padding: 0.35rem 0.6rem; background: rgba(239,68,68,0.08); color: var(--rg-danger); border-radius: 0.375rem; font-size: 0.72rem; border: 1px solid rgba(239,68,68,0.25); }

/* ── Distribución cascada — resumen inline ──────────────────── */
.caja-dist-summary[b-0grflv020j] { display: flex; align-items: center; justify-content: space-between; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.75rem; margin-bottom: 0.5rem; }
.caja-dist-summary-left[b-0grflv020j] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-secondary); }
.caja-dist-btn-detail[b-0grflv020j] { font-size: 0.72rem !important; padding: 0.2rem 0.6rem !important; display: flex; align-items: center; gap: 0.25rem; }

/* ── Fecha de proceso (solo lectura) ────────────────────────── */
.caja-fecha-proceso[b-0grflv020j] { display: flex; align-items: center; justify-content: space-between; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.45rem 0.7rem; }
.caja-fecha-lbl[b-0grflv020j] { font-size: 0.78rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.35rem; }
.caja-fecha-val[b-0grflv020j] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary); }

/* ── Botón "Aplicar pago" listo ─────────────────────────────── */
.btn-aplicar-listo[b-0grflv020j] {
    background: var(--rg-success);
    color: #fff;
    border: 2px solid var(--rg-success);
    font-weight: 700;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.25);
    transition: background 0.15s, box-shadow 0.15s;
}
.btn-aplicar-listo:hover:not(:disabled)[b-0grflv020j] {
    background: #15803d;
    border-color: #15803d;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.35);
}
[data-mode="dark"] .btn-aplicar-listo[b-0grflv020j] {
    background: #16a34a;
    border-color: #16a34a;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.3);
}
[data-mode="dark"] .btn-aplicar-listo:hover:not(:disabled)[b-0grflv020j] {
    background: #15803d;
    border-color: #15803d;
}

/* ── Modal distribución cascada ─────────────────────────────── */
.dist-modal-monto[b-0grflv020j] { display: flex; align-items: baseline; justify-content: space-between; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.6rem 0.8rem; margin-bottom: 0.75rem; }
.dist-modal-lbl[b-0grflv020j] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.dist-modal-total[b-0grflv020j] { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary); }
.dist-modal-rows[b-0grflv020j] { display: flex; flex-direction: column; gap: 0.25rem; }
.dist-modal-row[b-0grflv020j] { display: flex; justify-content: space-between; align-items: center; font-size: 0.85rem; padding: 0.35rem 0.5rem; border-radius: 0.35rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); }
.dist-modal-row span:first-child[b-0grflv020j] { display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-secondary); }
.dist-val[b-0grflv020j] { font-weight: 700; }
.dist-val.cargo[b-0grflv020j]    { color: var(--rg-warning); }
.dist-val.mora[b-0grflv020j]     { color: var(--rg-danger);  }
.dist-val.seguro[b-0grflv020j]   { color: var(--rg-info);    }
.dist-val.comision[b-0grflv020j] { color: var(--rg-accent);  }
.dist-val.interes[b-0grflv020j]  { color: #8b5cf6; }
.dist-val.capital[b-0grflv020j]  { color: var(--rg-success); }
.dist-sobrante[b-0grflv020j] { border: 1px dashed var(--rg-border) !important; background: transparent !important; color: var(--rg-text-muted); font-style: italic; }

/* ── Modal estándar ────────────────────────────────────────── */
.modal-backdrop[b-0grflv020j] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0grflv020j 0.15s ease-out; }
.modal-container[b-0grflv020j] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0grflv020j] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); animation: scaleIn-b-0grflv020j 0.2s ease-out; }
.modal-sm[b-0grflv020j] { max-width: 420px; }
@keyframes fadeIn-b-0grflv020j { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0grflv020j { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-0grflv020j] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-0grflv020j] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-0grflv020j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0grflv020j] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-0grflv020j] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0grflv020j] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Modales anidados ──────────────────────────────────────── */
.modal-backdrop-nested[b-0grflv020j]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-0grflv020j] { z-index: 2001 !important; }

/* ── Post-save modal ───────────────────────────────────────── */
.ps-modal[b-0grflv020j] { max-width: 380px; }
.ps-recibo-info[b-0grflv020j] { display: flex; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.5rem 0.75rem; }
.ps-label[b-0grflv020j] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); white-space: nowrap; }
.ps-value[b-0grflv020j] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-breakdown[b-0grflv020j] { margin-top: 0.75rem; }
.ps-bk-row[b-0grflv020j] { display: flex; justify-content: space-between; font-size: 0.82rem; padding: 0.2rem 0; color: var(--rg-text-secondary); border-bottom: 1px solid var(--rg-border); }
.ps-bk-total[b-0grflv020j] { display: flex; justify-content: space-between; font-size: 0.85rem; padding: 0.4rem 0 0; color: var(--rg-text-primary); margin-top: 0.1rem; }
.ps-acciones[b-0grflv020j] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1rem; }
.ps-acciones .btn-crud[b-0grflv020j] { width: 100%; justify-content: center; }

/* ── Responsive ────────────────────────────────────────────── */
@media (max-width: 900px) {
    .caja-grid-2[b-0grflv020j] { grid-template-columns: 1fr; }
    .caja-col-right[b-0grflv020j] { order: -1; }
}

@media (max-width: 768px) {
    .crud-container[b-0grflv020j] { padding: 0.75rem; }
    .crud-header[b-0grflv020j] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-0grflv020j] { display: none; }
    .caja-info-grid[b-0grflv020j] { grid-template-columns: 1fr 1fr; }
    .modal-dialog[b-0grflv020j] { width: 98%; max-height: 95vh; }
    .modal-body[b-0grflv020j] { padding: 0.75rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Caja/Frmclg_caja.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zjtmc49p08] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zjtmc49p08 0.3s ease-out; }
@keyframes slideUp-b-zjtmc49p08 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zjtmc49p08] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zjtmc49p08] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zjtmc49p08] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zjtmc49p08] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zjtmc49p08] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zjtmc49p08] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zjtmc49p08] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zjtmc49p08] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zjtmc49p08] { filter: brightness(1.1); }
.btn-outline[b-zjtmc49p08] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zjtmc49p08] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zjtmc49p08] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zjtmc49p08] { filter: brightness(1.1); }
.btn-icon[b-zjtmc49p08] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zjtmc49p08] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zjtmc49p08] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zjtmc49p08] { color: #ef4444; }
.btn-delete:hover[b-zjtmc49p08] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zjtmc49p08] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zjtmc49p08] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zjtmc49p08] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zjtmc49p08] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zjtmc49p08] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zjtmc49p08] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zjtmc49p08] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zjtmc49p08] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zjtmc49p08] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zjtmc49p08] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zjtmc49p08] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zjtmc49p08] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zjtmc49p08] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zjtmc49p08] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zjtmc49p08] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zjtmc49p08] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zjtmc49p08] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zjtmc49p08] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zjtmc49p08] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zjtmc49p08] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zjtmc49p08] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zjtmc49p08] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zjtmc49p08] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zjtmc49p08] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zjtmc49p08] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zjtmc49p08] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zjtmc49p08] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zjtmc49p08] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zjtmc49p08] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zjtmc49p08] { display: block; }
.hide-on-cards[b-zjtmc49p08] { display: none !important; }
.show-on-cards[b-zjtmc49p08] { display: grid; }
.hide-on-grid[b-zjtmc49p08] { display: none !important; }

/* Badges */
.badge[b-zjtmc49p08] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zjtmc49p08] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zjtmc49p08] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zjtmc49p08] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zjtmc49p08] { text-align: center; }
.text-muted[b-zjtmc49p08] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zjtmc49p08], .crud-empty-state[b-zjtmc49p08] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zjtmc49p08] { font-size: 2rem; }
.crud-spinner[b-zjtmc49p08] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zjtmc49p08 0.6s linear infinite; }
.crud-spinner-sm[b-zjtmc49p08] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zjtmc49p08 0.6s linear infinite; }
@keyframes spin-b-zjtmc49p08 { to { transform: rotate(360deg); } }
.spin[b-zjtmc49p08] { animation: spin-b-zjtmc49p08 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zjtmc49p08] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zjtmc49p08 0.15s ease-out; }
.modal-container[b-zjtmc49p08] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zjtmc49p08] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zjtmc49p08 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zjtmc49p08] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zjtmc49p08] { max-width: 420px; }
@keyframes fadeIn-b-zjtmc49p08 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zjtmc49p08 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zjtmc49p08] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zjtmc49p08] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zjtmc49p08] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zjtmc49p08] { color: #dc2626; }
.modal-close[b-zjtmc49p08] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zjtmc49p08] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zjtmc49p08] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zjtmc49p08] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zjtmc49p08] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zjtmc49p08] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zjtmc49p08] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zjtmc49p08] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zjtmc49p08] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zjtmc49p08] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zjtmc49p08] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zjtmc49p08] { flex: 2; }
.form-group label[b-zjtmc49p08] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zjtmc49p08], .form-group select[b-zjtmc49p08], .form-textarea[b-zjtmc49p08] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zjtmc49p08], .form-group select:focus[b-zjtmc49p08], .form-textarea:focus[b-zjtmc49p08] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zjtmc49p08] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zjtmc49p08] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zjtmc49p08] { flex: 1; display: flex; align-items: center; }
.form-check[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zjtmc49p08] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zjtmc49p08] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zjtmc49p08] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zjtmc49p08] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zjtmc49p08] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zjtmc49p08] { font-size: 3rem; }
.photo-placeholder span[b-zjtmc49p08] { font-size: 0.78rem; }
.photo-actions[b-zjtmc49p08] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zjtmc49p08] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zjtmc49p08] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zjtmc49p08] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zjtmc49p08] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zjtmc49p08] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zjtmc49p08] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zjtmc49p08] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zjtmc49p08] { filter: brightness(1.15); transform: scale(1.05); }
[b-zjtmc49p08] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zjtmc49p08] { padding: 0.75rem; }
    .crud-header[b-zjtmc49p08] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zjtmc49p08] { font-size: 1.1rem; }
    .btn-text[b-zjtmc49p08] { display: none; }
    .form-row[b-zjtmc49p08] { flex-direction: column; }
    .form-row-4[b-zjtmc49p08] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zjtmc49p08] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zjtmc49p08] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zjtmc49p08] { padding: 0.75rem; }
    .modal-tabs[b-zjtmc49p08] { overflow-x: auto; }
    .modal-tab[b-zjtmc49p08] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zjtmc49p08] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zjtmc49p08] { display: grid !important; }
    .crud-cards-wrapper[b-zjtmc49p08] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zjtmc49p08] { grid-template-columns: 1fr; }
    .card-details[b-zjtmc49p08] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zjtmc49p08] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zjtmc49p08] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zjtmc49p08] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zjtmc49p08] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchkcodificasolicitud.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0qs9tl1x5z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0qs9tl1x5z 0.3s ease-out; }
@keyframes slideUp-b-0qs9tl1x5z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0qs9tl1x5z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0qs9tl1x5z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0qs9tl1x5z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0qs9tl1x5z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0qs9tl1x5z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0qs9tl1x5z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0qs9tl1x5z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0qs9tl1x5z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0qs9tl1x5z] { filter: brightness(1.1); }
.btn-outline[b-0qs9tl1x5z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0qs9tl1x5z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0qs9tl1x5z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0qs9tl1x5z] { filter: brightness(1.1); }
.btn-icon[b-0qs9tl1x5z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0qs9tl1x5z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0qs9tl1x5z] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0qs9tl1x5z] { color: #ef4444; }
.btn-delete:hover[b-0qs9tl1x5z] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0qs9tl1x5z] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0qs9tl1x5z] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0qs9tl1x5z] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0qs9tl1x5z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0qs9tl1x5z] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0qs9tl1x5z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0qs9tl1x5z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0qs9tl1x5z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0qs9tl1x5z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0qs9tl1x5z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0qs9tl1x5z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0qs9tl1x5z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0qs9tl1x5z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0qs9tl1x5z] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0qs9tl1x5z] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0qs9tl1x5z] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0qs9tl1x5z] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0qs9tl1x5z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0qs9tl1x5z] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0qs9tl1x5z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0qs9tl1x5z] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0qs9tl1x5z] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0qs9tl1x5z] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0qs9tl1x5z] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0qs9tl1x5z] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0qs9tl1x5z] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0qs9tl1x5z] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0qs9tl1x5z] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0qs9tl1x5z] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0qs9tl1x5z] { display: block; }
.hide-on-cards[b-0qs9tl1x5z] { display: none !important; }
.show-on-cards[b-0qs9tl1x5z] { display: grid; }
.hide-on-grid[b-0qs9tl1x5z] { display: none !important; }

/* Badges */
.badge[b-0qs9tl1x5z] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0qs9tl1x5z] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0qs9tl1x5z] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0qs9tl1x5z] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0qs9tl1x5z] { text-align: center; }
.text-muted[b-0qs9tl1x5z] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0qs9tl1x5z], .crud-empty-state[b-0qs9tl1x5z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0qs9tl1x5z] { font-size: 2rem; }
.crud-spinner[b-0qs9tl1x5z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0qs9tl1x5z 0.6s linear infinite; }
.crud-spinner-sm[b-0qs9tl1x5z] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0qs9tl1x5z 0.6s linear infinite; }
@keyframes spin-b-0qs9tl1x5z { to { transform: rotate(360deg); } }
.spin[b-0qs9tl1x5z] { animation: spin-b-0qs9tl1x5z 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0qs9tl1x5z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0qs9tl1x5z 0.15s ease-out; }
.modal-container[b-0qs9tl1x5z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0qs9tl1x5z] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0qs9tl1x5z 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0qs9tl1x5z] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0qs9tl1x5z] { max-width: 420px; }
@keyframes fadeIn-b-0qs9tl1x5z { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0qs9tl1x5z { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0qs9tl1x5z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0qs9tl1x5z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0qs9tl1x5z] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0qs9tl1x5z] { color: #dc2626; }
.modal-close[b-0qs9tl1x5z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0qs9tl1x5z] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0qs9tl1x5z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0qs9tl1x5z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0qs9tl1x5z] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0qs9tl1x5z] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0qs9tl1x5z] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0qs9tl1x5z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0qs9tl1x5z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0qs9tl1x5z] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0qs9tl1x5z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0qs9tl1x5z] { flex: 2; }
.form-group label[b-0qs9tl1x5z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0qs9tl1x5z], .form-group select[b-0qs9tl1x5z], .form-textarea[b-0qs9tl1x5z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0qs9tl1x5z], .form-group select:focus[b-0qs9tl1x5z], .form-textarea:focus[b-0qs9tl1x5z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0qs9tl1x5z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0qs9tl1x5z] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0qs9tl1x5z] { flex: 1; display: flex; align-items: center; }
.form-check[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0qs9tl1x5z] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0qs9tl1x5z] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0qs9tl1x5z] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0qs9tl1x5z] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0qs9tl1x5z] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0qs9tl1x5z] { font-size: 3rem; }
.photo-placeholder span[b-0qs9tl1x5z] { font-size: 0.78rem; }
.photo-actions[b-0qs9tl1x5z] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0qs9tl1x5z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0qs9tl1x5z] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0qs9tl1x5z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0qs9tl1x5z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0qs9tl1x5z] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0qs9tl1x5z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0qs9tl1x5z] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0qs9tl1x5z] { filter: brightness(1.15); transform: scale(1.05); }
[b-0qs9tl1x5z] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0qs9tl1x5z] { padding: 0.75rem; }
    .crud-header[b-0qs9tl1x5z] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0qs9tl1x5z] { font-size: 1.1rem; }
    .btn-text[b-0qs9tl1x5z] { display: none; }
    .form-row[b-0qs9tl1x5z] { flex-direction: column; }
    .form-row-4[b-0qs9tl1x5z] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0qs9tl1x5z] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0qs9tl1x5z] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0qs9tl1x5z] { padding: 0.75rem; }
    .modal-tabs[b-0qs9tl1x5z] { overflow-x: auto; }
    .modal-tab[b-0qs9tl1x5z] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0qs9tl1x5z] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0qs9tl1x5z] { display: grid !important; }
    .crud-cards-wrapper[b-0qs9tl1x5z] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0qs9tl1x5z] { grid-template-columns: 1fr; }
    .card-details[b-0qs9tl1x5z] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0qs9tl1x5z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0qs9tl1x5z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0qs9tl1x5z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0qs9tl1x5z] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchkimpresioncheques.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-axsgstd0do] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-axsgstd0do 0.3s ease-out; }
@keyframes slideUp-b-axsgstd0do { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-axsgstd0do] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-axsgstd0do] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-axsgstd0do] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-axsgstd0do] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-axsgstd0do] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-axsgstd0do] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-axsgstd0do] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-axsgstd0do] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-axsgstd0do] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-axsgstd0do] { filter: brightness(1.1); }
.btn-outline[b-axsgstd0do] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-axsgstd0do] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-axsgstd0do] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-axsgstd0do] { filter: brightness(1.1); }
.btn-icon[b-axsgstd0do] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-axsgstd0do] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-axsgstd0do] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-axsgstd0do] { color: #ef4444; }
.btn-delete:hover[b-axsgstd0do] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-axsgstd0do] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-axsgstd0do] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-axsgstd0do] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-axsgstd0do] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-axsgstd0do] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-axsgstd0do] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-axsgstd0do] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-axsgstd0do] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-axsgstd0do] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-axsgstd0do] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-axsgstd0do] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-axsgstd0do] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-axsgstd0do] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-axsgstd0do] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-axsgstd0do] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-axsgstd0do] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-axsgstd0do] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-axsgstd0do] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-axsgstd0do] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-axsgstd0do] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-axsgstd0do] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-axsgstd0do] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-axsgstd0do] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-axsgstd0do] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-axsgstd0do] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-axsgstd0do] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-axsgstd0do] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-axsgstd0do] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-axsgstd0do] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-axsgstd0do] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-axsgstd0do] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-axsgstd0do] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-axsgstd0do] { display: block; }
.hide-on-cards[b-axsgstd0do] { display: none !important; }
.show-on-cards[b-axsgstd0do] { display: grid; }
.hide-on-grid[b-axsgstd0do] { display: none !important; }

/* Badges */
.badge[b-axsgstd0do] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-axsgstd0do] { background: #ecfdf5; color: #065f46; }
.badge-no[b-axsgstd0do] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-axsgstd0do] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-axsgstd0do] { text-align: center; }
.text-muted[b-axsgstd0do] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-axsgstd0do], .crud-empty-state[b-axsgstd0do] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-axsgstd0do] { font-size: 2rem; }
.crud-spinner[b-axsgstd0do] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-axsgstd0do 0.6s linear infinite; }
.crud-spinner-sm[b-axsgstd0do] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-axsgstd0do 0.6s linear infinite; }
@keyframes spin-b-axsgstd0do { to { transform: rotate(360deg); } }
.spin[b-axsgstd0do] { animation: spin-b-axsgstd0do 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-axsgstd0do] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-axsgstd0do 0.15s ease-out; }
.modal-container[b-axsgstd0do] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-axsgstd0do] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-axsgstd0do 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-axsgstd0do] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-axsgstd0do] { max-width: 420px; }
@keyframes fadeIn-b-axsgstd0do { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-axsgstd0do { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-axsgstd0do] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-axsgstd0do] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-axsgstd0do] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-axsgstd0do] { color: #dc2626; }
.modal-close[b-axsgstd0do] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-axsgstd0do] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-axsgstd0do] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-axsgstd0do] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-axsgstd0do] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-axsgstd0do] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-axsgstd0do] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-axsgstd0do] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-axsgstd0do] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-axsgstd0do] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-axsgstd0do] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-axsgstd0do] { flex: 2; }
.form-group label[b-axsgstd0do] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-axsgstd0do], .form-group select[b-axsgstd0do], .form-textarea[b-axsgstd0do] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-axsgstd0do], .form-group select:focus[b-axsgstd0do], .form-textarea:focus[b-axsgstd0do] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-axsgstd0do] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-axsgstd0do] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-axsgstd0do] { flex: 1; display: flex; align-items: center; }
.form-check[b-axsgstd0do] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-axsgstd0do] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-axsgstd0do] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-axsgstd0do] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-axsgstd0do] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-axsgstd0do] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-axsgstd0do] { font-size: 3rem; }
.photo-placeholder span[b-axsgstd0do] { font-size: 0.78rem; }
.photo-actions[b-axsgstd0do] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-axsgstd0do] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-axsgstd0do] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-axsgstd0do] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-axsgstd0do] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-axsgstd0do] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-axsgstd0do] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-axsgstd0do] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-axsgstd0do] { filter: brightness(1.15); transform: scale(1.05); }
[b-axsgstd0do] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-axsgstd0do] { padding: 0.75rem; }
    .crud-header[b-axsgstd0do] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-axsgstd0do] { font-size: 1.1rem; }
    .btn-text[b-axsgstd0do] { display: none; }
    .form-row[b-axsgstd0do] { flex-direction: column; }
    .form-row-4[b-axsgstd0do] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-axsgstd0do] { width: 98%; max-height: 95vh; }
    .modal-lg[b-axsgstd0do] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-axsgstd0do] { padding: 0.75rem; }
    .modal-tabs[b-axsgstd0do] { overflow-x: auto; }
    .modal-tab[b-axsgstd0do] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-axsgstd0do] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-axsgstd0do] { display: grid !important; }
    .crud-cards-wrapper[b-axsgstd0do] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-axsgstd0do] { grid-template-columns: 1fr; }
    .card-details[b-axsgstd0do] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-axsgstd0do] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-axsgstd0do] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-axsgstd0do] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-axsgstd0do] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchkpermisocheques.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-t4z1g5ecjv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-t4z1g5ecjv 0.3s ease-out; }
@keyframes slideUp-b-t4z1g5ecjv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-t4z1g5ecjv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-t4z1g5ecjv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-t4z1g5ecjv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-t4z1g5ecjv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-t4z1g5ecjv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-t4z1g5ecjv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-t4z1g5ecjv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-t4z1g5ecjv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-t4z1g5ecjv] { filter: brightness(1.1); }
.btn-outline[b-t4z1g5ecjv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-t4z1g5ecjv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-t4z1g5ecjv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-t4z1g5ecjv] { filter: brightness(1.1); }
.btn-icon[b-t4z1g5ecjv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-t4z1g5ecjv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-t4z1g5ecjv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-t4z1g5ecjv] { color: #ef4444; }
.btn-delete:hover[b-t4z1g5ecjv] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-t4z1g5ecjv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-t4z1g5ecjv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-t4z1g5ecjv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-t4z1g5ecjv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-t4z1g5ecjv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-t4z1g5ecjv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-t4z1g5ecjv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-t4z1g5ecjv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-t4z1g5ecjv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-t4z1g5ecjv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-t4z1g5ecjv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-t4z1g5ecjv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-t4z1g5ecjv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-t4z1g5ecjv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-t4z1g5ecjv] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-t4z1g5ecjv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-t4z1g5ecjv] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-t4z1g5ecjv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-t4z1g5ecjv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-t4z1g5ecjv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-t4z1g5ecjv] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-t4z1g5ecjv] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-t4z1g5ecjv] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-t4z1g5ecjv] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-t4z1g5ecjv] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-t4z1g5ecjv] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-t4z1g5ecjv] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-t4z1g5ecjv] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-t4z1g5ecjv] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-t4z1g5ecjv] { display: block; }
.hide-on-cards[b-t4z1g5ecjv] { display: none !important; }
.show-on-cards[b-t4z1g5ecjv] { display: grid; }
.hide-on-grid[b-t4z1g5ecjv] { display: none !important; }

/* Badges */
.badge[b-t4z1g5ecjv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-t4z1g5ecjv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-t4z1g5ecjv] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-t4z1g5ecjv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-t4z1g5ecjv] { text-align: center; }
.text-muted[b-t4z1g5ecjv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-t4z1g5ecjv], .crud-empty-state[b-t4z1g5ecjv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-t4z1g5ecjv] { font-size: 2rem; }
.crud-spinner[b-t4z1g5ecjv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-t4z1g5ecjv 0.6s linear infinite; }
.crud-spinner-sm[b-t4z1g5ecjv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-t4z1g5ecjv 0.6s linear infinite; }
@keyframes spin-b-t4z1g5ecjv { to { transform: rotate(360deg); } }
.spin[b-t4z1g5ecjv] { animation: spin-b-t4z1g5ecjv 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-t4z1g5ecjv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-t4z1g5ecjv 0.15s ease-out; }
.modal-container[b-t4z1g5ecjv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-t4z1g5ecjv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-t4z1g5ecjv 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-t4z1g5ecjv] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-t4z1g5ecjv] { max-width: 420px; }
@keyframes fadeIn-b-t4z1g5ecjv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-t4z1g5ecjv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-t4z1g5ecjv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-t4z1g5ecjv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-t4z1g5ecjv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-t4z1g5ecjv] { color: #dc2626; }
.modal-close[b-t4z1g5ecjv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-t4z1g5ecjv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-t4z1g5ecjv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-t4z1g5ecjv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-t4z1g5ecjv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-t4z1g5ecjv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-t4z1g5ecjv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-t4z1g5ecjv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-t4z1g5ecjv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-t4z1g5ecjv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-t4z1g5ecjv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-t4z1g5ecjv] { flex: 2; }
.form-group label[b-t4z1g5ecjv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-t4z1g5ecjv], .form-group select[b-t4z1g5ecjv], .form-textarea[b-t4z1g5ecjv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-t4z1g5ecjv], .form-group select:focus[b-t4z1g5ecjv], .form-textarea:focus[b-t4z1g5ecjv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-t4z1g5ecjv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-t4z1g5ecjv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-t4z1g5ecjv] { flex: 1; display: flex; align-items: center; }
.form-check[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-t4z1g5ecjv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-t4z1g5ecjv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-t4z1g5ecjv] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-t4z1g5ecjv] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-t4z1g5ecjv] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-t4z1g5ecjv] { font-size: 3rem; }
.photo-placeholder span[b-t4z1g5ecjv] { font-size: 0.78rem; }
.photo-actions[b-t4z1g5ecjv] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-t4z1g5ecjv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-t4z1g5ecjv] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-t4z1g5ecjv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-t4z1g5ecjv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-t4z1g5ecjv] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-t4z1g5ecjv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-t4z1g5ecjv] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-t4z1g5ecjv] { filter: brightness(1.15); transform: scale(1.05); }
[b-t4z1g5ecjv] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-t4z1g5ecjv] { padding: 0.75rem; }
    .crud-header[b-t4z1g5ecjv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-t4z1g5ecjv] { font-size: 1.1rem; }
    .btn-text[b-t4z1g5ecjv] { display: none; }
    .form-row[b-t4z1g5ecjv] { flex-direction: column; }
    .form-row-4[b-t4z1g5ecjv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-t4z1g5ecjv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-t4z1g5ecjv] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-t4z1g5ecjv] { padding: 0.75rem; }
    .modal-tabs[b-t4z1g5ecjv] { overflow-x: auto; }
    .modal-tab[b-t4z1g5ecjv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-t4z1g5ecjv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-t4z1g5ecjv] { display: grid !important; }
    .crud-cards-wrapper[b-t4z1g5ecjv] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-t4z1g5ecjv] { grid-template-columns: 1fr; }
    .card-details[b-t4z1g5ecjv] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-t4z1g5ecjv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-t4z1g5ecjv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-t4z1g5ecjv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-t4z1g5ecjv] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchkregistracuentabanco.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6z9f5q3fdk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6z9f5q3fdk 0.3s ease-out; }
@keyframes slideUp-b-6z9f5q3fdk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6z9f5q3fdk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6z9f5q3fdk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6z9f5q3fdk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6z9f5q3fdk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6z9f5q3fdk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6z9f5q3fdk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6z9f5q3fdk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6z9f5q3fdk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6z9f5q3fdk] { filter: brightness(1.1); }
.btn-outline[b-6z9f5q3fdk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6z9f5q3fdk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6z9f5q3fdk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6z9f5q3fdk] { filter: brightness(1.1); }
.btn-icon[b-6z9f5q3fdk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6z9f5q3fdk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6z9f5q3fdk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6z9f5q3fdk] { color: #ef4444; }
.btn-delete:hover[b-6z9f5q3fdk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6z9f5q3fdk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6z9f5q3fdk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6z9f5q3fdk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6z9f5q3fdk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6z9f5q3fdk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6z9f5q3fdk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6z9f5q3fdk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6z9f5q3fdk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6z9f5q3fdk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6z9f5q3fdk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6z9f5q3fdk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6z9f5q3fdk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6z9f5q3fdk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6z9f5q3fdk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6z9f5q3fdk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6z9f5q3fdk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6z9f5q3fdk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6z9f5q3fdk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6z9f5q3fdk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6z9f5q3fdk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6z9f5q3fdk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6z9f5q3fdk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6z9f5q3fdk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6z9f5q3fdk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6z9f5q3fdk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6z9f5q3fdk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6z9f5q3fdk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6z9f5q3fdk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6z9f5q3fdk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6z9f5q3fdk] { display: block; }
.hide-on-cards[b-6z9f5q3fdk] { display: none !important; }
.show-on-cards[b-6z9f5q3fdk] { display: grid; }
.hide-on-grid[b-6z9f5q3fdk] { display: none !important; }

/* Badges */
.badge[b-6z9f5q3fdk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6z9f5q3fdk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6z9f5q3fdk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6z9f5q3fdk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6z9f5q3fdk] { text-align: center; }
.text-muted[b-6z9f5q3fdk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6z9f5q3fdk], .crud-empty-state[b-6z9f5q3fdk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6z9f5q3fdk] { font-size: 2rem; }
.crud-spinner[b-6z9f5q3fdk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6z9f5q3fdk 0.6s linear infinite; }
.crud-spinner-sm[b-6z9f5q3fdk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6z9f5q3fdk 0.6s linear infinite; }
@keyframes spin-b-6z9f5q3fdk { to { transform: rotate(360deg); } }
.spin[b-6z9f5q3fdk] { animation: spin-b-6z9f5q3fdk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6z9f5q3fdk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6z9f5q3fdk 0.15s ease-out; }
.modal-container[b-6z9f5q3fdk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6z9f5q3fdk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6z9f5q3fdk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6z9f5q3fdk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6z9f5q3fdk] { max-width: 420px; }
@keyframes fadeIn-b-6z9f5q3fdk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6z9f5q3fdk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6z9f5q3fdk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6z9f5q3fdk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6z9f5q3fdk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6z9f5q3fdk] { color: #dc2626; }
.modal-close[b-6z9f5q3fdk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6z9f5q3fdk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6z9f5q3fdk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6z9f5q3fdk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6z9f5q3fdk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6z9f5q3fdk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6z9f5q3fdk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6z9f5q3fdk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6z9f5q3fdk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6z9f5q3fdk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6z9f5q3fdk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6z9f5q3fdk] { flex: 2; }
.form-group label[b-6z9f5q3fdk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6z9f5q3fdk], .form-group select[b-6z9f5q3fdk], .form-textarea[b-6z9f5q3fdk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6z9f5q3fdk], .form-group select:focus[b-6z9f5q3fdk], .form-textarea:focus[b-6z9f5q3fdk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6z9f5q3fdk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6z9f5q3fdk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6z9f5q3fdk] { flex: 1; display: flex; align-items: center; }
.form-check[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6z9f5q3fdk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6z9f5q3fdk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6z9f5q3fdk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6z9f5q3fdk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6z9f5q3fdk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6z9f5q3fdk] { font-size: 3rem; }
.photo-placeholder span[b-6z9f5q3fdk] { font-size: 0.78rem; }
.photo-actions[b-6z9f5q3fdk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6z9f5q3fdk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6z9f5q3fdk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6z9f5q3fdk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6z9f5q3fdk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6z9f5q3fdk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6z9f5q3fdk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6z9f5q3fdk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6z9f5q3fdk] { filter: brightness(1.15); transform: scale(1.05); }
[b-6z9f5q3fdk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6z9f5q3fdk] { padding: 0.75rem; }
    .crud-header[b-6z9f5q3fdk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6z9f5q3fdk] { font-size: 1.1rem; }
    .btn-text[b-6z9f5q3fdk] { display: none; }
    .form-row[b-6z9f5q3fdk] { flex-direction: column; }
    .form-row-4[b-6z9f5q3fdk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6z9f5q3fdk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6z9f5q3fdk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6z9f5q3fdk] { padding: 0.75rem; }
    .modal-tabs[b-6z9f5q3fdk] { overflow-x: auto; }
    .modal-tab[b-6z9f5q3fdk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6z9f5q3fdk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6z9f5q3fdk] { display: grid !important; }
    .crud-cards-wrapper[b-6z9f5q3fdk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6z9f5q3fdk] { grid-template-columns: 1fr; }
    .card-details[b-6z9f5q3fdk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6z9f5q3fdk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6z9f5q3fdk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6z9f5q3fdk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6z9f5q3fdk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchksolicitudsimple.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h9xnq9kxyp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h9xnq9kxyp 0.3s ease-out; }
@keyframes slideUp-b-h9xnq9kxyp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h9xnq9kxyp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h9xnq9kxyp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h9xnq9kxyp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h9xnq9kxyp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h9xnq9kxyp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h9xnq9kxyp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h9xnq9kxyp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h9xnq9kxyp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h9xnq9kxyp] { filter: brightness(1.1); }
.btn-outline[b-h9xnq9kxyp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h9xnq9kxyp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h9xnq9kxyp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h9xnq9kxyp] { filter: brightness(1.1); }
.btn-icon[b-h9xnq9kxyp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h9xnq9kxyp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h9xnq9kxyp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h9xnq9kxyp] { color: #ef4444; }
.btn-delete:hover[b-h9xnq9kxyp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h9xnq9kxyp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h9xnq9kxyp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h9xnq9kxyp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h9xnq9kxyp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h9xnq9kxyp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h9xnq9kxyp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h9xnq9kxyp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h9xnq9kxyp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h9xnq9kxyp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h9xnq9kxyp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h9xnq9kxyp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h9xnq9kxyp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h9xnq9kxyp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h9xnq9kxyp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h9xnq9kxyp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h9xnq9kxyp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h9xnq9kxyp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h9xnq9kxyp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h9xnq9kxyp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h9xnq9kxyp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h9xnq9kxyp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h9xnq9kxyp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h9xnq9kxyp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h9xnq9kxyp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h9xnq9kxyp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h9xnq9kxyp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h9xnq9kxyp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h9xnq9kxyp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h9xnq9kxyp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h9xnq9kxyp] { display: block; }
.hide-on-cards[b-h9xnq9kxyp] { display: none !important; }
.show-on-cards[b-h9xnq9kxyp] { display: grid; }
.hide-on-grid[b-h9xnq9kxyp] { display: none !important; }

/* Badges */
.badge[b-h9xnq9kxyp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h9xnq9kxyp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h9xnq9kxyp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h9xnq9kxyp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h9xnq9kxyp] { text-align: center; }
.text-muted[b-h9xnq9kxyp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h9xnq9kxyp], .crud-empty-state[b-h9xnq9kxyp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h9xnq9kxyp] { font-size: 2rem; }
.crud-spinner[b-h9xnq9kxyp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h9xnq9kxyp 0.6s linear infinite; }
.crud-spinner-sm[b-h9xnq9kxyp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h9xnq9kxyp 0.6s linear infinite; }
@keyframes spin-b-h9xnq9kxyp { to { transform: rotate(360deg); } }
.spin[b-h9xnq9kxyp] { animation: spin-b-h9xnq9kxyp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h9xnq9kxyp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h9xnq9kxyp 0.15s ease-out; }
.modal-container[b-h9xnq9kxyp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h9xnq9kxyp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h9xnq9kxyp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h9xnq9kxyp] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h9xnq9kxyp] { max-width: 420px; }
@keyframes fadeIn-b-h9xnq9kxyp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h9xnq9kxyp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h9xnq9kxyp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h9xnq9kxyp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h9xnq9kxyp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h9xnq9kxyp] { color: #dc2626; }
.modal-close[b-h9xnq9kxyp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h9xnq9kxyp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h9xnq9kxyp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h9xnq9kxyp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h9xnq9kxyp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h9xnq9kxyp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h9xnq9kxyp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h9xnq9kxyp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h9xnq9kxyp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h9xnq9kxyp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h9xnq9kxyp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h9xnq9kxyp] { flex: 2; }
.form-group label[b-h9xnq9kxyp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h9xnq9kxyp], .form-group select[b-h9xnq9kxyp], .form-textarea[b-h9xnq9kxyp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h9xnq9kxyp], .form-group select:focus[b-h9xnq9kxyp], .form-textarea:focus[b-h9xnq9kxyp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h9xnq9kxyp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h9xnq9kxyp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h9xnq9kxyp] { flex: 1; display: flex; align-items: center; }
.form-check[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h9xnq9kxyp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h9xnq9kxyp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h9xnq9kxyp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h9xnq9kxyp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h9xnq9kxyp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h9xnq9kxyp] { font-size: 3rem; }
.photo-placeholder span[b-h9xnq9kxyp] { font-size: 0.78rem; }
.photo-actions[b-h9xnq9kxyp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h9xnq9kxyp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h9xnq9kxyp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h9xnq9kxyp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h9xnq9kxyp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h9xnq9kxyp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h9xnq9kxyp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h9xnq9kxyp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h9xnq9kxyp] { filter: brightness(1.15); transform: scale(1.05); }
[b-h9xnq9kxyp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h9xnq9kxyp] { padding: 0.75rem; }
    .crud-header[b-h9xnq9kxyp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h9xnq9kxyp] { font-size: 1.1rem; }
    .btn-text[b-h9xnq9kxyp] { display: none; }
    .form-row[b-h9xnq9kxyp] { flex-direction: column; }
    .form-row-4[b-h9xnq9kxyp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h9xnq9kxyp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h9xnq9kxyp] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h9xnq9kxyp] { padding: 0.75rem; }
    .modal-tabs[b-h9xnq9kxyp] { overflow-x: auto; }
    .modal-tab[b-h9xnq9kxyp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h9xnq9kxyp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h9xnq9kxyp] { display: grid !important; }
    .crud-cards-wrapper[b-h9xnq9kxyp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h9xnq9kxyp] { grid-template-columns: 1fr; }
    .card-details[b-h9xnq9kxyp] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h9xnq9kxyp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h9xnq9kxyp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h9xnq9kxyp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h9xnq9kxyp] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchksolicitudsimpleimpresion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vd2tpqwucn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vd2tpqwucn 0.3s ease-out; }
@keyframes slideUp-b-vd2tpqwucn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vd2tpqwucn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vd2tpqwucn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vd2tpqwucn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vd2tpqwucn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vd2tpqwucn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vd2tpqwucn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vd2tpqwucn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vd2tpqwucn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vd2tpqwucn] { filter: brightness(1.1); }
.btn-outline[b-vd2tpqwucn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vd2tpqwucn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vd2tpqwucn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vd2tpqwucn] { filter: brightness(1.1); }
.btn-icon[b-vd2tpqwucn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vd2tpqwucn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vd2tpqwucn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vd2tpqwucn] { color: #ef4444; }
.btn-delete:hover[b-vd2tpqwucn] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vd2tpqwucn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vd2tpqwucn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vd2tpqwucn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vd2tpqwucn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vd2tpqwucn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vd2tpqwucn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vd2tpqwucn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vd2tpqwucn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vd2tpqwucn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vd2tpqwucn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vd2tpqwucn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vd2tpqwucn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vd2tpqwucn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vd2tpqwucn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vd2tpqwucn] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vd2tpqwucn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vd2tpqwucn] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vd2tpqwucn] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vd2tpqwucn] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vd2tpqwucn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vd2tpqwucn] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vd2tpqwucn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vd2tpqwucn] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vd2tpqwucn] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vd2tpqwucn] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vd2tpqwucn] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vd2tpqwucn] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vd2tpqwucn] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vd2tpqwucn] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vd2tpqwucn] { display: block; }
.hide-on-cards[b-vd2tpqwucn] { display: none !important; }
.show-on-cards[b-vd2tpqwucn] { display: grid; }
.hide-on-grid[b-vd2tpqwucn] { display: none !important; }

/* Badges */
.badge[b-vd2tpqwucn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vd2tpqwucn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vd2tpqwucn] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vd2tpqwucn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vd2tpqwucn] { text-align: center; }
.text-muted[b-vd2tpqwucn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vd2tpqwucn], .crud-empty-state[b-vd2tpqwucn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vd2tpqwucn] { font-size: 2rem; }
.crud-spinner[b-vd2tpqwucn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vd2tpqwucn 0.6s linear infinite; }
.crud-spinner-sm[b-vd2tpqwucn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vd2tpqwucn 0.6s linear infinite; }
@keyframes spin-b-vd2tpqwucn { to { transform: rotate(360deg); } }
.spin[b-vd2tpqwucn] { animation: spin-b-vd2tpqwucn 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vd2tpqwucn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vd2tpqwucn 0.15s ease-out; }
.modal-container[b-vd2tpqwucn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vd2tpqwucn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vd2tpqwucn 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vd2tpqwucn] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vd2tpqwucn] { max-width: 420px; }
@keyframes fadeIn-b-vd2tpqwucn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vd2tpqwucn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vd2tpqwucn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vd2tpqwucn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vd2tpqwucn] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vd2tpqwucn] { color: #dc2626; }
.modal-close[b-vd2tpqwucn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vd2tpqwucn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vd2tpqwucn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vd2tpqwucn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vd2tpqwucn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vd2tpqwucn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vd2tpqwucn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vd2tpqwucn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vd2tpqwucn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vd2tpqwucn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vd2tpqwucn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vd2tpqwucn] { flex: 2; }
.form-group label[b-vd2tpqwucn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vd2tpqwucn], .form-group select[b-vd2tpqwucn], .form-textarea[b-vd2tpqwucn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vd2tpqwucn], .form-group select:focus[b-vd2tpqwucn], .form-textarea:focus[b-vd2tpqwucn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vd2tpqwucn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vd2tpqwucn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vd2tpqwucn] { flex: 1; display: flex; align-items: center; }
.form-check[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vd2tpqwucn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vd2tpqwucn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vd2tpqwucn] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vd2tpqwucn] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vd2tpqwucn] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vd2tpqwucn] { font-size: 3rem; }
.photo-placeholder span[b-vd2tpqwucn] { font-size: 0.78rem; }
.photo-actions[b-vd2tpqwucn] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vd2tpqwucn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vd2tpqwucn] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vd2tpqwucn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vd2tpqwucn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vd2tpqwucn] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vd2tpqwucn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vd2tpqwucn] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vd2tpqwucn] { filter: brightness(1.15); transform: scale(1.05); }
[b-vd2tpqwucn] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vd2tpqwucn] { padding: 0.75rem; }
    .crud-header[b-vd2tpqwucn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vd2tpqwucn] { font-size: 1.1rem; }
    .btn-text[b-vd2tpqwucn] { display: none; }
    .form-row[b-vd2tpqwucn] { flex-direction: column; }
    .form-row-4[b-vd2tpqwucn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vd2tpqwucn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vd2tpqwucn] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vd2tpqwucn] { padding: 0.75rem; }
    .modal-tabs[b-vd2tpqwucn] { overflow-x: auto; }
    .modal-tab[b-vd2tpqwucn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vd2tpqwucn] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vd2tpqwucn] { display: grid !important; }
    .crud-cards-wrapper[b-vd2tpqwucn] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vd2tpqwucn] { grid-template-columns: 1fr; }
    .card-details[b-vd2tpqwucn] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vd2tpqwucn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vd2tpqwucn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vd2tpqwucn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vd2tpqwucn] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchktransfierechequecontabilidad.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0ldilqto56] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0ldilqto56 0.3s ease-out; }
@keyframes slideUp-b-0ldilqto56 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0ldilqto56] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0ldilqto56] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0ldilqto56] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0ldilqto56] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0ldilqto56] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0ldilqto56] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0ldilqto56] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0ldilqto56] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0ldilqto56] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0ldilqto56] { filter: brightness(1.1); }
.btn-outline[b-0ldilqto56] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0ldilqto56] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0ldilqto56] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0ldilqto56] { filter: brightness(1.1); }
.btn-icon[b-0ldilqto56] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0ldilqto56] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0ldilqto56] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0ldilqto56] { color: #ef4444; }
.btn-delete:hover[b-0ldilqto56] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0ldilqto56] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0ldilqto56] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0ldilqto56] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0ldilqto56] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0ldilqto56] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0ldilqto56] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0ldilqto56] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0ldilqto56] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0ldilqto56] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0ldilqto56] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0ldilqto56] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0ldilqto56] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0ldilqto56] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0ldilqto56] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0ldilqto56] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0ldilqto56] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0ldilqto56] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0ldilqto56] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0ldilqto56] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0ldilqto56] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0ldilqto56] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0ldilqto56] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0ldilqto56] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0ldilqto56] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0ldilqto56] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0ldilqto56] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0ldilqto56] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0ldilqto56] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0ldilqto56] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0ldilqto56] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0ldilqto56] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0ldilqto56] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0ldilqto56] { display: block; }
.hide-on-cards[b-0ldilqto56] { display: none !important; }
.show-on-cards[b-0ldilqto56] { display: grid; }
.hide-on-grid[b-0ldilqto56] { display: none !important; }

/* Badges */
.badge[b-0ldilqto56] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0ldilqto56] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0ldilqto56] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0ldilqto56] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0ldilqto56] { text-align: center; }
.text-muted[b-0ldilqto56] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0ldilqto56], .crud-empty-state[b-0ldilqto56] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0ldilqto56] { font-size: 2rem; }
.crud-spinner[b-0ldilqto56] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0ldilqto56 0.6s linear infinite; }
.crud-spinner-sm[b-0ldilqto56] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0ldilqto56 0.6s linear infinite; }
@keyframes spin-b-0ldilqto56 { to { transform: rotate(360deg); } }
.spin[b-0ldilqto56] { animation: spin-b-0ldilqto56 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0ldilqto56] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0ldilqto56 0.15s ease-out; }
.modal-container[b-0ldilqto56] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0ldilqto56] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0ldilqto56 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0ldilqto56] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0ldilqto56] { max-width: 420px; }
@keyframes fadeIn-b-0ldilqto56 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0ldilqto56 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0ldilqto56] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0ldilqto56] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0ldilqto56] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0ldilqto56] { color: #dc2626; }
.modal-close[b-0ldilqto56] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0ldilqto56] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0ldilqto56] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0ldilqto56] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0ldilqto56] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0ldilqto56] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0ldilqto56] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0ldilqto56] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0ldilqto56] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0ldilqto56] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0ldilqto56] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0ldilqto56] { flex: 2; }
.form-group label[b-0ldilqto56] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0ldilqto56], .form-group select[b-0ldilqto56], .form-textarea[b-0ldilqto56] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0ldilqto56], .form-group select:focus[b-0ldilqto56], .form-textarea:focus[b-0ldilqto56] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0ldilqto56] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0ldilqto56] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0ldilqto56] { flex: 1; display: flex; align-items: center; }
.form-check[b-0ldilqto56] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0ldilqto56] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0ldilqto56] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0ldilqto56] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0ldilqto56] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0ldilqto56] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0ldilqto56] { font-size: 3rem; }
.photo-placeholder span[b-0ldilqto56] { font-size: 0.78rem; }
.photo-actions[b-0ldilqto56] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0ldilqto56] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0ldilqto56] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0ldilqto56] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0ldilqto56] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0ldilqto56] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0ldilqto56] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0ldilqto56] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0ldilqto56] { filter: brightness(1.15); transform: scale(1.05); }
[b-0ldilqto56] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0ldilqto56] { padding: 0.75rem; }
    .crud-header[b-0ldilqto56] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0ldilqto56] { font-size: 1.1rem; }
    .btn-text[b-0ldilqto56] { display: none; }
    .form-row[b-0ldilqto56] { flex-direction: column; }
    .form-row-4[b-0ldilqto56] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0ldilqto56] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0ldilqto56] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0ldilqto56] { padding: 0.75rem; }
    .modal-tabs[b-0ldilqto56] { overflow-x: auto; }
    .modal-tab[b-0ldilqto56] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0ldilqto56] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0ldilqto56] { display: grid !important; }
    .crud-cards-wrapper[b-0ldilqto56] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0ldilqto56] { grid-template-columns: 1fr; }
    .card-details[b-0ldilqto56] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0ldilqto56] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0ldilqto56] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0ldilqto56] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0ldilqto56] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmchk_anulacheque.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-cchgj6cagg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-cchgj6cagg 0.3s ease-out; }
@keyframes slideUp-b-cchgj6cagg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-cchgj6cagg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-cchgj6cagg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-cchgj6cagg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-cchgj6cagg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-cchgj6cagg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-cchgj6cagg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-cchgj6cagg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-cchgj6cagg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-cchgj6cagg] { filter: brightness(1.1); }
.btn-outline[b-cchgj6cagg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-cchgj6cagg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-cchgj6cagg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-cchgj6cagg] { filter: brightness(1.1); }
.btn-icon[b-cchgj6cagg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-cchgj6cagg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-cchgj6cagg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-cchgj6cagg] { color: #ef4444; }
.btn-delete:hover[b-cchgj6cagg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-cchgj6cagg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-cchgj6cagg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-cchgj6cagg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-cchgj6cagg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-cchgj6cagg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-cchgj6cagg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-cchgj6cagg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-cchgj6cagg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-cchgj6cagg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-cchgj6cagg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-cchgj6cagg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-cchgj6cagg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-cchgj6cagg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-cchgj6cagg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-cchgj6cagg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-cchgj6cagg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-cchgj6cagg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-cchgj6cagg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-cchgj6cagg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-cchgj6cagg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-cchgj6cagg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-cchgj6cagg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-cchgj6cagg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-cchgj6cagg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-cchgj6cagg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-cchgj6cagg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-cchgj6cagg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-cchgj6cagg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-cchgj6cagg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-cchgj6cagg] { display: block; }
.hide-on-cards[b-cchgj6cagg] { display: none !important; }
.show-on-cards[b-cchgj6cagg] { display: grid; }
.hide-on-grid[b-cchgj6cagg] { display: none !important; }

/* Badges */
.badge[b-cchgj6cagg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-cchgj6cagg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-cchgj6cagg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-cchgj6cagg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-cchgj6cagg] { text-align: center; }
.text-muted[b-cchgj6cagg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-cchgj6cagg], .crud-empty-state[b-cchgj6cagg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-cchgj6cagg] { font-size: 2rem; }
.crud-spinner[b-cchgj6cagg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-cchgj6cagg 0.6s linear infinite; }
.crud-spinner-sm[b-cchgj6cagg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-cchgj6cagg 0.6s linear infinite; }
@keyframes spin-b-cchgj6cagg { to { transform: rotate(360deg); } }
.spin[b-cchgj6cagg] { animation: spin-b-cchgj6cagg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-cchgj6cagg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-cchgj6cagg 0.15s ease-out; }
.modal-container[b-cchgj6cagg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-cchgj6cagg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-cchgj6cagg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-cchgj6cagg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-cchgj6cagg] { max-width: 420px; }
@keyframes fadeIn-b-cchgj6cagg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-cchgj6cagg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-cchgj6cagg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-cchgj6cagg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-cchgj6cagg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-cchgj6cagg] { color: #dc2626; }
.modal-close[b-cchgj6cagg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-cchgj6cagg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-cchgj6cagg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-cchgj6cagg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-cchgj6cagg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-cchgj6cagg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-cchgj6cagg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-cchgj6cagg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-cchgj6cagg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-cchgj6cagg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-cchgj6cagg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-cchgj6cagg] { flex: 2; }
.form-group label[b-cchgj6cagg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-cchgj6cagg], .form-group select[b-cchgj6cagg], .form-textarea[b-cchgj6cagg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-cchgj6cagg], .form-group select:focus[b-cchgj6cagg], .form-textarea:focus[b-cchgj6cagg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-cchgj6cagg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-cchgj6cagg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-cchgj6cagg] { flex: 1; display: flex; align-items: center; }
.form-check[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-cchgj6cagg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-cchgj6cagg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-cchgj6cagg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-cchgj6cagg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-cchgj6cagg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-cchgj6cagg] { font-size: 3rem; }
.photo-placeholder span[b-cchgj6cagg] { font-size: 0.78rem; }
.photo-actions[b-cchgj6cagg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-cchgj6cagg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-cchgj6cagg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-cchgj6cagg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-cchgj6cagg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-cchgj6cagg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-cchgj6cagg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-cchgj6cagg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-cchgj6cagg] { filter: brightness(1.15); transform: scale(1.05); }
[b-cchgj6cagg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-cchgj6cagg] { padding: 0.75rem; }
    .crud-header[b-cchgj6cagg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-cchgj6cagg] { font-size: 1.1rem; }
    .btn-text[b-cchgj6cagg] { display: none; }
    .form-row[b-cchgj6cagg] { flex-direction: column; }
    .form-row-4[b-cchgj6cagg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-cchgj6cagg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-cchgj6cagg] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-cchgj6cagg] { padding: 0.75rem; }
    .modal-tabs[b-cchgj6cagg] { overflow-x: auto; }
    .modal-tab[b-cchgj6cagg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-cchgj6cagg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-cchgj6cagg] { display: grid !important; }
    .crud-cards-wrapper[b-cchgj6cagg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-cchgj6cagg] { grid-template-columns: 1fr; }
    .card-details[b-cchgj6cagg] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-cchgj6cagg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cchgj6cagg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cchgj6cagg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cchgj6cagg] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cheques/Frmconciliacionbanco.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-j8v5uo9q4b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-j8v5uo9q4b 0.3s ease-out; }
@keyframes slideUp-b-j8v5uo9q4b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-j8v5uo9q4b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-j8v5uo9q4b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-j8v5uo9q4b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-j8v5uo9q4b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-j8v5uo9q4b] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-j8v5uo9q4b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-j8v5uo9q4b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-j8v5uo9q4b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-j8v5uo9q4b] { filter: brightness(1.1); }
.btn-outline[b-j8v5uo9q4b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-j8v5uo9q4b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-j8v5uo9q4b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-j8v5uo9q4b] { filter: brightness(1.1); }
.btn-icon[b-j8v5uo9q4b] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-j8v5uo9q4b] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-j8v5uo9q4b] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-j8v5uo9q4b] { color: #ef4444; }
.btn-delete:hover[b-j8v5uo9q4b] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-j8v5uo9q4b] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-j8v5uo9q4b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-j8v5uo9q4b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-j8v5uo9q4b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-j8v5uo9q4b] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-j8v5uo9q4b] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-j8v5uo9q4b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-j8v5uo9q4b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-j8v5uo9q4b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-j8v5uo9q4b] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-j8v5uo9q4b] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-j8v5uo9q4b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-j8v5uo9q4b] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-j8v5uo9q4b] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-j8v5uo9q4b] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-j8v5uo9q4b] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-j8v5uo9q4b] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-j8v5uo9q4b] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-j8v5uo9q4b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-j8v5uo9q4b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-j8v5uo9q4b] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-j8v5uo9q4b] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-j8v5uo9q4b] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-j8v5uo9q4b] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-j8v5uo9q4b] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-j8v5uo9q4b] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-j8v5uo9q4b] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-j8v5uo9q4b] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-j8v5uo9q4b] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-j8v5uo9q4b] { display: block; }
.hide-on-cards[b-j8v5uo9q4b] { display: none !important; }
.show-on-cards[b-j8v5uo9q4b] { display: grid; }
.hide-on-grid[b-j8v5uo9q4b] { display: none !important; }

/* Badges */
.badge[b-j8v5uo9q4b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-j8v5uo9q4b] { background: #ecfdf5; color: #065f46; }
.badge-no[b-j8v5uo9q4b] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-j8v5uo9q4b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-j8v5uo9q4b] { text-align: center; }
.text-muted[b-j8v5uo9q4b] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-j8v5uo9q4b], .crud-empty-state[b-j8v5uo9q4b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-j8v5uo9q4b] { font-size: 2rem; }
.crud-spinner[b-j8v5uo9q4b] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-j8v5uo9q4b 0.6s linear infinite; }
.crud-spinner-sm[b-j8v5uo9q4b] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-j8v5uo9q4b 0.6s linear infinite; }
@keyframes spin-b-j8v5uo9q4b { to { transform: rotate(360deg); } }
.spin[b-j8v5uo9q4b] { animation: spin-b-j8v5uo9q4b 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-j8v5uo9q4b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-j8v5uo9q4b 0.15s ease-out; }
.modal-container[b-j8v5uo9q4b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-j8v5uo9q4b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-j8v5uo9q4b 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-j8v5uo9q4b] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-j8v5uo9q4b] { max-width: 420px; }
@keyframes fadeIn-b-j8v5uo9q4b { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-j8v5uo9q4b { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-j8v5uo9q4b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-j8v5uo9q4b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-j8v5uo9q4b] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-j8v5uo9q4b] { color: #dc2626; }
.modal-close[b-j8v5uo9q4b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-j8v5uo9q4b] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-j8v5uo9q4b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-j8v5uo9q4b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-j8v5uo9q4b] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-j8v5uo9q4b] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-j8v5uo9q4b] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-j8v5uo9q4b] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-j8v5uo9q4b] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-j8v5uo9q4b] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-j8v5uo9q4b] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-j8v5uo9q4b] { flex: 2; }
.form-group label[b-j8v5uo9q4b] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-j8v5uo9q4b], .form-group select[b-j8v5uo9q4b], .form-textarea[b-j8v5uo9q4b] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-j8v5uo9q4b], .form-group select:focus[b-j8v5uo9q4b], .form-textarea:focus[b-j8v5uo9q4b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-j8v5uo9q4b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-j8v5uo9q4b] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-j8v5uo9q4b] { flex: 1; display: flex; align-items: center; }
.form-check[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-j8v5uo9q4b] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-j8v5uo9q4b] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-j8v5uo9q4b] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-j8v5uo9q4b] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-j8v5uo9q4b] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-j8v5uo9q4b] { font-size: 3rem; }
.photo-placeholder span[b-j8v5uo9q4b] { font-size: 0.78rem; }
.photo-actions[b-j8v5uo9q4b] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-j8v5uo9q4b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-j8v5uo9q4b] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-j8v5uo9q4b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-j8v5uo9q4b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-j8v5uo9q4b] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-j8v5uo9q4b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-j8v5uo9q4b] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-j8v5uo9q4b] { filter: brightness(1.15); transform: scale(1.05); }
[b-j8v5uo9q4b] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-j8v5uo9q4b] { padding: 0.75rem; }
    .crud-header[b-j8v5uo9q4b] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-j8v5uo9q4b] { font-size: 1.1rem; }
    .btn-text[b-j8v5uo9q4b] { display: none; }
    .form-row[b-j8v5uo9q4b] { flex-direction: column; }
    .form-row-4[b-j8v5uo9q4b] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-j8v5uo9q4b] { width: 98%; max-height: 95vh; }
    .modal-lg[b-j8v5uo9q4b] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-j8v5uo9q4b] { padding: 0.75rem; }
    .modal-tabs[b-j8v5uo9q4b] { overflow-x: auto; }
    .modal-tab[b-j8v5uo9q4b] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-j8v5uo9q4b] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-j8v5uo9q4b] { display: grid !important; }
    .crud-cards-wrapper[b-j8v5uo9q4b] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-j8v5uo9q4b] { grid-template-columns: 1fr; }
    .card-details[b-j8v5uo9q4b] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-j8v5uo9q4b] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-j8v5uo9q4b] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-j8v5uo9q4b] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-j8v5uo9q4b] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Clientes/Frmall_grupo_empresa.razor.rz.scp.css */
/* Grupo Empresa CRUD */
.crud-container[b-trgub12gar] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-trgub12gar 0.3s ease-out; }
@keyframes slideUp-b-trgub12gar { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.crud-header[b-trgub12gar] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-trgub12gar] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-trgub12gar] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-trgub12gar] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-trgub12gar] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-trgub12gar] { display: flex; gap: 0.5rem; }
.btn-crud[b-trgub12gar] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-trgub12gar] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-trgub12gar] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-trgub12gar] { filter: brightness(1.1); }
.btn-outline[b-trgub12gar] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-trgub12gar] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-trgub12gar] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-trgub12gar] { filter: brightness(1.1); }
.btn-icon[b-trgub12gar] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-trgub12gar] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-trgub12gar] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-trgub12gar] { color: #ef4444; }
.btn-delete:hover[b-trgub12gar] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-trgub12gar] { padding: 0.5rem 0.65rem; }
.crud-alert[b-trgub12gar] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-trgub12gar] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-trgub12gar] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-trgub12gar] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
.crud-search-bar[b-trgub12gar] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-trgub12gar] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-trgub12gar] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-trgub12gar] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-trgub12gar] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-grid-wrapper[b-trgub12gar] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-trgub12gar] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-trgub12gar] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-trgub12gar] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-trgub12gar] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-trgub12gar] { background: var(--rg-bg-hover, #f8fafc); }
.col-id[b-trgub12gar] { width: 120px; }
.col-actions[b-trgub12gar] { width: 80px; text-align: center; white-space: nowrap; }
.crud-cards-wrapper[b-trgub12gar] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-trgub12gar] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-trgub12gar] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-trgub12gar] { display: flex; justify-content: space-between; align-items: center; }
.card-id[b-trgub12gar] { font-size: 0.9rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.card-title[b-trgub12gar] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-trgub12gar] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }
.show-on-grid[b-trgub12gar] { display: block; } .hide-on-cards[b-trgub12gar] { display: none !important; } .show-on-cards[b-trgub12gar] { display: grid; } .hide-on-grid[b-trgub12gar] { display: none !important; }
.font-mono[b-trgub12gar] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-trgub12gar] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.crud-loading[b-trgub12gar], .crud-empty-state[b-trgub12gar] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-trgub12gar] { font-size: 2rem; }
.crud-spinner[b-trgub12gar] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-trgub12gar 0.6s linear infinite; }
.crud-spinner-sm[b-trgub12gar] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-trgub12gar 0.6s linear infinite; }
@keyframes spin-b-trgub12gar { to { transform: rotate(360deg); } }
.spin[b-trgub12gar] { animation: spin-b-trgub12gar 0.8s linear infinite; }
.modal-backdrop[b-trgub12gar] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-trgub12gar 0.15s ease-out; }
.modal-container[b-trgub12gar] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-trgub12gar] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 500px; max-height: 85vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-trgub12gar 0.2s ease-out; }
.modal-sm[b-trgub12gar] { max-width: 420px; }
@keyframes fadeIn-b-trgub12gar { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-trgub12gar { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-trgub12gar] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.modal-header h2[b-trgub12gar] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-trgub12gar] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-trgub12gar] { color: #dc2626; }
.modal-close[b-trgub12gar] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-trgub12gar] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-trgub12gar] { padding: 1.25rem; }
.modal-footer[b-trgub12gar] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.form-row[b-trgub12gar] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.form-group[b-trgub12gar] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.form-group label[b-trgub12gar] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-trgub12gar] { padding: 0.5rem 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-trgub12gar] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-trgub12gar] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

/* ---- Tabs ---- */
.crud-tabs[b-trgub12gar] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; overflow-x: auto; }
.crud-tab[b-trgub12gar] { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.65rem 1.1rem; border: none; background: transparent; color: var(--rg-text-secondary, #475569); font-size: 0.82rem; font-weight: 600; cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -2px; transition: all 0.15s; white-space: nowrap; }
.crud-tab:hover[b-trgub12gar] { color: var(--rg-accent, #4f46e5); background: var(--rg-bg-hover, #f8fafc); }
.crud-tab.active[b-trgub12gar] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }
.crud-tab i[b-trgub12gar] { font-size: 1rem; }
.crud-tab-badge[b-trgub12gar] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.25rem; padding: 0 0.4rem; border-radius: 999px; background: var(--rg-border-light, #f1f5f9); color: var(--rg-text-secondary, #475569); font-size: 0.68rem; font-weight: 700; }
.crud-tab.active .crud-tab-badge[b-trgub12gar] { background: var(--rg-accent, #4f46e5); color: #fff; }

@media (max-width: 768px) {
    .crud-container[b-trgub12gar] { padding: 0.75rem; } .crud-header[b-trgub12gar] { flex-direction: column; align-items: flex-start; } .btn-text[b-trgub12gar] { display: none; }
    .form-row[b-trgub12gar] { flex-direction: column; } .modal-dialog[b-trgub12gar] { width: 98%; max-height: 90vh; }
    .crud-grid-wrapper.show-on-grid[b-trgub12gar] { display: none !important; } .crud-cards-wrapper.hide-on-grid[b-trgub12gar] { display: grid !important; }
    .crud-cards-wrapper[b-trgub12gar] { grid-template-columns: 1fr; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-trgub12gar] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-trgub12gar] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-trgub12gar] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-trgub12gar] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Clientes/Frmall_tipo_ncf.razor.rz.scp.css */
/* Grupo Empresa CRUD */
.crud-container[b-ynfrpoqv3d] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ynfrpoqv3d 0.3s ease-out; }
@keyframes slideUp-b-ynfrpoqv3d { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.crud-header[b-ynfrpoqv3d] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ynfrpoqv3d] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ynfrpoqv3d] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ynfrpoqv3d] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ynfrpoqv3d] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ynfrpoqv3d] { display: flex; gap: 0.5rem; }
.btn-crud[b-ynfrpoqv3d] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ynfrpoqv3d] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ynfrpoqv3d] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ynfrpoqv3d] { filter: brightness(1.1); }
.btn-outline[b-ynfrpoqv3d] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ynfrpoqv3d] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ynfrpoqv3d] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ynfrpoqv3d] { filter: brightness(1.1); }
.btn-icon[b-ynfrpoqv3d] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ynfrpoqv3d] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ynfrpoqv3d] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ynfrpoqv3d] { color: #ef4444; }
.btn-delete:hover[b-ynfrpoqv3d] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ynfrpoqv3d] { padding: 0.5rem 0.65rem; }
.crud-alert[b-ynfrpoqv3d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ynfrpoqv3d] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ynfrpoqv3d] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ynfrpoqv3d] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
.crud-search-bar[b-ynfrpoqv3d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ynfrpoqv3d] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ynfrpoqv3d] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ynfrpoqv3d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ynfrpoqv3d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-grid-wrapper[b-ynfrpoqv3d] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ynfrpoqv3d] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ynfrpoqv3d] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ynfrpoqv3d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ynfrpoqv3d] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ynfrpoqv3d] { background: var(--rg-bg-hover, #f8fafc); }
.col-id[b-ynfrpoqv3d] { width: 120px; }
.col-actions[b-ynfrpoqv3d] { width: 80px; text-align: center; white-space: nowrap; }
.crud-cards-wrapper[b-ynfrpoqv3d] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ynfrpoqv3d] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ynfrpoqv3d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ynfrpoqv3d] { display: flex; justify-content: space-between; align-items: center; }
.card-id[b-ynfrpoqv3d] { font-size: 0.9rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.card-title[b-ynfrpoqv3d] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ynfrpoqv3d] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }
.show-on-grid[b-ynfrpoqv3d] { display: block; } .hide-on-cards[b-ynfrpoqv3d] { display: none !important; } .show-on-cards[b-ynfrpoqv3d] { display: grid; } .hide-on-grid[b-ynfrpoqv3d] { display: none !important; }
.font-mono[b-ynfrpoqv3d] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-ynfrpoqv3d] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.crud-loading[b-ynfrpoqv3d], .crud-empty-state[b-ynfrpoqv3d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ynfrpoqv3d] { font-size: 2rem; }
.crud-spinner[b-ynfrpoqv3d] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ynfrpoqv3d 0.6s linear infinite; }
.crud-spinner-sm[b-ynfrpoqv3d] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ynfrpoqv3d 0.6s linear infinite; }
@keyframes spin-b-ynfrpoqv3d { to { transform: rotate(360deg); } }
.spin[b-ynfrpoqv3d] { animation: spin-b-ynfrpoqv3d 0.8s linear infinite; }
.modal-backdrop[b-ynfrpoqv3d] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ynfrpoqv3d 0.15s ease-out; }
.modal-container[b-ynfrpoqv3d] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ynfrpoqv3d] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 500px; max-height: 85vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ynfrpoqv3d 0.2s ease-out; }
.modal-sm[b-ynfrpoqv3d] { max-width: 420px; }
@keyframes fadeIn-b-ynfrpoqv3d { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ynfrpoqv3d { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-ynfrpoqv3d] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.modal-header h2[b-ynfrpoqv3d] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ynfrpoqv3d] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ynfrpoqv3d] { color: #dc2626; }
.modal-close[b-ynfrpoqv3d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ynfrpoqv3d] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ynfrpoqv3d] { padding: 1.25rem; }
.modal-footer[b-ynfrpoqv3d] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.form-row[b-ynfrpoqv3d] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.form-group[b-ynfrpoqv3d] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.form-group label[b-ynfrpoqv3d] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ynfrpoqv3d] { padding: 0.5rem 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ynfrpoqv3d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ynfrpoqv3d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
@media (max-width: 768px) {
    .crud-container[b-ynfrpoqv3d] { padding: 0.75rem; } .crud-header[b-ynfrpoqv3d] { flex-direction: column; align-items: flex-start; } .btn-text[b-ynfrpoqv3d] { display: none; }
    .form-row[b-ynfrpoqv3d] { flex-direction: column; } .modal-dialog[b-ynfrpoqv3d] { width: 98%; max-height: 90vh; }
    .crud-grid-wrapper.show-on-grid[b-ynfrpoqv3d] { display: none !important; } .crud-cards-wrapper.hide-on-grid[b-ynfrpoqv3d] { display: grid !important; }
    .crud-cards-wrapper[b-ynfrpoqv3d] { grid-template-columns: 1fr; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ynfrpoqv3d] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ynfrpoqv3d] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ynfrpoqv3d] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ynfrpoqv3d] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Clientes/Frmciudad_y_zona.razor.rz.scp.css */
/* Grupo Empresa CRUD */
.crud-container[b-z7zi6uajep] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-z7zi6uajep 0.3s ease-out; }
@keyframes slideUp-b-z7zi6uajep { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.crud-header[b-z7zi6uajep] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-z7zi6uajep] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-z7zi6uajep] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-z7zi6uajep] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-z7zi6uajep] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-z7zi6uajep] { display: flex; gap: 0.5rem; }
.btn-crud[b-z7zi6uajep] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-z7zi6uajep] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-z7zi6uajep] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-z7zi6uajep] { filter: brightness(1.1); }
.btn-outline[b-z7zi6uajep] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-z7zi6uajep] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-z7zi6uajep] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-z7zi6uajep] { filter: brightness(1.1); }
.btn-icon[b-z7zi6uajep] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-z7zi6uajep] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-z7zi6uajep] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-z7zi6uajep] { color: #ef4444; }
.btn-delete:hover[b-z7zi6uajep] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-z7zi6uajep] { padding: 0.5rem 0.65rem; }
.crud-alert[b-z7zi6uajep] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-z7zi6uajep] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-z7zi6uajep] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-z7zi6uajep] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
.crud-search-bar[b-z7zi6uajep] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-z7zi6uajep] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-z7zi6uajep] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-z7zi6uajep] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-z7zi6uajep] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-grid-wrapper[b-z7zi6uajep] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-z7zi6uajep] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-z7zi6uajep] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-z7zi6uajep] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-z7zi6uajep] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-z7zi6uajep] { background: var(--rg-bg-hover, #f8fafc); }
.col-id[b-z7zi6uajep] { width: 120px; }
.col-actions[b-z7zi6uajep] { width: 80px; text-align: center; white-space: nowrap; }
.crud-cards-wrapper[b-z7zi6uajep] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-z7zi6uajep] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-z7zi6uajep] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-z7zi6uajep] { display: flex; justify-content: space-between; align-items: center; }
.card-id[b-z7zi6uajep] { font-size: 0.9rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.card-title[b-z7zi6uajep] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-z7zi6uajep] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }
.show-on-grid[b-z7zi6uajep] { display: block; } .hide-on-cards[b-z7zi6uajep] { display: none !important; } .show-on-cards[b-z7zi6uajep] { display: grid; } .hide-on-grid[b-z7zi6uajep] { display: none !important; }
.font-mono[b-z7zi6uajep] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-z7zi6uajep] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.crud-loading[b-z7zi6uajep], .crud-empty-state[b-z7zi6uajep] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-z7zi6uajep] { font-size: 2rem; }
.crud-spinner[b-z7zi6uajep] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-z7zi6uajep 0.6s linear infinite; }
.crud-spinner-sm[b-z7zi6uajep] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-z7zi6uajep 0.6s linear infinite; }
@keyframes spin-b-z7zi6uajep { to { transform: rotate(360deg); } }
.spin[b-z7zi6uajep] { animation: spin-b-z7zi6uajep 0.8s linear infinite; }
.modal-backdrop[b-z7zi6uajep] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-z7zi6uajep 0.15s ease-out; }
.modal-container[b-z7zi6uajep] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-z7zi6uajep] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 500px; max-height: 85vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-z7zi6uajep 0.2s ease-out; }
.modal-sm[b-z7zi6uajep] { max-width: 420px; }
@keyframes fadeIn-b-z7zi6uajep { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-z7zi6uajep { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-z7zi6uajep] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.modal-header h2[b-z7zi6uajep] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-z7zi6uajep] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-z7zi6uajep] { color: #dc2626; }
.modal-close[b-z7zi6uajep] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-z7zi6uajep] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-z7zi6uajep] { padding: 1.25rem; }
.modal-footer[b-z7zi6uajep] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.form-row[b-z7zi6uajep] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.form-group[b-z7zi6uajep] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.form-group label[b-z7zi6uajep] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-z7zi6uajep] { padding: 0.5rem 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-z7zi6uajep] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-z7zi6uajep] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
@media (max-width: 768px) {
    .crud-container[b-z7zi6uajep] { padding: 0.75rem; } .crud-header[b-z7zi6uajep] { flex-direction: column; align-items: flex-start; } .btn-text[b-z7zi6uajep] { display: none; }
    .form-row[b-z7zi6uajep] { flex-direction: column; } .modal-dialog[b-z7zi6uajep] { width: 98%; max-height: 90vh; }
    .crud-grid-wrapper.show-on-grid[b-z7zi6uajep] { display: none !important; } .crud-cards-wrapper.hide-on-grid[b-z7zi6uajep] { display: grid !important; }
    .crud-cards-wrapper[b-z7zi6uajep] { grid-template-columns: 1fr; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-z7zi6uajep] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-z7zi6uajep] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-z7zi6uajep] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-z7zi6uajep] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Clientes/Frmclientes.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-x4gm2gr9sy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x4gm2gr9sy 0.3s ease-out; }
@keyframes slideUp-b-x4gm2gr9sy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x4gm2gr9sy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x4gm2gr9sy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x4gm2gr9sy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x4gm2gr9sy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x4gm2gr9sy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x4gm2gr9sy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x4gm2gr9sy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x4gm2gr9sy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x4gm2gr9sy] { filter: brightness(1.1); }
.btn-outline[b-x4gm2gr9sy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x4gm2gr9sy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x4gm2gr9sy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x4gm2gr9sy] { filter: brightness(1.1); }
.btn-icon[b-x4gm2gr9sy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x4gm2gr9sy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x4gm2gr9sy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-x4gm2gr9sy] { color: #ef4444; }
.btn-delete:hover[b-x4gm2gr9sy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-x4gm2gr9sy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x4gm2gr9sy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x4gm2gr9sy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x4gm2gr9sy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-x4gm2gr9sy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-x4gm2gr9sy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-x4gm2gr9sy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-x4gm2gr9sy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-x4gm2gr9sy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-x4gm2gr9sy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x4gm2gr9sy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x4gm2gr9sy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x4gm2gr9sy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x4gm2gr9sy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x4gm2gr9sy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-x4gm2gr9sy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-x4gm2gr9sy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-x4gm2gr9sy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-x4gm2gr9sy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-x4gm2gr9sy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-x4gm2gr9sy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-x4gm2gr9sy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-x4gm2gr9sy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-x4gm2gr9sy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-x4gm2gr9sy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-x4gm2gr9sy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-x4gm2gr9sy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-x4gm2gr9sy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-x4gm2gr9sy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-x4gm2gr9sy] { display: block; }
.hide-on-cards[b-x4gm2gr9sy] { display: none !important; }
.show-on-cards[b-x4gm2gr9sy] { display: grid; }
.hide-on-grid[b-x4gm2gr9sy] { display: none !important; }

/* Badges */
.badge[b-x4gm2gr9sy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-x4gm2gr9sy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-x4gm2gr9sy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-x4gm2gr9sy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x4gm2gr9sy] { text-align: center; }
.text-muted[b-x4gm2gr9sy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-x4gm2gr9sy], .crud-empty-state[b-x4gm2gr9sy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x4gm2gr9sy] { font-size: 2rem; }
.crud-spinner[b-x4gm2gr9sy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x4gm2gr9sy 0.6s linear infinite; }
.crud-spinner-sm[b-x4gm2gr9sy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x4gm2gr9sy 0.6s linear infinite; }
@keyframes spin-b-x4gm2gr9sy { to { transform: rotate(360deg); } }
.spin[b-x4gm2gr9sy] { animation: spin-b-x4gm2gr9sy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-x4gm2gr9sy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x4gm2gr9sy 0.15s ease-out; }
.modal-container[b-x4gm2gr9sy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x4gm2gr9sy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x4gm2gr9sy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-x4gm2gr9sy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-x4gm2gr9sy] { max-width: 420px; }
@keyframes fadeIn-b-x4gm2gr9sy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x4gm2gr9sy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x4gm2gr9sy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x4gm2gr9sy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-x4gm2gr9sy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-x4gm2gr9sy] { color: #dc2626; }
.modal-close[b-x4gm2gr9sy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x4gm2gr9sy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x4gm2gr9sy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x4gm2gr9sy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-x4gm2gr9sy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-x4gm2gr9sy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-x4gm2gr9sy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-x4gm2gr9sy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-x4gm2gr9sy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-x4gm2gr9sy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-x4gm2gr9sy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-x4gm2gr9sy] { flex: 2; }
.form-group label[b-x4gm2gr9sy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-x4gm2gr9sy], .form-group select[b-x4gm2gr9sy], .form-textarea[b-x4gm2gr9sy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-x4gm2gr9sy], .form-group select:focus[b-x4gm2gr9sy], .form-textarea:focus[b-x4gm2gr9sy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-x4gm2gr9sy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-x4gm2gr9sy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-x4gm2gr9sy] { flex: 1; display: flex; align-items: center; }
.form-check[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-x4gm2gr9sy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-x4gm2gr9sy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-x4gm2gr9sy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-x4gm2gr9sy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-x4gm2gr9sy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-x4gm2gr9sy] { font-size: 3rem; }
.photo-placeholder span[b-x4gm2gr9sy] { font-size: 0.78rem; }
.photo-actions[b-x4gm2gr9sy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-x4gm2gr9sy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-x4gm2gr9sy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-x4gm2gr9sy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-x4gm2gr9sy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-x4gm2gr9sy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-x4gm2gr9sy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-x4gm2gr9sy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-x4gm2gr9sy] { filter: brightness(1.15); transform: scale(1.05); }
[b-x4gm2gr9sy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-x4gm2gr9sy] { padding: 0.75rem; }
    .crud-header[b-x4gm2gr9sy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x4gm2gr9sy] { font-size: 1.1rem; }
    .btn-text[b-x4gm2gr9sy] { display: none; }
    .form-row[b-x4gm2gr9sy] { flex-direction: column; }
    .form-row-4[b-x4gm2gr9sy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-x4gm2gr9sy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x4gm2gr9sy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-x4gm2gr9sy] { padding: 0.75rem; }
    .modal-tabs[b-x4gm2gr9sy] { overflow-x: auto; }
    .modal-tab[b-x4gm2gr9sy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-x4gm2gr9sy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-x4gm2gr9sy] { display: grid !important; }
    .crud-cards-wrapper[b-x4gm2gr9sy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-x4gm2gr9sy] { grid-template-columns: 1fr; }
    .card-details[b-x4gm2gr9sy] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-x4gm2gr9sy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x4gm2gr9sy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x4gm2gr9sy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x4gm2gr9sy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Clientes/Frmreporteclientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zm97hmszuq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zm97hmszuq 0.3s ease-out; }
@keyframes slideUp-b-zm97hmszuq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zm97hmszuq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zm97hmszuq] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zm97hmszuq] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zm97hmszuq] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zm97hmszuq] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zm97hmszuq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zm97hmszuq] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zm97hmszuq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zm97hmszuq] { filter: brightness(1.1); }
.btn-outline[b-zm97hmszuq] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zm97hmszuq] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zm97hmszuq] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zm97hmszuq] { filter: brightness(1.1); }
.btn-icon[b-zm97hmszuq] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zm97hmszuq] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zm97hmszuq] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zm97hmszuq] { color: #ef4444; }
.btn-delete:hover[b-zm97hmszuq] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zm97hmszuq] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zm97hmszuq] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zm97hmszuq] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zm97hmszuq] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zm97hmszuq] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zm97hmszuq] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zm97hmszuq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zm97hmszuq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zm97hmszuq] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zm97hmszuq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zm97hmszuq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zm97hmszuq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zm97hmszuq] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zm97hmszuq] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zm97hmszuq] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zm97hmszuq] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zm97hmszuq] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zm97hmszuq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zm97hmszuq] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zm97hmszuq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zm97hmszuq] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zm97hmszuq] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zm97hmszuq] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zm97hmszuq] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zm97hmszuq] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zm97hmszuq] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zm97hmszuq] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zm97hmszuq] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zm97hmszuq] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zm97hmszuq] { display: block; }
.hide-on-cards[b-zm97hmszuq] { display: none !important; }
.show-on-cards[b-zm97hmszuq] { display: grid; }
.hide-on-grid[b-zm97hmszuq] { display: none !important; }

/* Badges */
.badge[b-zm97hmszuq] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zm97hmszuq] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zm97hmszuq] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zm97hmszuq] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zm97hmszuq] { text-align: center; }
.text-muted[b-zm97hmszuq] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zm97hmszuq], .crud-empty-state[b-zm97hmszuq] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zm97hmszuq] { font-size: 2rem; }
.crud-spinner[b-zm97hmszuq] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zm97hmszuq 0.6s linear infinite; }
.crud-spinner-sm[b-zm97hmszuq] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zm97hmszuq 0.6s linear infinite; }
@keyframes spin-b-zm97hmszuq { to { transform: rotate(360deg); } }
.spin[b-zm97hmszuq] { animation: spin-b-zm97hmszuq 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zm97hmszuq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zm97hmszuq 0.15s ease-out; }
.modal-container[b-zm97hmszuq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zm97hmszuq] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zm97hmszuq 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zm97hmszuq] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zm97hmszuq] { max-width: 420px; }
@keyframes fadeIn-b-zm97hmszuq { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zm97hmszuq { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zm97hmszuq] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zm97hmszuq] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zm97hmszuq] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zm97hmszuq] { color: #dc2626; }
.modal-close[b-zm97hmszuq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zm97hmszuq] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zm97hmszuq] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zm97hmszuq] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zm97hmszuq] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zm97hmszuq] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zm97hmszuq] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zm97hmszuq] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zm97hmszuq] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zm97hmszuq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zm97hmszuq] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zm97hmszuq] { flex: 2; }
.form-group label[b-zm97hmszuq] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zm97hmszuq], .form-group select[b-zm97hmszuq], .form-textarea[b-zm97hmszuq] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zm97hmszuq], .form-group select:focus[b-zm97hmszuq], .form-textarea:focus[b-zm97hmszuq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zm97hmszuq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zm97hmszuq] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zm97hmszuq] { flex: 1; display: flex; align-items: center; }
.form-check[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zm97hmszuq] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zm97hmszuq] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zm97hmszuq] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zm97hmszuq] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zm97hmszuq] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zm97hmszuq] { font-size: 3rem; }
.photo-placeholder span[b-zm97hmszuq] { font-size: 0.78rem; }
.photo-actions[b-zm97hmszuq] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zm97hmszuq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zm97hmszuq] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zm97hmszuq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zm97hmszuq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zm97hmszuq] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zm97hmszuq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zm97hmszuq] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zm97hmszuq] { filter: brightness(1.15); transform: scale(1.05); }
[b-zm97hmszuq] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zm97hmszuq] { padding: 0.75rem; }
    .crud-header[b-zm97hmszuq] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zm97hmszuq] { font-size: 1.1rem; }
    .btn-text[b-zm97hmszuq] { display: none; }
    .form-row[b-zm97hmszuq] { flex-direction: column; }
    .form-row-4[b-zm97hmszuq] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zm97hmszuq] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zm97hmszuq] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zm97hmszuq] { padding: 0.75rem; }
    .modal-tabs[b-zm97hmszuq] { overflow-x: auto; }
    .modal-tab[b-zm97hmszuq] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zm97hmszuq] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zm97hmszuq] { display: grid !important; }
    .crud-cards-wrapper[b-zm97hmszuq] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zm97hmszuq] { grid-template-columns: 1fr; }
    .card-details[b-zm97hmszuq] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zm97hmszuq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zm97hmszuq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zm97hmszuq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zm97hmszuq] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbranuladocumento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-5av8dpk8od] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5av8dpk8od 0.3s ease-out; }
@keyframes slideUp-b-5av8dpk8od { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5av8dpk8od] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5av8dpk8od] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5av8dpk8od] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5av8dpk8od] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5av8dpk8od] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5av8dpk8od] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5av8dpk8od] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5av8dpk8od] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5av8dpk8od] { filter: brightness(1.1); }
.btn-outline[b-5av8dpk8od] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5av8dpk8od] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5av8dpk8od] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5av8dpk8od] { filter: brightness(1.1); }
.btn-icon[b-5av8dpk8od] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5av8dpk8od] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5av8dpk8od] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5av8dpk8od] { color: #ef4444; }
.btn-delete:hover[b-5av8dpk8od] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-5av8dpk8od] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5av8dpk8od] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-5av8dpk8od] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-5av8dpk8od] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5av8dpk8od] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5av8dpk8od] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-5av8dpk8od] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5av8dpk8od] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-5av8dpk8od] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5av8dpk8od] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5av8dpk8od] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5av8dpk8od] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-5av8dpk8od] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5av8dpk8od] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-5av8dpk8od] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-5av8dpk8od] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-5av8dpk8od] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-5av8dpk8od] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-5av8dpk8od] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-5av8dpk8od] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-5av8dpk8od] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-5av8dpk8od] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-5av8dpk8od] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-5av8dpk8od] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-5av8dpk8od] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-5av8dpk8od] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-5av8dpk8od] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-5av8dpk8od] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-5av8dpk8od] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-5av8dpk8od] { display: block; }
.hide-on-cards[b-5av8dpk8od] { display: none !important; }
.show-on-cards[b-5av8dpk8od] { display: grid; }
.hide-on-grid[b-5av8dpk8od] { display: none !important; }

/* Badges */
.badge[b-5av8dpk8od] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5av8dpk8od] { background: #ecfdf5; color: #065f46; }
.badge-no[b-5av8dpk8od] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-5av8dpk8od] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-5av8dpk8od] { text-align: center; }
.text-muted[b-5av8dpk8od] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-5av8dpk8od], .crud-empty-state[b-5av8dpk8od] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5av8dpk8od] { font-size: 2rem; }
.crud-spinner[b-5av8dpk8od] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5av8dpk8od 0.6s linear infinite; }
.crud-spinner-sm[b-5av8dpk8od] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5av8dpk8od 0.6s linear infinite; }
@keyframes spin-b-5av8dpk8od { to { transform: rotate(360deg); } }
.spin[b-5av8dpk8od] { animation: spin-b-5av8dpk8od 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-5av8dpk8od] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5av8dpk8od 0.15s ease-out; }
.modal-container[b-5av8dpk8od] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5av8dpk8od] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5av8dpk8od 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-5av8dpk8od] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-5av8dpk8od] { max-width: 420px; }
@keyframes fadeIn-b-5av8dpk8od { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5av8dpk8od { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-5av8dpk8od] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5av8dpk8od] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-5av8dpk8od] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-5av8dpk8od] { color: #dc2626; }
.modal-close[b-5av8dpk8od] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5av8dpk8od] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5av8dpk8od] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5av8dpk8od] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-5av8dpk8od] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-5av8dpk8od] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-5av8dpk8od] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-5av8dpk8od] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-5av8dpk8od] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-5av8dpk8od] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-5av8dpk8od] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-5av8dpk8od] { flex: 2; }
.form-group label[b-5av8dpk8od] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5av8dpk8od], .form-group select[b-5av8dpk8od], .form-textarea[b-5av8dpk8od] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5av8dpk8od], .form-group select:focus[b-5av8dpk8od], .form-textarea:focus[b-5av8dpk8od] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-5av8dpk8od] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-5av8dpk8od] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-5av8dpk8od] { flex: 1; display: flex; align-items: center; }
.form-check[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-5av8dpk8od] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-5av8dpk8od] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-5av8dpk8od] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-5av8dpk8od] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-5av8dpk8od] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-5av8dpk8od] { font-size: 3rem; }
.photo-placeholder span[b-5av8dpk8od] { font-size: 0.78rem; }
.photo-actions[b-5av8dpk8od] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-5av8dpk8od] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-5av8dpk8od] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-5av8dpk8od] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-5av8dpk8od] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-5av8dpk8od] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-5av8dpk8od] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-5av8dpk8od] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-5av8dpk8od] { filter: brightness(1.15); transform: scale(1.05); }
[b-5av8dpk8od] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-5av8dpk8od] { padding: 0.75rem; }
    .crud-header[b-5av8dpk8od] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5av8dpk8od] { font-size: 1.1rem; }
    .btn-text[b-5av8dpk8od] { display: none; }
    .form-row[b-5av8dpk8od] { flex-direction: column; }
    .form-row-4[b-5av8dpk8od] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-5av8dpk8od] { width: 98%; max-height: 95vh; }
    .modal-lg[b-5av8dpk8od] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-5av8dpk8od] { padding: 0.75rem; }
    .modal-tabs[b-5av8dpk8od] { overflow-x: auto; }
    .modal-tab[b-5av8dpk8od] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-5av8dpk8od] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-5av8dpk8od] { display: grid !important; }
    .crud-cards-wrapper[b-5av8dpk8od] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-5av8dpk8od] { grid-template-columns: 1fr; }
    .card-details[b-5av8dpk8od] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-5av8dpk8od] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5av8dpk8od] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5av8dpk8od] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5av8dpk8od] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrcobroexterno.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-eis7g8gat7] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-eis7g8gat7 0.3s ease-out; }
@keyframes slideUp-b-eis7g8gat7 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-eis7g8gat7] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eis7g8gat7] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-eis7g8gat7] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-eis7g8gat7] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-eis7g8gat7] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-eis7g8gat7] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-eis7g8gat7] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-eis7g8gat7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eis7g8gat7] { filter: brightness(1.1); }
.btn-outline[b-eis7g8gat7] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-eis7g8gat7] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-eis7g8gat7] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-eis7g8gat7] { filter: brightness(1.1); }
.btn-icon[b-eis7g8gat7] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-eis7g8gat7] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-eis7g8gat7] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-eis7g8gat7] { color: #ef4444; }
.btn-delete:hover[b-eis7g8gat7] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-eis7g8gat7] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-eis7g8gat7] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-eis7g8gat7] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-eis7g8gat7] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-eis7g8gat7] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-eis7g8gat7] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-eis7g8gat7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-eis7g8gat7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-eis7g8gat7] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-eis7g8gat7] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-eis7g8gat7] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-eis7g8gat7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-eis7g8gat7] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-eis7g8gat7] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-eis7g8gat7] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-eis7g8gat7] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-eis7g8gat7] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-eis7g8gat7] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-eis7g8gat7] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-eis7g8gat7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-eis7g8gat7] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-eis7g8gat7] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-eis7g8gat7] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-eis7g8gat7] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-eis7g8gat7] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-eis7g8gat7] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-eis7g8gat7] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-eis7g8gat7] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-eis7g8gat7] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-eis7g8gat7] { display: block; }
.hide-on-cards[b-eis7g8gat7] { display: none !important; }
.show-on-cards[b-eis7g8gat7] { display: grid; }
.hide-on-grid[b-eis7g8gat7] { display: none !important; }

/* Badges */
.badge[b-eis7g8gat7] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-eis7g8gat7] { background: #ecfdf5; color: #065f46; }
.badge-no[b-eis7g8gat7] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-eis7g8gat7] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-eis7g8gat7] { text-align: center; }
.text-muted[b-eis7g8gat7] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-eis7g8gat7], .crud-empty-state[b-eis7g8gat7] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-eis7g8gat7] { font-size: 2rem; }
.crud-spinner[b-eis7g8gat7] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-eis7g8gat7 0.6s linear infinite; }
.crud-spinner-sm[b-eis7g8gat7] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-eis7g8gat7 0.6s linear infinite; }
@keyframes spin-b-eis7g8gat7 { to { transform: rotate(360deg); } }
.spin[b-eis7g8gat7] { animation: spin-b-eis7g8gat7 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-eis7g8gat7] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-eis7g8gat7 0.15s ease-out; }
.modal-container[b-eis7g8gat7] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-eis7g8gat7] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-eis7g8gat7 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-eis7g8gat7] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-eis7g8gat7] { max-width: 420px; }
@keyframes fadeIn-b-eis7g8gat7 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-eis7g8gat7 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-eis7g8gat7] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-eis7g8gat7] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-eis7g8gat7] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-eis7g8gat7] { color: #dc2626; }
.modal-close[b-eis7g8gat7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-eis7g8gat7] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-eis7g8gat7] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eis7g8gat7] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-eis7g8gat7] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-eis7g8gat7] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-eis7g8gat7] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-eis7g8gat7] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-eis7g8gat7] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-eis7g8gat7] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-eis7g8gat7] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-eis7g8gat7] { flex: 2; }
.form-group label[b-eis7g8gat7] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-eis7g8gat7], .form-group select[b-eis7g8gat7], .form-textarea[b-eis7g8gat7] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-eis7g8gat7], .form-group select:focus[b-eis7g8gat7], .form-textarea:focus[b-eis7g8gat7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-eis7g8gat7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-eis7g8gat7] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-eis7g8gat7] { flex: 1; display: flex; align-items: center; }
.form-check[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-eis7g8gat7] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-eis7g8gat7] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-eis7g8gat7] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-eis7g8gat7] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-eis7g8gat7] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-eis7g8gat7] { font-size: 3rem; }
.photo-placeholder span[b-eis7g8gat7] { font-size: 0.78rem; }
.photo-actions[b-eis7g8gat7] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-eis7g8gat7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-eis7g8gat7] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-eis7g8gat7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-eis7g8gat7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-eis7g8gat7] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-eis7g8gat7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-eis7g8gat7] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-eis7g8gat7] { filter: brightness(1.15); transform: scale(1.05); }
[b-eis7g8gat7] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-eis7g8gat7] { padding: 0.75rem; }
    .crud-header[b-eis7g8gat7] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-eis7g8gat7] { font-size: 1.1rem; }
    .btn-text[b-eis7g8gat7] { display: none; }
    .form-row[b-eis7g8gat7] { flex-direction: column; }
    .form-row-4[b-eis7g8gat7] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-eis7g8gat7] { width: 98%; max-height: 95vh; }
    .modal-lg[b-eis7g8gat7] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-eis7g8gat7] { padding: 0.75rem; }
    .modal-tabs[b-eis7g8gat7] { overflow-x: auto; }
    .modal-tab[b-eis7g8gat7] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-eis7g8gat7] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-eis7g8gat7] { display: grid !important; }
    .crud-cards-wrapper[b-eis7g8gat7] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-eis7g8gat7] { grid-template-columns: 1fr; }
    .card-details[b-eis7g8gat7] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-eis7g8gat7] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-eis7g8gat7] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-eis7g8gat7] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-eis7g8gat7] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrcreacargos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-gdoj3tmq5x] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gdoj3tmq5x 0.3s ease-out; }
@keyframes slideUp-b-gdoj3tmq5x { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gdoj3tmq5x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gdoj3tmq5x] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-gdoj3tmq5x] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-gdoj3tmq5x] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-gdoj3tmq5x] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-gdoj3tmq5x] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gdoj3tmq5x] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-gdoj3tmq5x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gdoj3tmq5x] { filter: brightness(1.1); }
.btn-outline[b-gdoj3tmq5x] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-gdoj3tmq5x] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-gdoj3tmq5x] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gdoj3tmq5x] { filter: brightness(1.1); }
.btn-icon[b-gdoj3tmq5x] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-gdoj3tmq5x] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gdoj3tmq5x] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gdoj3tmq5x] { color: #ef4444; }
.btn-delete:hover[b-gdoj3tmq5x] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-gdoj3tmq5x] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gdoj3tmq5x] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gdoj3tmq5x] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gdoj3tmq5x] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-gdoj3tmq5x] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gdoj3tmq5x] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-gdoj3tmq5x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-gdoj3tmq5x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-gdoj3tmq5x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-gdoj3tmq5x] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gdoj3tmq5x] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gdoj3tmq5x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gdoj3tmq5x] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-gdoj3tmq5x] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-gdoj3tmq5x] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-gdoj3tmq5x] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-gdoj3tmq5x] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-gdoj3tmq5x] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-gdoj3tmq5x] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-gdoj3tmq5x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-gdoj3tmq5x] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-gdoj3tmq5x] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-gdoj3tmq5x] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-gdoj3tmq5x] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-gdoj3tmq5x] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-gdoj3tmq5x] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-gdoj3tmq5x] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-gdoj3tmq5x] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-gdoj3tmq5x] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-gdoj3tmq5x] { display: block; }
.hide-on-cards[b-gdoj3tmq5x] { display: none !important; }
.show-on-cards[b-gdoj3tmq5x] { display: grid; }
.hide-on-grid[b-gdoj3tmq5x] { display: none !important; }

/* Badges */
.badge[b-gdoj3tmq5x] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-gdoj3tmq5x] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gdoj3tmq5x] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-gdoj3tmq5x] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-gdoj3tmq5x] { text-align: center; }
.text-muted[b-gdoj3tmq5x] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-gdoj3tmq5x], .crud-empty-state[b-gdoj3tmq5x] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-gdoj3tmq5x] { font-size: 2rem; }
.crud-spinner[b-gdoj3tmq5x] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-gdoj3tmq5x 0.6s linear infinite; }
.crud-spinner-sm[b-gdoj3tmq5x] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-gdoj3tmq5x 0.6s linear infinite; }
@keyframes spin-b-gdoj3tmq5x { to { transform: rotate(360deg); } }
.spin[b-gdoj3tmq5x] { animation: spin-b-gdoj3tmq5x 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-gdoj3tmq5x] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-gdoj3tmq5x 0.15s ease-out; }
.modal-container[b-gdoj3tmq5x] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gdoj3tmq5x] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-gdoj3tmq5x 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-gdoj3tmq5x] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-gdoj3tmq5x] { max-width: 420px; }
@keyframes fadeIn-b-gdoj3tmq5x { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gdoj3tmq5x { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-gdoj3tmq5x] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-gdoj3tmq5x] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-gdoj3tmq5x] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-gdoj3tmq5x] { color: #dc2626; }
.modal-close[b-gdoj3tmq5x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-gdoj3tmq5x] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-gdoj3tmq5x] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gdoj3tmq5x] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-gdoj3tmq5x] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-gdoj3tmq5x] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-gdoj3tmq5x] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-gdoj3tmq5x] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-gdoj3tmq5x] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-gdoj3tmq5x] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gdoj3tmq5x] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-gdoj3tmq5x] { flex: 2; }
.form-group label[b-gdoj3tmq5x] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gdoj3tmq5x], .form-group select[b-gdoj3tmq5x], .form-textarea[b-gdoj3tmq5x] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-gdoj3tmq5x], .form-group select:focus[b-gdoj3tmq5x], .form-textarea:focus[b-gdoj3tmq5x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-gdoj3tmq5x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-gdoj3tmq5x] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-gdoj3tmq5x] { flex: 1; display: flex; align-items: center; }
.form-check[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-gdoj3tmq5x] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-gdoj3tmq5x] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-gdoj3tmq5x] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-gdoj3tmq5x] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-gdoj3tmq5x] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-gdoj3tmq5x] { font-size: 3rem; }
.photo-placeholder span[b-gdoj3tmq5x] { font-size: 0.78rem; }
.photo-actions[b-gdoj3tmq5x] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-gdoj3tmq5x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-gdoj3tmq5x] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-gdoj3tmq5x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-gdoj3tmq5x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-gdoj3tmq5x] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-gdoj3tmq5x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-gdoj3tmq5x] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-gdoj3tmq5x] { filter: brightness(1.15); transform: scale(1.05); }
[b-gdoj3tmq5x] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-gdoj3tmq5x] { padding: 0.75rem; }
    .crud-header[b-gdoj3tmq5x] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gdoj3tmq5x] { font-size: 1.1rem; }
    .btn-text[b-gdoj3tmq5x] { display: none; }
    .form-row[b-gdoj3tmq5x] { flex-direction: column; }
    .form-row-4[b-gdoj3tmq5x] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-gdoj3tmq5x] { width: 98%; max-height: 95vh; }
    .modal-lg[b-gdoj3tmq5x] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-gdoj3tmq5x] { padding: 0.75rem; }
    .modal-tabs[b-gdoj3tmq5x] { overflow-x: auto; }
    .modal-tab[b-gdoj3tmq5x] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-gdoj3tmq5x] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-gdoj3tmq5x] { display: grid !important; }
    .crud-cards-wrapper[b-gdoj3tmq5x] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-gdoj3tmq5x] { grid-template-columns: 1fr; }
    .card-details[b-gdoj3tmq5x] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-gdoj3tmq5x] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-gdoj3tmq5x] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-gdoj3tmq5x] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-gdoj3tmq5x] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrgestionesrealizadas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hg9pilet97] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hg9pilet97 0.3s ease-out; }
@keyframes slideUp-b-hg9pilet97 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hg9pilet97] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hg9pilet97] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hg9pilet97] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hg9pilet97] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hg9pilet97] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hg9pilet97] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hg9pilet97] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hg9pilet97] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hg9pilet97] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hg9pilet97] { filter: brightness(1.1); }
.btn-outline[b-hg9pilet97] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hg9pilet97] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hg9pilet97] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hg9pilet97] { filter: brightness(1.1); }
.btn-icon[b-hg9pilet97] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hg9pilet97] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hg9pilet97] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hg9pilet97] { color: #ef4444; }
.btn-delete:hover[b-hg9pilet97] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hg9pilet97] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hg9pilet97] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hg9pilet97] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hg9pilet97] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hg9pilet97] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hg9pilet97] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hg9pilet97] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hg9pilet97] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hg9pilet97] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hg9pilet97] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hg9pilet97] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hg9pilet97] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hg9pilet97] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hg9pilet97] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hg9pilet97] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hg9pilet97] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hg9pilet97] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hg9pilet97] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hg9pilet97] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hg9pilet97] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hg9pilet97] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hg9pilet97] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hg9pilet97] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hg9pilet97] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hg9pilet97] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hg9pilet97] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hg9pilet97] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hg9pilet97] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hg9pilet97] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hg9pilet97] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hg9pilet97] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hg9pilet97] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hg9pilet97] { display: block; }
.hide-on-cards[b-hg9pilet97] { display: none !important; }
.show-on-cards[b-hg9pilet97] { display: grid; }
.hide-on-grid[b-hg9pilet97] { display: none !important; }

/* Badges */
.badge[b-hg9pilet97] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hg9pilet97] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hg9pilet97] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hg9pilet97] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hg9pilet97] { text-align: center; }
.text-muted[b-hg9pilet97] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hg9pilet97], .crud-empty-state[b-hg9pilet97] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hg9pilet97] { font-size: 2rem; }
.crud-spinner[b-hg9pilet97] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hg9pilet97 0.6s linear infinite; }
.crud-spinner-sm[b-hg9pilet97] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hg9pilet97 0.6s linear infinite; }
@keyframes spin-b-hg9pilet97 { to { transform: rotate(360deg); } }
.spin[b-hg9pilet97] { animation: spin-b-hg9pilet97 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hg9pilet97] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hg9pilet97 0.15s ease-out; }
.modal-container[b-hg9pilet97] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hg9pilet97] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hg9pilet97 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hg9pilet97] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hg9pilet97] { max-width: 420px; }
@keyframes fadeIn-b-hg9pilet97 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hg9pilet97 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hg9pilet97] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hg9pilet97] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hg9pilet97] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hg9pilet97] { color: #dc2626; }
.modal-close[b-hg9pilet97] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hg9pilet97] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hg9pilet97] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hg9pilet97] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hg9pilet97] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hg9pilet97] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hg9pilet97] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hg9pilet97] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hg9pilet97] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hg9pilet97] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hg9pilet97] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hg9pilet97] { flex: 2; }
.form-group label[b-hg9pilet97] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hg9pilet97], .form-group select[b-hg9pilet97], .form-textarea[b-hg9pilet97] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hg9pilet97], .form-group select:focus[b-hg9pilet97], .form-textarea:focus[b-hg9pilet97] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hg9pilet97] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hg9pilet97] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hg9pilet97] { flex: 1; display: flex; align-items: center; }
.form-check[b-hg9pilet97] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hg9pilet97] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hg9pilet97] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hg9pilet97] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hg9pilet97] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hg9pilet97] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hg9pilet97] { font-size: 3rem; }
.photo-placeholder span[b-hg9pilet97] { font-size: 0.78rem; }
.photo-actions[b-hg9pilet97] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hg9pilet97] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hg9pilet97] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hg9pilet97] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hg9pilet97] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hg9pilet97] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hg9pilet97] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hg9pilet97] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hg9pilet97] { filter: brightness(1.15); transform: scale(1.05); }
[b-hg9pilet97] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hg9pilet97] { padding: 0.75rem; }
    .crud-header[b-hg9pilet97] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hg9pilet97] { font-size: 1.1rem; }
    .btn-text[b-hg9pilet97] { display: none; }
    .form-row[b-hg9pilet97] { flex-direction: column; }
    .form-row-4[b-hg9pilet97] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hg9pilet97] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hg9pilet97] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hg9pilet97] { padding: 0.75rem; }
    .modal-tabs[b-hg9pilet97] { overflow-x: auto; }
    .modal-tab[b-hg9pilet97] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hg9pilet97] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hg9pilet97] { display: grid !important; }
    .crud-cards-wrapper[b-hg9pilet97] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hg9pilet97] { grid-template-columns: 1fr; }
    .card-details[b-hg9pilet97] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hg9pilet97] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hg9pilet97] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hg9pilet97] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hg9pilet97] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrlistadoexpedientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-24182hfxlf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-24182hfxlf 0.3s ease-out; }
@keyframes slideUp-b-24182hfxlf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-24182hfxlf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-24182hfxlf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-24182hfxlf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-24182hfxlf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-24182hfxlf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-24182hfxlf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-24182hfxlf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-24182hfxlf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-24182hfxlf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-24182hfxlf] { filter: brightness(1.1); }
.btn-outline[b-24182hfxlf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-24182hfxlf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-24182hfxlf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-24182hfxlf] { filter: brightness(1.1); }
.btn-icon[b-24182hfxlf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-24182hfxlf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-24182hfxlf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-24182hfxlf] { color: #ef4444; }
.btn-delete:hover[b-24182hfxlf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-24182hfxlf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-24182hfxlf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-24182hfxlf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-24182hfxlf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-24182hfxlf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-24182hfxlf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-24182hfxlf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-24182hfxlf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-24182hfxlf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-24182hfxlf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-24182hfxlf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-24182hfxlf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-24182hfxlf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-24182hfxlf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-24182hfxlf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-24182hfxlf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-24182hfxlf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-24182hfxlf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-24182hfxlf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-24182hfxlf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-24182hfxlf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-24182hfxlf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-24182hfxlf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-24182hfxlf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-24182hfxlf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-24182hfxlf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-24182hfxlf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-24182hfxlf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-24182hfxlf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-24182hfxlf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-24182hfxlf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-24182hfxlf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-24182hfxlf] { display: block; }
.hide-on-cards[b-24182hfxlf] { display: none !important; }
.show-on-cards[b-24182hfxlf] { display: grid; }
.hide-on-grid[b-24182hfxlf] { display: none !important; }

/* Badges */
.badge[b-24182hfxlf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-24182hfxlf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-24182hfxlf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-24182hfxlf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-24182hfxlf] { text-align: center; }
.text-muted[b-24182hfxlf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-24182hfxlf], .crud-empty-state[b-24182hfxlf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-24182hfxlf] { font-size: 2rem; }
.crud-spinner[b-24182hfxlf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-24182hfxlf 0.6s linear infinite; }
.crud-spinner-sm[b-24182hfxlf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-24182hfxlf 0.6s linear infinite; }
@keyframes spin-b-24182hfxlf { to { transform: rotate(360deg); } }
.spin[b-24182hfxlf] { animation: spin-b-24182hfxlf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-24182hfxlf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-24182hfxlf 0.15s ease-out; }
.modal-container[b-24182hfxlf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-24182hfxlf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-24182hfxlf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-24182hfxlf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-24182hfxlf] { max-width: 420px; }
@keyframes fadeIn-b-24182hfxlf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-24182hfxlf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-24182hfxlf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-24182hfxlf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-24182hfxlf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-24182hfxlf] { color: #dc2626; }
.modal-close[b-24182hfxlf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-24182hfxlf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-24182hfxlf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-24182hfxlf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-24182hfxlf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-24182hfxlf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-24182hfxlf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-24182hfxlf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-24182hfxlf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-24182hfxlf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-24182hfxlf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-24182hfxlf] { flex: 2; }
.form-group label[b-24182hfxlf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-24182hfxlf], .form-group select[b-24182hfxlf], .form-textarea[b-24182hfxlf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-24182hfxlf], .form-group select:focus[b-24182hfxlf], .form-textarea:focus[b-24182hfxlf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-24182hfxlf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-24182hfxlf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-24182hfxlf] { flex: 1; display: flex; align-items: center; }
.form-check[b-24182hfxlf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-24182hfxlf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-24182hfxlf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-24182hfxlf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-24182hfxlf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-24182hfxlf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-24182hfxlf] { font-size: 3rem; }
.photo-placeholder span[b-24182hfxlf] { font-size: 0.78rem; }
.photo-actions[b-24182hfxlf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-24182hfxlf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-24182hfxlf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-24182hfxlf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-24182hfxlf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-24182hfxlf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-24182hfxlf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-24182hfxlf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-24182hfxlf] { filter: brightness(1.15); transform: scale(1.05); }
[b-24182hfxlf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-24182hfxlf] { padding: 0.75rem; }
    .crud-header[b-24182hfxlf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-24182hfxlf] { font-size: 1.1rem; }
    .btn-text[b-24182hfxlf] { display: none; }
    .form-row[b-24182hfxlf] { flex-direction: column; }
    .form-row-4[b-24182hfxlf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-24182hfxlf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-24182hfxlf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-24182hfxlf] { padding: 0.75rem; }
    .modal-tabs[b-24182hfxlf] { overflow-x: auto; }
    .modal-tab[b-24182hfxlf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-24182hfxlf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-24182hfxlf] { display: grid !important; }
    .crud-cards-wrapper[b-24182hfxlf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-24182hfxlf] { grid-template-columns: 1fr; }
    .card-details[b-24182hfxlf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-24182hfxlf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-24182hfxlf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-24182hfxlf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-24182hfxlf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrlistadoexpedientessinmovimientos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-y3boqnlcv8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-y3boqnlcv8 0.3s ease-out; }
@keyframes slideUp-b-y3boqnlcv8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-y3boqnlcv8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-y3boqnlcv8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-y3boqnlcv8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-y3boqnlcv8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-y3boqnlcv8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-y3boqnlcv8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-y3boqnlcv8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-y3boqnlcv8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-y3boqnlcv8] { filter: brightness(1.1); }
.btn-outline[b-y3boqnlcv8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-y3boqnlcv8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-y3boqnlcv8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-y3boqnlcv8] { filter: brightness(1.1); }
.btn-icon[b-y3boqnlcv8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-y3boqnlcv8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-y3boqnlcv8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-y3boqnlcv8] { color: #ef4444; }
.btn-delete:hover[b-y3boqnlcv8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-y3boqnlcv8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-y3boqnlcv8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-y3boqnlcv8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-y3boqnlcv8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-y3boqnlcv8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-y3boqnlcv8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-y3boqnlcv8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-y3boqnlcv8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-y3boqnlcv8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-y3boqnlcv8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-y3boqnlcv8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-y3boqnlcv8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-y3boqnlcv8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-y3boqnlcv8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-y3boqnlcv8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-y3boqnlcv8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-y3boqnlcv8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-y3boqnlcv8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-y3boqnlcv8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-y3boqnlcv8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-y3boqnlcv8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-y3boqnlcv8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-y3boqnlcv8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-y3boqnlcv8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-y3boqnlcv8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-y3boqnlcv8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-y3boqnlcv8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-y3boqnlcv8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-y3boqnlcv8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-y3boqnlcv8] { display: block; }
.hide-on-cards[b-y3boqnlcv8] { display: none !important; }
.show-on-cards[b-y3boqnlcv8] { display: grid; }
.hide-on-grid[b-y3boqnlcv8] { display: none !important; }

/* Badges */
.badge[b-y3boqnlcv8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-y3boqnlcv8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-y3boqnlcv8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-y3boqnlcv8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-y3boqnlcv8] { text-align: center; }
.text-muted[b-y3boqnlcv8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-y3boqnlcv8], .crud-empty-state[b-y3boqnlcv8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-y3boqnlcv8] { font-size: 2rem; }
.crud-spinner[b-y3boqnlcv8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-y3boqnlcv8 0.6s linear infinite; }
.crud-spinner-sm[b-y3boqnlcv8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-y3boqnlcv8 0.6s linear infinite; }
@keyframes spin-b-y3boqnlcv8 { to { transform: rotate(360deg); } }
.spin[b-y3boqnlcv8] { animation: spin-b-y3boqnlcv8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-y3boqnlcv8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-y3boqnlcv8 0.15s ease-out; }
.modal-container[b-y3boqnlcv8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-y3boqnlcv8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-y3boqnlcv8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-y3boqnlcv8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-y3boqnlcv8] { max-width: 420px; }
@keyframes fadeIn-b-y3boqnlcv8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-y3boqnlcv8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-y3boqnlcv8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-y3boqnlcv8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-y3boqnlcv8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-y3boqnlcv8] { color: #dc2626; }
.modal-close[b-y3boqnlcv8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-y3boqnlcv8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-y3boqnlcv8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-y3boqnlcv8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-y3boqnlcv8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-y3boqnlcv8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-y3boqnlcv8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-y3boqnlcv8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-y3boqnlcv8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-y3boqnlcv8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-y3boqnlcv8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-y3boqnlcv8] { flex: 2; }
.form-group label[b-y3boqnlcv8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-y3boqnlcv8], .form-group select[b-y3boqnlcv8], .form-textarea[b-y3boqnlcv8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-y3boqnlcv8], .form-group select:focus[b-y3boqnlcv8], .form-textarea:focus[b-y3boqnlcv8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-y3boqnlcv8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-y3boqnlcv8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-y3boqnlcv8] { flex: 1; display: flex; align-items: center; }
.form-check[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-y3boqnlcv8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-y3boqnlcv8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-y3boqnlcv8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-y3boqnlcv8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-y3boqnlcv8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-y3boqnlcv8] { font-size: 3rem; }
.photo-placeholder span[b-y3boqnlcv8] { font-size: 0.78rem; }
.photo-actions[b-y3boqnlcv8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-y3boqnlcv8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-y3boqnlcv8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-y3boqnlcv8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-y3boqnlcv8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-y3boqnlcv8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-y3boqnlcv8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-y3boqnlcv8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-y3boqnlcv8] { filter: brightness(1.15); transform: scale(1.05); }
[b-y3boqnlcv8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-y3boqnlcv8] { padding: 0.75rem; }
    .crud-header[b-y3boqnlcv8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-y3boqnlcv8] { font-size: 1.1rem; }
    .btn-text[b-y3boqnlcv8] { display: none; }
    .form-row[b-y3boqnlcv8] { flex-direction: column; }
    .form-row-4[b-y3boqnlcv8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-y3boqnlcv8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-y3boqnlcv8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-y3boqnlcv8] { padding: 0.75rem; }
    .modal-tabs[b-y3boqnlcv8] { overflow-x: auto; }
    .modal-tab[b-y3boqnlcv8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-y3boqnlcv8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-y3boqnlcv8] { display: grid !important; }
    .crud-cards-wrapper[b-y3boqnlcv8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-y3boqnlcv8] { grid-template-columns: 1fr; }
    .card-details[b-y3boqnlcv8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-y3boqnlcv8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-y3boqnlcv8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-y3boqnlcv8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-y3boqnlcv8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrregistracargoexpediente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qswja0v9ax] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qswja0v9ax 0.3s ease-out; }
@keyframes slideUp-b-qswja0v9ax { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qswja0v9ax] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qswja0v9ax] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qswja0v9ax] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qswja0v9ax] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qswja0v9ax] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qswja0v9ax] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qswja0v9ax] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qswja0v9ax] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qswja0v9ax] { filter: brightness(1.1); }
.btn-outline[b-qswja0v9ax] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qswja0v9ax] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qswja0v9ax] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qswja0v9ax] { filter: brightness(1.1); }
.btn-icon[b-qswja0v9ax] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qswja0v9ax] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qswja0v9ax] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qswja0v9ax] { color: #ef4444; }
.btn-delete:hover[b-qswja0v9ax] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qswja0v9ax] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qswja0v9ax] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qswja0v9ax] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qswja0v9ax] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qswja0v9ax] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qswja0v9ax] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qswja0v9ax] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qswja0v9ax] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qswja0v9ax] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qswja0v9ax] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qswja0v9ax] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qswja0v9ax] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qswja0v9ax] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qswja0v9ax] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qswja0v9ax] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qswja0v9ax] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qswja0v9ax] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qswja0v9ax] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qswja0v9ax] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qswja0v9ax] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qswja0v9ax] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qswja0v9ax] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qswja0v9ax] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qswja0v9ax] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qswja0v9ax] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qswja0v9ax] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qswja0v9ax] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qswja0v9ax] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qswja0v9ax] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qswja0v9ax] { display: block; }
.hide-on-cards[b-qswja0v9ax] { display: none !important; }
.show-on-cards[b-qswja0v9ax] { display: grid; }
.hide-on-grid[b-qswja0v9ax] { display: none !important; }

/* Badges */
.badge[b-qswja0v9ax] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qswja0v9ax] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qswja0v9ax] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qswja0v9ax] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qswja0v9ax] { text-align: center; }
.text-muted[b-qswja0v9ax] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qswja0v9ax], .crud-empty-state[b-qswja0v9ax] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qswja0v9ax] { font-size: 2rem; }
.crud-spinner[b-qswja0v9ax] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qswja0v9ax 0.6s linear infinite; }
.crud-spinner-sm[b-qswja0v9ax] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qswja0v9ax 0.6s linear infinite; }
@keyframes spin-b-qswja0v9ax { to { transform: rotate(360deg); } }
.spin[b-qswja0v9ax] { animation: spin-b-qswja0v9ax 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qswja0v9ax] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qswja0v9ax 0.15s ease-out; }
.modal-container[b-qswja0v9ax] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qswja0v9ax] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qswja0v9ax 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qswja0v9ax] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qswja0v9ax] { max-width: 420px; }
@keyframes fadeIn-b-qswja0v9ax { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qswja0v9ax { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qswja0v9ax] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qswja0v9ax] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qswja0v9ax] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qswja0v9ax] { color: #dc2626; }
.modal-close[b-qswja0v9ax] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qswja0v9ax] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qswja0v9ax] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qswja0v9ax] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qswja0v9ax] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qswja0v9ax] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qswja0v9ax] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qswja0v9ax] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qswja0v9ax] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qswja0v9ax] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qswja0v9ax] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qswja0v9ax] { flex: 2; }
.form-group label[b-qswja0v9ax] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qswja0v9ax], .form-group select[b-qswja0v9ax], .form-textarea[b-qswja0v9ax] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qswja0v9ax], .form-group select:focus[b-qswja0v9ax], .form-textarea:focus[b-qswja0v9ax] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qswja0v9ax] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qswja0v9ax] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qswja0v9ax] { flex: 1; display: flex; align-items: center; }
.form-check[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qswja0v9ax] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qswja0v9ax] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qswja0v9ax] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qswja0v9ax] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qswja0v9ax] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qswja0v9ax] { font-size: 3rem; }
.photo-placeholder span[b-qswja0v9ax] { font-size: 0.78rem; }
.photo-actions[b-qswja0v9ax] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qswja0v9ax] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qswja0v9ax] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qswja0v9ax] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qswja0v9ax] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qswja0v9ax] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qswja0v9ax] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qswja0v9ax] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qswja0v9ax] { filter: brightness(1.15); transform: scale(1.05); }
[b-qswja0v9ax] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qswja0v9ax] { padding: 0.75rem; }
    .crud-header[b-qswja0v9ax] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qswja0v9ax] { font-size: 1.1rem; }
    .btn-text[b-qswja0v9ax] { display: none; }
    .form-row[b-qswja0v9ax] { flex-direction: column; }
    .form-row-4[b-qswja0v9ax] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qswja0v9ax] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qswja0v9ax] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qswja0v9ax] { padding: 0.75rem; }
    .modal-tabs[b-qswja0v9ax] { overflow-x: auto; }
    .modal-tab[b-qswja0v9ax] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qswja0v9ax] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qswja0v9ax] { display: grid !important; }
    .crud-cards-wrapper[b-qswja0v9ax] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qswja0v9ax] { grid-template-columns: 1fr; }
    .card-details[b-qswja0v9ax] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qswja0v9ax] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qswja0v9ax] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qswja0v9ax] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qswja0v9ax] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbrreporteparaacreedores.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xgp0gxz5cs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xgp0gxz5cs 0.3s ease-out; }
@keyframes slideUp-b-xgp0gxz5cs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xgp0gxz5cs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xgp0gxz5cs] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xgp0gxz5cs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xgp0gxz5cs] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xgp0gxz5cs] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xgp0gxz5cs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xgp0gxz5cs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xgp0gxz5cs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xgp0gxz5cs] { filter: brightness(1.1); }
.btn-outline[b-xgp0gxz5cs] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xgp0gxz5cs] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xgp0gxz5cs] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xgp0gxz5cs] { filter: brightness(1.1); }
.btn-icon[b-xgp0gxz5cs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xgp0gxz5cs] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xgp0gxz5cs] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xgp0gxz5cs] { color: #ef4444; }
.btn-delete:hover[b-xgp0gxz5cs] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xgp0gxz5cs] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xgp0gxz5cs] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xgp0gxz5cs] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xgp0gxz5cs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xgp0gxz5cs] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xgp0gxz5cs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xgp0gxz5cs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xgp0gxz5cs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xgp0gxz5cs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xgp0gxz5cs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xgp0gxz5cs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xgp0gxz5cs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xgp0gxz5cs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xgp0gxz5cs] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xgp0gxz5cs] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xgp0gxz5cs] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xgp0gxz5cs] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xgp0gxz5cs] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xgp0gxz5cs] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xgp0gxz5cs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xgp0gxz5cs] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xgp0gxz5cs] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xgp0gxz5cs] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xgp0gxz5cs] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xgp0gxz5cs] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xgp0gxz5cs] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xgp0gxz5cs] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xgp0gxz5cs] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xgp0gxz5cs] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xgp0gxz5cs] { display: block; }
.hide-on-cards[b-xgp0gxz5cs] { display: none !important; }
.show-on-cards[b-xgp0gxz5cs] { display: grid; }
.hide-on-grid[b-xgp0gxz5cs] { display: none !important; }

/* Badges */
.badge[b-xgp0gxz5cs] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xgp0gxz5cs] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xgp0gxz5cs] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xgp0gxz5cs] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xgp0gxz5cs] { text-align: center; }
.text-muted[b-xgp0gxz5cs] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xgp0gxz5cs], .crud-empty-state[b-xgp0gxz5cs] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xgp0gxz5cs] { font-size: 2rem; }
.crud-spinner[b-xgp0gxz5cs] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xgp0gxz5cs 0.6s linear infinite; }
.crud-spinner-sm[b-xgp0gxz5cs] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xgp0gxz5cs 0.6s linear infinite; }
@keyframes spin-b-xgp0gxz5cs { to { transform: rotate(360deg); } }
.spin[b-xgp0gxz5cs] { animation: spin-b-xgp0gxz5cs 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xgp0gxz5cs] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xgp0gxz5cs 0.15s ease-out; }
.modal-container[b-xgp0gxz5cs] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xgp0gxz5cs] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xgp0gxz5cs 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xgp0gxz5cs] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xgp0gxz5cs] { max-width: 420px; }
@keyframes fadeIn-b-xgp0gxz5cs { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xgp0gxz5cs { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xgp0gxz5cs] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xgp0gxz5cs] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xgp0gxz5cs] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xgp0gxz5cs] { color: #dc2626; }
.modal-close[b-xgp0gxz5cs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xgp0gxz5cs] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xgp0gxz5cs] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xgp0gxz5cs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xgp0gxz5cs] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xgp0gxz5cs] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xgp0gxz5cs] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xgp0gxz5cs] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xgp0gxz5cs] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xgp0gxz5cs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xgp0gxz5cs] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xgp0gxz5cs] { flex: 2; }
.form-group label[b-xgp0gxz5cs] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xgp0gxz5cs], .form-group select[b-xgp0gxz5cs], .form-textarea[b-xgp0gxz5cs] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xgp0gxz5cs], .form-group select:focus[b-xgp0gxz5cs], .form-textarea:focus[b-xgp0gxz5cs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xgp0gxz5cs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xgp0gxz5cs] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xgp0gxz5cs] { flex: 1; display: flex; align-items: center; }
.form-check[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xgp0gxz5cs] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xgp0gxz5cs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xgp0gxz5cs] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xgp0gxz5cs] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xgp0gxz5cs] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xgp0gxz5cs] { font-size: 3rem; }
.photo-placeholder span[b-xgp0gxz5cs] { font-size: 0.78rem; }
.photo-actions[b-xgp0gxz5cs] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xgp0gxz5cs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xgp0gxz5cs] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xgp0gxz5cs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xgp0gxz5cs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xgp0gxz5cs] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xgp0gxz5cs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xgp0gxz5cs] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xgp0gxz5cs] { filter: brightness(1.15); transform: scale(1.05); }
[b-xgp0gxz5cs] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xgp0gxz5cs] { padding: 0.75rem; }
    .crud-header[b-xgp0gxz5cs] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xgp0gxz5cs] { font-size: 1.1rem; }
    .btn-text[b-xgp0gxz5cs] { display: none; }
    .form-row[b-xgp0gxz5cs] { flex-direction: column; }
    .form-row-4[b-xgp0gxz5cs] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xgp0gxz5cs] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xgp0gxz5cs] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xgp0gxz5cs] { padding: 0.75rem; }
    .modal-tabs[b-xgp0gxz5cs] { overflow-x: auto; }
    .modal-tab[b-xgp0gxz5cs] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xgp0gxz5cs] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xgp0gxz5cs] { display: grid !important; }
    .crud-cards-wrapper[b-xgp0gxz5cs] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xgp0gxz5cs] { grid-template-columns: 1fr; }
    .card-details[b-xgp0gxz5cs] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xgp0gxz5cs] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xgp0gxz5cs] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xgp0gxz5cs] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xgp0gxz5cs] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbr_acreedor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0rh97074dz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0rh97074dz 0.3s ease-out; }
@keyframes slideUp-b-0rh97074dz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0rh97074dz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0rh97074dz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0rh97074dz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0rh97074dz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0rh97074dz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0rh97074dz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0rh97074dz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0rh97074dz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0rh97074dz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0rh97074dz] { filter: brightness(1.1); }
.btn-outline[b-0rh97074dz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0rh97074dz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0rh97074dz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0rh97074dz] { filter: brightness(1.1); }
.btn-icon[b-0rh97074dz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0rh97074dz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0rh97074dz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0rh97074dz] { color: #ef4444; }
.btn-delete:hover[b-0rh97074dz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0rh97074dz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0rh97074dz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0rh97074dz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0rh97074dz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0rh97074dz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0rh97074dz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0rh97074dz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0rh97074dz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0rh97074dz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0rh97074dz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0rh97074dz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0rh97074dz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0rh97074dz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0rh97074dz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0rh97074dz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0rh97074dz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0rh97074dz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0rh97074dz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0rh97074dz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0rh97074dz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0rh97074dz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0rh97074dz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0rh97074dz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0rh97074dz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0rh97074dz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0rh97074dz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0rh97074dz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0rh97074dz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0rh97074dz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0rh97074dz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0rh97074dz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0rh97074dz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0rh97074dz] { display: block; }
.hide-on-cards[b-0rh97074dz] { display: none !important; }
.show-on-cards[b-0rh97074dz] { display: grid; }
.hide-on-grid[b-0rh97074dz] { display: none !important; }

/* Badges */
.badge[b-0rh97074dz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0rh97074dz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0rh97074dz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0rh97074dz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0rh97074dz] { text-align: center; }
.text-muted[b-0rh97074dz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0rh97074dz], .crud-empty-state[b-0rh97074dz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0rh97074dz] { font-size: 2rem; }
.crud-spinner[b-0rh97074dz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0rh97074dz 0.6s linear infinite; }
.crud-spinner-sm[b-0rh97074dz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0rh97074dz 0.6s linear infinite; }
@keyframes spin-b-0rh97074dz { to { transform: rotate(360deg); } }
.spin[b-0rh97074dz] { animation: spin-b-0rh97074dz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0rh97074dz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0rh97074dz 0.15s ease-out; }
.modal-container[b-0rh97074dz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0rh97074dz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0rh97074dz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0rh97074dz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0rh97074dz] { max-width: 420px; }
@keyframes fadeIn-b-0rh97074dz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0rh97074dz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0rh97074dz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0rh97074dz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0rh97074dz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0rh97074dz] { color: #dc2626; }
.modal-close[b-0rh97074dz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0rh97074dz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0rh97074dz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0rh97074dz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0rh97074dz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0rh97074dz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0rh97074dz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0rh97074dz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0rh97074dz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0rh97074dz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0rh97074dz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0rh97074dz] { flex: 2; }
.form-group label[b-0rh97074dz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0rh97074dz], .form-group select[b-0rh97074dz], .form-textarea[b-0rh97074dz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0rh97074dz], .form-group select:focus[b-0rh97074dz], .form-textarea:focus[b-0rh97074dz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0rh97074dz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0rh97074dz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0rh97074dz] { flex: 1; display: flex; align-items: center; }
.form-check[b-0rh97074dz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0rh97074dz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0rh97074dz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0rh97074dz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0rh97074dz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0rh97074dz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0rh97074dz] { font-size: 3rem; }
.photo-placeholder span[b-0rh97074dz] { font-size: 0.78rem; }
.photo-actions[b-0rh97074dz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0rh97074dz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0rh97074dz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0rh97074dz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0rh97074dz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0rh97074dz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0rh97074dz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0rh97074dz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0rh97074dz] { filter: brightness(1.15); transform: scale(1.05); }
[b-0rh97074dz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0rh97074dz] { padding: 0.75rem; }
    .crud-header[b-0rh97074dz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0rh97074dz] { font-size: 1.1rem; }
    .btn-text[b-0rh97074dz] { display: none; }
    .form-row[b-0rh97074dz] { flex-direction: column; }
    .form-row-4[b-0rh97074dz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0rh97074dz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0rh97074dz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0rh97074dz] { padding: 0.75rem; }
    .modal-tabs[b-0rh97074dz] { overflow-x: auto; }
    .modal-tab[b-0rh97074dz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0rh97074dz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0rh97074dz] { display: grid !important; }
    .crud-cards-wrapper[b-0rh97074dz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0rh97074dz] { grid-template-columns: 1fr; }
    .card-details[b-0rh97074dz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0rh97074dz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0rh97074dz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0rh97074dz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0rh97074dz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbr_asignastatusexpedientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ipzzrqjid9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ipzzrqjid9 0.3s ease-out; }
@keyframes slideUp-b-ipzzrqjid9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ipzzrqjid9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ipzzrqjid9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ipzzrqjid9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ipzzrqjid9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ipzzrqjid9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ipzzrqjid9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ipzzrqjid9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ipzzrqjid9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ipzzrqjid9] { filter: brightness(1.1); }
.btn-outline[b-ipzzrqjid9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ipzzrqjid9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ipzzrqjid9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ipzzrqjid9] { filter: brightness(1.1); }
.btn-icon[b-ipzzrqjid9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ipzzrqjid9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ipzzrqjid9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ipzzrqjid9] { color: #ef4444; }
.btn-delete:hover[b-ipzzrqjid9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ipzzrqjid9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ipzzrqjid9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ipzzrqjid9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ipzzrqjid9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ipzzrqjid9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ipzzrqjid9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ipzzrqjid9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ipzzrqjid9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ipzzrqjid9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ipzzrqjid9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ipzzrqjid9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ipzzrqjid9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ipzzrqjid9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ipzzrqjid9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ipzzrqjid9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ipzzrqjid9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ipzzrqjid9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ipzzrqjid9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ipzzrqjid9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ipzzrqjid9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ipzzrqjid9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ipzzrqjid9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ipzzrqjid9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ipzzrqjid9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ipzzrqjid9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ipzzrqjid9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ipzzrqjid9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ipzzrqjid9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ipzzrqjid9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ipzzrqjid9] { display: block; }
.hide-on-cards[b-ipzzrqjid9] { display: none !important; }
.show-on-cards[b-ipzzrqjid9] { display: grid; }
.hide-on-grid[b-ipzzrqjid9] { display: none !important; }

/* Badges */
.badge[b-ipzzrqjid9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ipzzrqjid9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ipzzrqjid9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ipzzrqjid9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ipzzrqjid9] { text-align: center; }
.text-muted[b-ipzzrqjid9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ipzzrqjid9], .crud-empty-state[b-ipzzrqjid9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ipzzrqjid9] { font-size: 2rem; }
.crud-spinner[b-ipzzrqjid9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ipzzrqjid9 0.6s linear infinite; }
.crud-spinner-sm[b-ipzzrqjid9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ipzzrqjid9 0.6s linear infinite; }
@keyframes spin-b-ipzzrqjid9 { to { transform: rotate(360deg); } }
.spin[b-ipzzrqjid9] { animation: spin-b-ipzzrqjid9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ipzzrqjid9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ipzzrqjid9 0.15s ease-out; }
.modal-container[b-ipzzrqjid9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ipzzrqjid9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ipzzrqjid9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ipzzrqjid9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ipzzrqjid9] { max-width: 420px; }
@keyframes fadeIn-b-ipzzrqjid9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ipzzrqjid9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ipzzrqjid9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ipzzrqjid9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ipzzrqjid9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ipzzrqjid9] { color: #dc2626; }
.modal-close[b-ipzzrqjid9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ipzzrqjid9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ipzzrqjid9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ipzzrqjid9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ipzzrqjid9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ipzzrqjid9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ipzzrqjid9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ipzzrqjid9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ipzzrqjid9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ipzzrqjid9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ipzzrqjid9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ipzzrqjid9] { flex: 2; }
.form-group label[b-ipzzrqjid9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ipzzrqjid9], .form-group select[b-ipzzrqjid9], .form-textarea[b-ipzzrqjid9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ipzzrqjid9], .form-group select:focus[b-ipzzrqjid9], .form-textarea:focus[b-ipzzrqjid9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ipzzrqjid9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ipzzrqjid9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ipzzrqjid9] { flex: 1; display: flex; align-items: center; }
.form-check[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ipzzrqjid9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ipzzrqjid9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ipzzrqjid9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ipzzrqjid9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ipzzrqjid9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ipzzrqjid9] { font-size: 3rem; }
.photo-placeholder span[b-ipzzrqjid9] { font-size: 0.78rem; }
.photo-actions[b-ipzzrqjid9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ipzzrqjid9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ipzzrqjid9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ipzzrqjid9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ipzzrqjid9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ipzzrqjid9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ipzzrqjid9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ipzzrqjid9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ipzzrqjid9] { filter: brightness(1.15); transform: scale(1.05); }
[b-ipzzrqjid9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ipzzrqjid9] { padding: 0.75rem; }
    .crud-header[b-ipzzrqjid9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ipzzrqjid9] { font-size: 1.1rem; }
    .btn-text[b-ipzzrqjid9] { display: none; }
    .form-row[b-ipzzrqjid9] { flex-direction: column; }
    .form-row-4[b-ipzzrqjid9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ipzzrqjid9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ipzzrqjid9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ipzzrqjid9] { padding: 0.75rem; }
    .modal-tabs[b-ipzzrqjid9] { overflow-x: auto; }
    .modal-tab[b-ipzzrqjid9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ipzzrqjid9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ipzzrqjid9] { display: grid !important; }
    .crud-cards-wrapper[b-ipzzrqjid9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ipzzrqjid9] { grid-template-columns: 1fr; }
    .card-details[b-ipzzrqjid9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ipzzrqjid9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ipzzrqjid9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ipzzrqjid9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ipzzrqjid9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbr_ingreso_expediente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ja9v0ye8kz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ja9v0ye8kz 0.3s ease-out; }
@keyframes slideUp-b-ja9v0ye8kz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ja9v0ye8kz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ja9v0ye8kz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ja9v0ye8kz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ja9v0ye8kz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ja9v0ye8kz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ja9v0ye8kz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ja9v0ye8kz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ja9v0ye8kz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ja9v0ye8kz] { filter: brightness(1.1); }
.btn-outline[b-ja9v0ye8kz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ja9v0ye8kz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ja9v0ye8kz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ja9v0ye8kz] { filter: brightness(1.1); }
.btn-icon[b-ja9v0ye8kz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ja9v0ye8kz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ja9v0ye8kz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ja9v0ye8kz] { color: #ef4444; }
.btn-delete:hover[b-ja9v0ye8kz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ja9v0ye8kz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ja9v0ye8kz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ja9v0ye8kz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ja9v0ye8kz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ja9v0ye8kz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ja9v0ye8kz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ja9v0ye8kz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ja9v0ye8kz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ja9v0ye8kz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ja9v0ye8kz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ja9v0ye8kz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ja9v0ye8kz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ja9v0ye8kz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ja9v0ye8kz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ja9v0ye8kz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ja9v0ye8kz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ja9v0ye8kz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ja9v0ye8kz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ja9v0ye8kz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ja9v0ye8kz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ja9v0ye8kz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ja9v0ye8kz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ja9v0ye8kz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ja9v0ye8kz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ja9v0ye8kz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ja9v0ye8kz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ja9v0ye8kz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ja9v0ye8kz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ja9v0ye8kz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ja9v0ye8kz] { display: block; }
.hide-on-cards[b-ja9v0ye8kz] { display: none !important; }
.show-on-cards[b-ja9v0ye8kz] { display: grid; }
.hide-on-grid[b-ja9v0ye8kz] { display: none !important; }

/* Badges */
.badge[b-ja9v0ye8kz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ja9v0ye8kz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ja9v0ye8kz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ja9v0ye8kz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ja9v0ye8kz] { text-align: center; }
.text-muted[b-ja9v0ye8kz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ja9v0ye8kz], .crud-empty-state[b-ja9v0ye8kz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ja9v0ye8kz] { font-size: 2rem; }
.crud-spinner[b-ja9v0ye8kz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ja9v0ye8kz 0.6s linear infinite; }
.crud-spinner-sm[b-ja9v0ye8kz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ja9v0ye8kz 0.6s linear infinite; }
@keyframes spin-b-ja9v0ye8kz { to { transform: rotate(360deg); } }
.spin[b-ja9v0ye8kz] { animation: spin-b-ja9v0ye8kz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ja9v0ye8kz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ja9v0ye8kz 0.15s ease-out; }
.modal-container[b-ja9v0ye8kz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ja9v0ye8kz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ja9v0ye8kz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ja9v0ye8kz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ja9v0ye8kz] { max-width: 420px; }
@keyframes fadeIn-b-ja9v0ye8kz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ja9v0ye8kz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ja9v0ye8kz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ja9v0ye8kz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ja9v0ye8kz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ja9v0ye8kz] { color: #dc2626; }
.modal-close[b-ja9v0ye8kz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ja9v0ye8kz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ja9v0ye8kz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ja9v0ye8kz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ja9v0ye8kz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ja9v0ye8kz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ja9v0ye8kz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ja9v0ye8kz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ja9v0ye8kz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ja9v0ye8kz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ja9v0ye8kz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ja9v0ye8kz] { flex: 2; }
.form-group label[b-ja9v0ye8kz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ja9v0ye8kz], .form-group select[b-ja9v0ye8kz], .form-textarea[b-ja9v0ye8kz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ja9v0ye8kz], .form-group select:focus[b-ja9v0ye8kz], .form-textarea:focus[b-ja9v0ye8kz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ja9v0ye8kz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ja9v0ye8kz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ja9v0ye8kz] { flex: 1; display: flex; align-items: center; }
.form-check[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ja9v0ye8kz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ja9v0ye8kz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ja9v0ye8kz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ja9v0ye8kz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ja9v0ye8kz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ja9v0ye8kz] { font-size: 3rem; }
.photo-placeholder span[b-ja9v0ye8kz] { font-size: 0.78rem; }
.photo-actions[b-ja9v0ye8kz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ja9v0ye8kz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ja9v0ye8kz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ja9v0ye8kz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ja9v0ye8kz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ja9v0ye8kz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ja9v0ye8kz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ja9v0ye8kz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ja9v0ye8kz] { filter: brightness(1.15); transform: scale(1.05); }
[b-ja9v0ye8kz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ja9v0ye8kz] { padding: 0.75rem; }
    .crud-header[b-ja9v0ye8kz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ja9v0ye8kz] { font-size: 1.1rem; }
    .btn-text[b-ja9v0ye8kz] { display: none; }
    .form-row[b-ja9v0ye8kz] { flex-direction: column; }
    .form-row-4[b-ja9v0ye8kz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ja9v0ye8kz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ja9v0ye8kz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ja9v0ye8kz] { padding: 0.75rem; }
    .modal-tabs[b-ja9v0ye8kz] { overflow-x: auto; }
    .modal-tab[b-ja9v0ye8kz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ja9v0ye8kz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ja9v0ye8kz] { display: grid !important; }
    .crud-cards-wrapper[b-ja9v0ye8kz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ja9v0ye8kz] { grid-template-columns: 1fr; }
    .card-details[b-ja9v0ye8kz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ja9v0ye8kz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ja9v0ye8kz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ja9v0ye8kz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ja9v0ye8kz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbr_maestrastatus.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9akkjtwan0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9akkjtwan0 0.3s ease-out; }
@keyframes slideUp-b-9akkjtwan0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9akkjtwan0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9akkjtwan0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9akkjtwan0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9akkjtwan0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9akkjtwan0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9akkjtwan0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9akkjtwan0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9akkjtwan0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9akkjtwan0] { filter: brightness(1.1); }
.btn-outline[b-9akkjtwan0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9akkjtwan0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9akkjtwan0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9akkjtwan0] { filter: brightness(1.1); }
.btn-icon[b-9akkjtwan0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9akkjtwan0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9akkjtwan0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9akkjtwan0] { color: #ef4444; }
.btn-delete:hover[b-9akkjtwan0] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9akkjtwan0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9akkjtwan0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9akkjtwan0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9akkjtwan0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9akkjtwan0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9akkjtwan0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9akkjtwan0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9akkjtwan0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9akkjtwan0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9akkjtwan0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9akkjtwan0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9akkjtwan0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9akkjtwan0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9akkjtwan0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9akkjtwan0] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9akkjtwan0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9akkjtwan0] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9akkjtwan0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9akkjtwan0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9akkjtwan0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9akkjtwan0] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9akkjtwan0] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9akkjtwan0] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9akkjtwan0] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9akkjtwan0] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9akkjtwan0] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9akkjtwan0] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9akkjtwan0] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9akkjtwan0] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9akkjtwan0] { display: block; }
.hide-on-cards[b-9akkjtwan0] { display: none !important; }
.show-on-cards[b-9akkjtwan0] { display: grid; }
.hide-on-grid[b-9akkjtwan0] { display: none !important; }

/* Badges */
.badge[b-9akkjtwan0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9akkjtwan0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9akkjtwan0] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9akkjtwan0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9akkjtwan0] { text-align: center; }
.text-muted[b-9akkjtwan0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9akkjtwan0], .crud-empty-state[b-9akkjtwan0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9akkjtwan0] { font-size: 2rem; }
.crud-spinner[b-9akkjtwan0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9akkjtwan0 0.6s linear infinite; }
.crud-spinner-sm[b-9akkjtwan0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9akkjtwan0 0.6s linear infinite; }
@keyframes spin-b-9akkjtwan0 { to { transform: rotate(360deg); } }
.spin[b-9akkjtwan0] { animation: spin-b-9akkjtwan0 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9akkjtwan0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9akkjtwan0 0.15s ease-out; }
.modal-container[b-9akkjtwan0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9akkjtwan0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9akkjtwan0 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9akkjtwan0] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9akkjtwan0] { max-width: 420px; }
@keyframes fadeIn-b-9akkjtwan0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9akkjtwan0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9akkjtwan0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9akkjtwan0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9akkjtwan0] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9akkjtwan0] { color: #dc2626; }
.modal-close[b-9akkjtwan0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9akkjtwan0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9akkjtwan0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9akkjtwan0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9akkjtwan0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9akkjtwan0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9akkjtwan0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9akkjtwan0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9akkjtwan0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9akkjtwan0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9akkjtwan0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9akkjtwan0] { flex: 2; }
.form-group label[b-9akkjtwan0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9akkjtwan0], .form-group select[b-9akkjtwan0], .form-textarea[b-9akkjtwan0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9akkjtwan0], .form-group select:focus[b-9akkjtwan0], .form-textarea:focus[b-9akkjtwan0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9akkjtwan0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9akkjtwan0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9akkjtwan0] { flex: 1; display: flex; align-items: center; }
.form-check[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9akkjtwan0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9akkjtwan0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9akkjtwan0] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9akkjtwan0] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9akkjtwan0] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9akkjtwan0] { font-size: 3rem; }
.photo-placeholder span[b-9akkjtwan0] { font-size: 0.78rem; }
.photo-actions[b-9akkjtwan0] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9akkjtwan0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9akkjtwan0] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9akkjtwan0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9akkjtwan0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9akkjtwan0] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9akkjtwan0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9akkjtwan0] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9akkjtwan0] { filter: brightness(1.15); transform: scale(1.05); }
[b-9akkjtwan0] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9akkjtwan0] { padding: 0.75rem; }
    .crud-header[b-9akkjtwan0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9akkjtwan0] { font-size: 1.1rem; }
    .btn-text[b-9akkjtwan0] { display: none; }
    .form-row[b-9akkjtwan0] { flex-direction: column; }
    .form-row-4[b-9akkjtwan0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9akkjtwan0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9akkjtwan0] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9akkjtwan0] { padding: 0.75rem; }
    .modal-tabs[b-9akkjtwan0] { overflow-x: auto; }
    .modal-tab[b-9akkjtwan0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9akkjtwan0] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9akkjtwan0] { display: grid !important; }
    .crud-cards-wrapper[b-9akkjtwan0] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9akkjtwan0] { grid-template-columns: 1fr; }
    .card-details[b-9akkjtwan0] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9akkjtwan0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9akkjtwan0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9akkjtwan0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9akkjtwan0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcbr_tipodeuda.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qix8r15pqi] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qix8r15pqi 0.3s ease-out; }
@keyframes slideUp-b-qix8r15pqi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qix8r15pqi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qix8r15pqi] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qix8r15pqi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qix8r15pqi] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qix8r15pqi] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qix8r15pqi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qix8r15pqi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qix8r15pqi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qix8r15pqi] { filter: brightness(1.1); }
.btn-outline[b-qix8r15pqi] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qix8r15pqi] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qix8r15pqi] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qix8r15pqi] { filter: brightness(1.1); }
.btn-icon[b-qix8r15pqi] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qix8r15pqi] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qix8r15pqi] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qix8r15pqi] { color: #ef4444; }
.btn-delete:hover[b-qix8r15pqi] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qix8r15pqi] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qix8r15pqi] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qix8r15pqi] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qix8r15pqi] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qix8r15pqi] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qix8r15pqi] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qix8r15pqi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qix8r15pqi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qix8r15pqi] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qix8r15pqi] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qix8r15pqi] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qix8r15pqi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qix8r15pqi] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qix8r15pqi] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qix8r15pqi] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qix8r15pqi] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qix8r15pqi] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qix8r15pqi] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qix8r15pqi] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qix8r15pqi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qix8r15pqi] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qix8r15pqi] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qix8r15pqi] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qix8r15pqi] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qix8r15pqi] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qix8r15pqi] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qix8r15pqi] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qix8r15pqi] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qix8r15pqi] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qix8r15pqi] { display: block; }
.hide-on-cards[b-qix8r15pqi] { display: none !important; }
.show-on-cards[b-qix8r15pqi] { display: grid; }
.hide-on-grid[b-qix8r15pqi] { display: none !important; }

/* Badges */
.badge[b-qix8r15pqi] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qix8r15pqi] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qix8r15pqi] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qix8r15pqi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qix8r15pqi] { text-align: center; }
.text-muted[b-qix8r15pqi] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qix8r15pqi], .crud-empty-state[b-qix8r15pqi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qix8r15pqi] { font-size: 2rem; }
.crud-spinner[b-qix8r15pqi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qix8r15pqi 0.6s linear infinite; }
.crud-spinner-sm[b-qix8r15pqi] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qix8r15pqi 0.6s linear infinite; }
@keyframes spin-b-qix8r15pqi { to { transform: rotate(360deg); } }
.spin[b-qix8r15pqi] { animation: spin-b-qix8r15pqi 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qix8r15pqi] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qix8r15pqi 0.15s ease-out; }
.modal-container[b-qix8r15pqi] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qix8r15pqi] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qix8r15pqi 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qix8r15pqi] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qix8r15pqi] { max-width: 420px; }
@keyframes fadeIn-b-qix8r15pqi { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qix8r15pqi { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qix8r15pqi] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qix8r15pqi] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qix8r15pqi] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qix8r15pqi] { color: #dc2626; }
.modal-close[b-qix8r15pqi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qix8r15pqi] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qix8r15pqi] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qix8r15pqi] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qix8r15pqi] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qix8r15pqi] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qix8r15pqi] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qix8r15pqi] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qix8r15pqi] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qix8r15pqi] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qix8r15pqi] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qix8r15pqi] { flex: 2; }
.form-group label[b-qix8r15pqi] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qix8r15pqi], .form-group select[b-qix8r15pqi], .form-textarea[b-qix8r15pqi] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qix8r15pqi], .form-group select:focus[b-qix8r15pqi], .form-textarea:focus[b-qix8r15pqi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qix8r15pqi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qix8r15pqi] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qix8r15pqi] { flex: 1; display: flex; align-items: center; }
.form-check[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qix8r15pqi] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qix8r15pqi] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qix8r15pqi] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qix8r15pqi] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qix8r15pqi] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qix8r15pqi] { font-size: 3rem; }
.photo-placeholder span[b-qix8r15pqi] { font-size: 0.78rem; }
.photo-actions[b-qix8r15pqi] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qix8r15pqi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qix8r15pqi] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qix8r15pqi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qix8r15pqi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qix8r15pqi] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qix8r15pqi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qix8r15pqi] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qix8r15pqi] { filter: brightness(1.15); transform: scale(1.05); }
[b-qix8r15pqi] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qix8r15pqi] { padding: 0.75rem; }
    .crud-header[b-qix8r15pqi] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qix8r15pqi] { font-size: 1.1rem; }
    .btn-text[b-qix8r15pqi] { display: none; }
    .form-row[b-qix8r15pqi] { flex-direction: column; }
    .form-row-4[b-qix8r15pqi] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qix8r15pqi] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qix8r15pqi] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qix8r15pqi] { padding: 0.75rem; }
    .modal-tabs[b-qix8r15pqi] { overflow-x: auto; }
    .modal-tab[b-qix8r15pqi] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qix8r15pqi] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qix8r15pqi] { display: grid !important; }
    .crud-cards-wrapper[b-qix8r15pqi] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qix8r15pqi] { grid-template-columns: 1fr; }
    .card-details[b-qix8r15pqi] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qix8r15pqi] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qix8r15pqi] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qix8r15pqi] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qix8r15pqi] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmcobrosrealizados.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fjelszy9fw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fjelszy9fw 0.3s ease-out; }
@keyframes slideUp-b-fjelszy9fw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fjelszy9fw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fjelszy9fw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fjelszy9fw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fjelszy9fw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fjelszy9fw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fjelszy9fw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fjelszy9fw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fjelszy9fw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fjelszy9fw] { filter: brightness(1.1); }
.btn-outline[b-fjelszy9fw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fjelszy9fw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fjelszy9fw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fjelszy9fw] { filter: brightness(1.1); }
.btn-icon[b-fjelszy9fw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fjelszy9fw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fjelszy9fw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fjelszy9fw] { color: #ef4444; }
.btn-delete:hover[b-fjelszy9fw] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fjelszy9fw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fjelszy9fw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fjelszy9fw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fjelszy9fw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fjelszy9fw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fjelszy9fw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fjelszy9fw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fjelszy9fw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fjelszy9fw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fjelszy9fw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fjelszy9fw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fjelszy9fw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fjelszy9fw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fjelszy9fw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fjelszy9fw] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fjelszy9fw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fjelszy9fw] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fjelszy9fw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fjelszy9fw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fjelszy9fw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fjelszy9fw] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fjelszy9fw] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fjelszy9fw] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fjelszy9fw] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fjelszy9fw] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fjelszy9fw] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fjelszy9fw] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fjelszy9fw] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fjelszy9fw] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fjelszy9fw] { display: block; }
.hide-on-cards[b-fjelszy9fw] { display: none !important; }
.show-on-cards[b-fjelszy9fw] { display: grid; }
.hide-on-grid[b-fjelszy9fw] { display: none !important; }

/* Badges */
.badge[b-fjelszy9fw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fjelszy9fw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fjelszy9fw] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fjelszy9fw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fjelszy9fw] { text-align: center; }
.text-muted[b-fjelszy9fw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fjelszy9fw], .crud-empty-state[b-fjelszy9fw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fjelszy9fw] { font-size: 2rem; }
.crud-spinner[b-fjelszy9fw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fjelszy9fw 0.6s linear infinite; }
.crud-spinner-sm[b-fjelszy9fw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fjelszy9fw 0.6s linear infinite; }
@keyframes spin-b-fjelszy9fw { to { transform: rotate(360deg); } }
.spin[b-fjelszy9fw] { animation: spin-b-fjelszy9fw 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fjelszy9fw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fjelszy9fw 0.15s ease-out; }
.modal-container[b-fjelszy9fw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fjelszy9fw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fjelszy9fw 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fjelszy9fw] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fjelszy9fw] { max-width: 420px; }
@keyframes fadeIn-b-fjelszy9fw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fjelszy9fw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fjelszy9fw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fjelszy9fw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fjelszy9fw] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fjelszy9fw] { color: #dc2626; }
.modal-close[b-fjelszy9fw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fjelszy9fw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fjelszy9fw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fjelszy9fw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fjelszy9fw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fjelszy9fw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fjelszy9fw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fjelszy9fw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fjelszy9fw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fjelszy9fw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fjelszy9fw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fjelszy9fw] { flex: 2; }
.form-group label[b-fjelszy9fw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fjelszy9fw], .form-group select[b-fjelszy9fw], .form-textarea[b-fjelszy9fw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fjelszy9fw], .form-group select:focus[b-fjelszy9fw], .form-textarea:focus[b-fjelszy9fw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fjelszy9fw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fjelszy9fw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fjelszy9fw] { flex: 1; display: flex; align-items: center; }
.form-check[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fjelszy9fw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fjelszy9fw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fjelszy9fw] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fjelszy9fw] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fjelszy9fw] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fjelszy9fw] { font-size: 3rem; }
.photo-placeholder span[b-fjelszy9fw] { font-size: 0.78rem; }
.photo-actions[b-fjelszy9fw] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fjelszy9fw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fjelszy9fw] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fjelszy9fw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fjelszy9fw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fjelszy9fw] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fjelszy9fw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fjelszy9fw] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fjelszy9fw] { filter: brightness(1.15); transform: scale(1.05); }
[b-fjelszy9fw] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fjelszy9fw] { padding: 0.75rem; }
    .crud-header[b-fjelszy9fw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fjelszy9fw] { font-size: 1.1rem; }
    .btn-text[b-fjelszy9fw] { display: none; }
    .form-row[b-fjelszy9fw] { flex-direction: column; }
    .form-row-4[b-fjelszy9fw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fjelszy9fw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fjelszy9fw] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fjelszy9fw] { padding: 0.75rem; }
    .modal-tabs[b-fjelszy9fw] { overflow-x: auto; }
    .modal-tab[b-fjelszy9fw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fjelszy9fw] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fjelszy9fw] { display: grid !important; }
    .crud-cards-wrapper[b-fjelszy9fw] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fjelszy9fw] { grid-template-columns: 1fr; }
    .card-details[b-fjelszy9fw] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fjelszy9fw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fjelszy9fw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fjelszy9fw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fjelszy9fw] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmgeneracuotacapital.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-z2pksqvkw5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-z2pksqvkw5 0.3s ease-out; }
@keyframes slideUp-b-z2pksqvkw5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-z2pksqvkw5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-z2pksqvkw5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-z2pksqvkw5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-z2pksqvkw5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-z2pksqvkw5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-z2pksqvkw5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-z2pksqvkw5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-z2pksqvkw5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-z2pksqvkw5] { filter: brightness(1.1); }
.btn-outline[b-z2pksqvkw5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-z2pksqvkw5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-z2pksqvkw5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-z2pksqvkw5] { filter: brightness(1.1); }
.btn-icon[b-z2pksqvkw5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-z2pksqvkw5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-z2pksqvkw5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-z2pksqvkw5] { color: #ef4444; }
.btn-delete:hover[b-z2pksqvkw5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-z2pksqvkw5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-z2pksqvkw5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-z2pksqvkw5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-z2pksqvkw5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-z2pksqvkw5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-z2pksqvkw5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-z2pksqvkw5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-z2pksqvkw5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-z2pksqvkw5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-z2pksqvkw5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-z2pksqvkw5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-z2pksqvkw5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-z2pksqvkw5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-z2pksqvkw5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-z2pksqvkw5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-z2pksqvkw5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-z2pksqvkw5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-z2pksqvkw5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-z2pksqvkw5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-z2pksqvkw5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-z2pksqvkw5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-z2pksqvkw5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-z2pksqvkw5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-z2pksqvkw5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-z2pksqvkw5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-z2pksqvkw5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-z2pksqvkw5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-z2pksqvkw5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-z2pksqvkw5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-z2pksqvkw5] { display: block; }
.hide-on-cards[b-z2pksqvkw5] { display: none !important; }
.show-on-cards[b-z2pksqvkw5] { display: grid; }
.hide-on-grid[b-z2pksqvkw5] { display: none !important; }

/* Badges */
.badge[b-z2pksqvkw5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-z2pksqvkw5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-z2pksqvkw5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-z2pksqvkw5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-z2pksqvkw5] { text-align: center; }
.text-muted[b-z2pksqvkw5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-z2pksqvkw5], .crud-empty-state[b-z2pksqvkw5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-z2pksqvkw5] { font-size: 2rem; }
.crud-spinner[b-z2pksqvkw5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-z2pksqvkw5 0.6s linear infinite; }
.crud-spinner-sm[b-z2pksqvkw5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-z2pksqvkw5 0.6s linear infinite; }
@keyframes spin-b-z2pksqvkw5 { to { transform: rotate(360deg); } }
.spin[b-z2pksqvkw5] { animation: spin-b-z2pksqvkw5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-z2pksqvkw5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-z2pksqvkw5 0.15s ease-out; }
.modal-container[b-z2pksqvkw5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-z2pksqvkw5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-z2pksqvkw5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-z2pksqvkw5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-z2pksqvkw5] { max-width: 420px; }
@keyframes fadeIn-b-z2pksqvkw5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-z2pksqvkw5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-z2pksqvkw5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-z2pksqvkw5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-z2pksqvkw5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-z2pksqvkw5] { color: #dc2626; }
.modal-close[b-z2pksqvkw5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-z2pksqvkw5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-z2pksqvkw5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-z2pksqvkw5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-z2pksqvkw5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-z2pksqvkw5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-z2pksqvkw5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-z2pksqvkw5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-z2pksqvkw5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-z2pksqvkw5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-z2pksqvkw5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-z2pksqvkw5] { flex: 2; }
.form-group label[b-z2pksqvkw5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-z2pksqvkw5], .form-group select[b-z2pksqvkw5], .form-textarea[b-z2pksqvkw5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-z2pksqvkw5], .form-group select:focus[b-z2pksqvkw5], .form-textarea:focus[b-z2pksqvkw5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-z2pksqvkw5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-z2pksqvkw5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-z2pksqvkw5] { flex: 1; display: flex; align-items: center; }
.form-check[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-z2pksqvkw5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-z2pksqvkw5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-z2pksqvkw5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-z2pksqvkw5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-z2pksqvkw5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-z2pksqvkw5] { font-size: 3rem; }
.photo-placeholder span[b-z2pksqvkw5] { font-size: 0.78rem; }
.photo-actions[b-z2pksqvkw5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-z2pksqvkw5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-z2pksqvkw5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-z2pksqvkw5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-z2pksqvkw5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-z2pksqvkw5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-z2pksqvkw5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-z2pksqvkw5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-z2pksqvkw5] { filter: brightness(1.15); transform: scale(1.05); }
[b-z2pksqvkw5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-z2pksqvkw5] { padding: 0.75rem; }
    .crud-header[b-z2pksqvkw5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-z2pksqvkw5] { font-size: 1.1rem; }
    .btn-text[b-z2pksqvkw5] { display: none; }
    .form-row[b-z2pksqvkw5] { flex-direction: column; }
    .form-row-4[b-z2pksqvkw5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-z2pksqvkw5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-z2pksqvkw5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-z2pksqvkw5] { padding: 0.75rem; }
    .modal-tabs[b-z2pksqvkw5] { overflow-x: auto; }
    .modal-tab[b-z2pksqvkw5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-z2pksqvkw5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-z2pksqvkw5] { display: grid !important; }
    .crud-cards-wrapper[b-z2pksqvkw5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-z2pksqvkw5] { grid-template-columns: 1fr; }
    .card-details[b-z2pksqvkw5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-z2pksqvkw5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-z2pksqvkw5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-z2pksqvkw5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-z2pksqvkw5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmgestiones.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zitc7torh3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zitc7torh3 0.3s ease-out; }
@keyframes slideUp-b-zitc7torh3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zitc7torh3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zitc7torh3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zitc7torh3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zitc7torh3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zitc7torh3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zitc7torh3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zitc7torh3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zitc7torh3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zitc7torh3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zitc7torh3] { filter: brightness(1.1); }
.btn-outline[b-zitc7torh3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zitc7torh3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zitc7torh3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zitc7torh3] { filter: brightness(1.1); }
.btn-icon[b-zitc7torh3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zitc7torh3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zitc7torh3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zitc7torh3] { color: #ef4444; }
.btn-delete:hover[b-zitc7torh3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zitc7torh3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zitc7torh3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zitc7torh3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zitc7torh3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zitc7torh3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zitc7torh3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zitc7torh3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zitc7torh3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zitc7torh3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zitc7torh3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zitc7torh3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zitc7torh3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zitc7torh3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zitc7torh3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zitc7torh3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zitc7torh3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zitc7torh3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zitc7torh3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zitc7torh3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zitc7torh3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zitc7torh3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zitc7torh3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zitc7torh3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zitc7torh3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zitc7torh3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zitc7torh3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zitc7torh3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zitc7torh3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zitc7torh3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zitc7torh3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zitc7torh3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zitc7torh3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zitc7torh3] { display: block; }
.hide-on-cards[b-zitc7torh3] { display: none !important; }
.show-on-cards[b-zitc7torh3] { display: grid; }
.hide-on-grid[b-zitc7torh3] { display: none !important; }

/* Badges */
.badge[b-zitc7torh3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zitc7torh3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zitc7torh3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zitc7torh3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zitc7torh3] { text-align: center; }
.text-muted[b-zitc7torh3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zitc7torh3], .crud-empty-state[b-zitc7torh3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zitc7torh3] { font-size: 2rem; }
.crud-spinner[b-zitc7torh3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zitc7torh3 0.6s linear infinite; }
.crud-spinner-sm[b-zitc7torh3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zitc7torh3 0.6s linear infinite; }
@keyframes spin-b-zitc7torh3 { to { transform: rotate(360deg); } }
.spin[b-zitc7torh3] { animation: spin-b-zitc7torh3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zitc7torh3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zitc7torh3 0.15s ease-out; }
.modal-container[b-zitc7torh3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zitc7torh3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zitc7torh3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zitc7torh3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zitc7torh3] { max-width: 420px; }
@keyframes fadeIn-b-zitc7torh3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zitc7torh3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zitc7torh3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zitc7torh3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zitc7torh3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zitc7torh3] { color: #dc2626; }
.modal-close[b-zitc7torh3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zitc7torh3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zitc7torh3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zitc7torh3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zitc7torh3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zitc7torh3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zitc7torh3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zitc7torh3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zitc7torh3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zitc7torh3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zitc7torh3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zitc7torh3] { flex: 2; }
.form-group label[b-zitc7torh3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zitc7torh3], .form-group select[b-zitc7torh3], .form-textarea[b-zitc7torh3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zitc7torh3], .form-group select:focus[b-zitc7torh3], .form-textarea:focus[b-zitc7torh3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zitc7torh3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zitc7torh3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zitc7torh3] { flex: 1; display: flex; align-items: center; }
.form-check[b-zitc7torh3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zitc7torh3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zitc7torh3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zitc7torh3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zitc7torh3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zitc7torh3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zitc7torh3] { font-size: 3rem; }
.photo-placeholder span[b-zitc7torh3] { font-size: 0.78rem; }
.photo-actions[b-zitc7torh3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zitc7torh3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zitc7torh3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zitc7torh3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zitc7torh3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zitc7torh3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zitc7torh3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zitc7torh3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zitc7torh3] { filter: brightness(1.15); transform: scale(1.05); }
[b-zitc7torh3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zitc7torh3] { padding: 0.75rem; }
    .crud-header[b-zitc7torh3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zitc7torh3] { font-size: 1.1rem; }
    .btn-text[b-zitc7torh3] { display: none; }
    .form-row[b-zitc7torh3] { flex-direction: column; }
    .form-row-4[b-zitc7torh3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zitc7torh3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zitc7torh3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zitc7torh3] { padding: 0.75rem; }
    .modal-tabs[b-zitc7torh3] { overflow-x: auto; }
    .modal-tab[b-zitc7torh3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zitc7torh3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zitc7torh3] { display: grid !important; }
    .crud-cards-wrapper[b-zitc7torh3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zitc7torh3] { grid-template-columns: 1fr; }
    .card-details[b-zitc7torh3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zitc7torh3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zitc7torh3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zitc7torh3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zitc7torh3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmprepararemisionacreedor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kmhs71y5b8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kmhs71y5b8 0.3s ease-out; }
@keyframes slideUp-b-kmhs71y5b8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kmhs71y5b8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kmhs71y5b8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kmhs71y5b8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kmhs71y5b8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kmhs71y5b8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kmhs71y5b8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kmhs71y5b8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kmhs71y5b8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kmhs71y5b8] { filter: brightness(1.1); }
.btn-outline[b-kmhs71y5b8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kmhs71y5b8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kmhs71y5b8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kmhs71y5b8] { filter: brightness(1.1); }
.btn-icon[b-kmhs71y5b8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kmhs71y5b8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kmhs71y5b8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kmhs71y5b8] { color: #ef4444; }
.btn-delete:hover[b-kmhs71y5b8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kmhs71y5b8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kmhs71y5b8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kmhs71y5b8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kmhs71y5b8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kmhs71y5b8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kmhs71y5b8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kmhs71y5b8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kmhs71y5b8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kmhs71y5b8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kmhs71y5b8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kmhs71y5b8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kmhs71y5b8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kmhs71y5b8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kmhs71y5b8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kmhs71y5b8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kmhs71y5b8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kmhs71y5b8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kmhs71y5b8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kmhs71y5b8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kmhs71y5b8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kmhs71y5b8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kmhs71y5b8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kmhs71y5b8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kmhs71y5b8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kmhs71y5b8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kmhs71y5b8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kmhs71y5b8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kmhs71y5b8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kmhs71y5b8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kmhs71y5b8] { display: block; }
.hide-on-cards[b-kmhs71y5b8] { display: none !important; }
.show-on-cards[b-kmhs71y5b8] { display: grid; }
.hide-on-grid[b-kmhs71y5b8] { display: none !important; }

/* Badges */
.badge[b-kmhs71y5b8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kmhs71y5b8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kmhs71y5b8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kmhs71y5b8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kmhs71y5b8] { text-align: center; }
.text-muted[b-kmhs71y5b8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kmhs71y5b8], .crud-empty-state[b-kmhs71y5b8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kmhs71y5b8] { font-size: 2rem; }
.crud-spinner[b-kmhs71y5b8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kmhs71y5b8 0.6s linear infinite; }
.crud-spinner-sm[b-kmhs71y5b8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kmhs71y5b8 0.6s linear infinite; }
@keyframes spin-b-kmhs71y5b8 { to { transform: rotate(360deg); } }
.spin[b-kmhs71y5b8] { animation: spin-b-kmhs71y5b8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kmhs71y5b8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kmhs71y5b8 0.15s ease-out; }
.modal-container[b-kmhs71y5b8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kmhs71y5b8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kmhs71y5b8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kmhs71y5b8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kmhs71y5b8] { max-width: 420px; }
@keyframes fadeIn-b-kmhs71y5b8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kmhs71y5b8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kmhs71y5b8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kmhs71y5b8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kmhs71y5b8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kmhs71y5b8] { color: #dc2626; }
.modal-close[b-kmhs71y5b8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kmhs71y5b8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kmhs71y5b8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kmhs71y5b8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kmhs71y5b8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kmhs71y5b8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kmhs71y5b8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kmhs71y5b8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kmhs71y5b8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kmhs71y5b8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kmhs71y5b8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kmhs71y5b8] { flex: 2; }
.form-group label[b-kmhs71y5b8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kmhs71y5b8], .form-group select[b-kmhs71y5b8], .form-textarea[b-kmhs71y5b8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kmhs71y5b8], .form-group select:focus[b-kmhs71y5b8], .form-textarea:focus[b-kmhs71y5b8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kmhs71y5b8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kmhs71y5b8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kmhs71y5b8] { flex: 1; display: flex; align-items: center; }
.form-check[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kmhs71y5b8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kmhs71y5b8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kmhs71y5b8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kmhs71y5b8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kmhs71y5b8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kmhs71y5b8] { font-size: 3rem; }
.photo-placeholder span[b-kmhs71y5b8] { font-size: 0.78rem; }
.photo-actions[b-kmhs71y5b8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kmhs71y5b8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kmhs71y5b8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kmhs71y5b8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kmhs71y5b8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kmhs71y5b8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kmhs71y5b8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kmhs71y5b8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kmhs71y5b8] { filter: brightness(1.15); transform: scale(1.05); }
[b-kmhs71y5b8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kmhs71y5b8] { padding: 0.75rem; }
    .crud-header[b-kmhs71y5b8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kmhs71y5b8] { font-size: 1.1rem; }
    .btn-text[b-kmhs71y5b8] { display: none; }
    .form-row[b-kmhs71y5b8] { flex-direction: column; }
    .form-row-4[b-kmhs71y5b8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kmhs71y5b8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kmhs71y5b8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kmhs71y5b8] { padding: 0.75rem; }
    .modal-tabs[b-kmhs71y5b8] { overflow-x: auto; }
    .modal-tab[b-kmhs71y5b8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kmhs71y5b8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kmhs71y5b8] { display: grid !important; }
    .crud-cards-wrapper[b-kmhs71y5b8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kmhs71y5b8] { grid-template-columns: 1fr; }
    .card-details[b-kmhs71y5b8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kmhs71y5b8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kmhs71y5b8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kmhs71y5b8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kmhs71y5b8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmprocesoimport.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-bi7brjjssb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bi7brjjssb 0.3s ease-out; }
@keyframes slideUp-b-bi7brjjssb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bi7brjjssb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bi7brjjssb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bi7brjjssb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bi7brjjssb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bi7brjjssb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bi7brjjssb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bi7brjjssb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bi7brjjssb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bi7brjjssb] { filter: brightness(1.1); }
.btn-outline[b-bi7brjjssb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bi7brjjssb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bi7brjjssb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bi7brjjssb] { filter: brightness(1.1); }
.btn-icon[b-bi7brjjssb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bi7brjjssb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bi7brjjssb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bi7brjjssb] { color: #ef4444; }
.btn-delete:hover[b-bi7brjjssb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-bi7brjjssb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bi7brjjssb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bi7brjjssb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bi7brjjssb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bi7brjjssb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bi7brjjssb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-bi7brjjssb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bi7brjjssb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-bi7brjjssb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bi7brjjssb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bi7brjjssb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bi7brjjssb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bi7brjjssb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bi7brjjssb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bi7brjjssb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-bi7brjjssb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-bi7brjjssb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-bi7brjjssb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-bi7brjjssb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-bi7brjjssb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-bi7brjjssb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-bi7brjjssb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-bi7brjjssb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-bi7brjjssb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-bi7brjjssb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-bi7brjjssb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-bi7brjjssb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-bi7brjjssb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-bi7brjjssb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-bi7brjjssb] { display: block; }
.hide-on-cards[b-bi7brjjssb] { display: none !important; }
.show-on-cards[b-bi7brjjssb] { display: grid; }
.hide-on-grid[b-bi7brjjssb] { display: none !important; }

/* Badges */
.badge[b-bi7brjjssb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bi7brjjssb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bi7brjjssb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-bi7brjjssb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bi7brjjssb] { text-align: center; }
.text-muted[b-bi7brjjssb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bi7brjjssb], .crud-empty-state[b-bi7brjjssb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bi7brjjssb] { font-size: 2rem; }
.crud-spinner[b-bi7brjjssb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bi7brjjssb 0.6s linear infinite; }
.crud-spinner-sm[b-bi7brjjssb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bi7brjjssb 0.6s linear infinite; }
@keyframes spin-b-bi7brjjssb { to { transform: rotate(360deg); } }
.spin[b-bi7brjjssb] { animation: spin-b-bi7brjjssb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-bi7brjjssb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bi7brjjssb 0.15s ease-out; }
.modal-container[b-bi7brjjssb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bi7brjjssb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bi7brjjssb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-bi7brjjssb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-bi7brjjssb] { max-width: 420px; }
@keyframes fadeIn-b-bi7brjjssb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bi7brjjssb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bi7brjjssb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bi7brjjssb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-bi7brjjssb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-bi7brjjssb] { color: #dc2626; }
.modal-close[b-bi7brjjssb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bi7brjjssb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bi7brjjssb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bi7brjjssb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bi7brjjssb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-bi7brjjssb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bi7brjjssb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bi7brjjssb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bi7brjjssb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bi7brjjssb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bi7brjjssb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bi7brjjssb] { flex: 2; }
.form-group label[b-bi7brjjssb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bi7brjjssb], .form-group select[b-bi7brjjssb], .form-textarea[b-bi7brjjssb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bi7brjjssb], .form-group select:focus[b-bi7brjjssb], .form-textarea:focus[b-bi7brjjssb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bi7brjjssb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bi7brjjssb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bi7brjjssb] { flex: 1; display: flex; align-items: center; }
.form-check[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bi7brjjssb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-bi7brjjssb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-bi7brjjssb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-bi7brjjssb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-bi7brjjssb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-bi7brjjssb] { font-size: 3rem; }
.photo-placeholder span[b-bi7brjjssb] { font-size: 0.78rem; }
.photo-actions[b-bi7brjjssb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-bi7brjjssb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-bi7brjjssb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-bi7brjjssb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-bi7brjjssb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-bi7brjjssb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-bi7brjjssb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-bi7brjjssb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-bi7brjjssb] { filter: brightness(1.15); transform: scale(1.05); }
[b-bi7brjjssb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bi7brjjssb] { padding: 0.75rem; }
    .crud-header[b-bi7brjjssb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bi7brjjssb] { font-size: 1.1rem; }
    .btn-text[b-bi7brjjssb] { display: none; }
    .form-row[b-bi7brjjssb] { flex-direction: column; }
    .form-row-4[b-bi7brjjssb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bi7brjjssb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bi7brjjssb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-bi7brjjssb] { padding: 0.75rem; }
    .modal-tabs[b-bi7brjjssb] { overflow-x: auto; }
    .modal-tab[b-bi7brjjssb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-bi7brjjssb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-bi7brjjssb] { display: grid !important; }
    .crud-cards-wrapper[b-bi7brjjssb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-bi7brjjssb] { grid-template-columns: 1fr; }
    .card-details[b-bi7brjjssb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-bi7brjjssb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bi7brjjssb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bi7brjjssb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bi7brjjssb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmregistragarantecbr.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-u9tlt7pq2z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-u9tlt7pq2z 0.3s ease-out; }
@keyframes slideUp-b-u9tlt7pq2z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-u9tlt7pq2z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-u9tlt7pq2z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-u9tlt7pq2z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-u9tlt7pq2z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-u9tlt7pq2z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-u9tlt7pq2z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-u9tlt7pq2z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-u9tlt7pq2z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-u9tlt7pq2z] { filter: brightness(1.1); }
.btn-outline[b-u9tlt7pq2z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-u9tlt7pq2z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-u9tlt7pq2z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-u9tlt7pq2z] { filter: brightness(1.1); }
.btn-icon[b-u9tlt7pq2z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-u9tlt7pq2z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-u9tlt7pq2z] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-u9tlt7pq2z] { color: #ef4444; }
.btn-delete:hover[b-u9tlt7pq2z] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-u9tlt7pq2z] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-u9tlt7pq2z] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-u9tlt7pq2z] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-u9tlt7pq2z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-u9tlt7pq2z] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-u9tlt7pq2z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-u9tlt7pq2z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-u9tlt7pq2z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-u9tlt7pq2z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-u9tlt7pq2z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-u9tlt7pq2z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-u9tlt7pq2z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-u9tlt7pq2z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-u9tlt7pq2z] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-u9tlt7pq2z] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-u9tlt7pq2z] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-u9tlt7pq2z] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-u9tlt7pq2z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-u9tlt7pq2z] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-u9tlt7pq2z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-u9tlt7pq2z] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-u9tlt7pq2z] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-u9tlt7pq2z] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-u9tlt7pq2z] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-u9tlt7pq2z] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-u9tlt7pq2z] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-u9tlt7pq2z] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-u9tlt7pq2z] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-u9tlt7pq2z] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-u9tlt7pq2z] { display: block; }
.hide-on-cards[b-u9tlt7pq2z] { display: none !important; }
.show-on-cards[b-u9tlt7pq2z] { display: grid; }
.hide-on-grid[b-u9tlt7pq2z] { display: none !important; }

/* Badges */
.badge[b-u9tlt7pq2z] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-u9tlt7pq2z] { background: #ecfdf5; color: #065f46; }
.badge-no[b-u9tlt7pq2z] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-u9tlt7pq2z] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-u9tlt7pq2z] { text-align: center; }
.text-muted[b-u9tlt7pq2z] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-u9tlt7pq2z], .crud-empty-state[b-u9tlt7pq2z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-u9tlt7pq2z] { font-size: 2rem; }
.crud-spinner[b-u9tlt7pq2z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-u9tlt7pq2z 0.6s linear infinite; }
.crud-spinner-sm[b-u9tlt7pq2z] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-u9tlt7pq2z 0.6s linear infinite; }
@keyframes spin-b-u9tlt7pq2z { to { transform: rotate(360deg); } }
.spin[b-u9tlt7pq2z] { animation: spin-b-u9tlt7pq2z 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-u9tlt7pq2z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-u9tlt7pq2z 0.15s ease-out; }
.modal-container[b-u9tlt7pq2z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-u9tlt7pq2z] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-u9tlt7pq2z 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-u9tlt7pq2z] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-u9tlt7pq2z] { max-width: 420px; }
@keyframes fadeIn-b-u9tlt7pq2z { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-u9tlt7pq2z { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-u9tlt7pq2z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-u9tlt7pq2z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-u9tlt7pq2z] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-u9tlt7pq2z] { color: #dc2626; }
.modal-close[b-u9tlt7pq2z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-u9tlt7pq2z] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-u9tlt7pq2z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-u9tlt7pq2z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-u9tlt7pq2z] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-u9tlt7pq2z] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-u9tlt7pq2z] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-u9tlt7pq2z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-u9tlt7pq2z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-u9tlt7pq2z] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-u9tlt7pq2z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-u9tlt7pq2z] { flex: 2; }
.form-group label[b-u9tlt7pq2z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-u9tlt7pq2z], .form-group select[b-u9tlt7pq2z], .form-textarea[b-u9tlt7pq2z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-u9tlt7pq2z], .form-group select:focus[b-u9tlt7pq2z], .form-textarea:focus[b-u9tlt7pq2z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-u9tlt7pq2z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-u9tlt7pq2z] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-u9tlt7pq2z] { flex: 1; display: flex; align-items: center; }
.form-check[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-u9tlt7pq2z] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-u9tlt7pq2z] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-u9tlt7pq2z] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-u9tlt7pq2z] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-u9tlt7pq2z] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-u9tlt7pq2z] { font-size: 3rem; }
.photo-placeholder span[b-u9tlt7pq2z] { font-size: 0.78rem; }
.photo-actions[b-u9tlt7pq2z] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-u9tlt7pq2z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-u9tlt7pq2z] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-u9tlt7pq2z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-u9tlt7pq2z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-u9tlt7pq2z] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-u9tlt7pq2z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-u9tlt7pq2z] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-u9tlt7pq2z] { filter: brightness(1.15); transform: scale(1.05); }
[b-u9tlt7pq2z] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-u9tlt7pq2z] { padding: 0.75rem; }
    .crud-header[b-u9tlt7pq2z] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-u9tlt7pq2z] { font-size: 1.1rem; }
    .btn-text[b-u9tlt7pq2z] { display: none; }
    .form-row[b-u9tlt7pq2z] { flex-direction: column; }
    .form-row-4[b-u9tlt7pq2z] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-u9tlt7pq2z] { width: 98%; max-height: 95vh; }
    .modal-lg[b-u9tlt7pq2z] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-u9tlt7pq2z] { padding: 0.75rem; }
    .modal-tabs[b-u9tlt7pq2z] { overflow-x: auto; }
    .modal-tab[b-u9tlt7pq2z] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-u9tlt7pq2z] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-u9tlt7pq2z] { display: grid !important; }
    .crud-cards-wrapper[b-u9tlt7pq2z] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-u9tlt7pq2z] { grid-template-columns: 1fr; }
    .card-details[b-u9tlt7pq2z] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-u9tlt7pq2z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-u9tlt7pq2z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-u9tlt7pq2z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-u9tlt7pq2z] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cobros/FrmReporteGestionCobros.razor.rz.scp.css */
/* ============================================================
   FrmReporteGestionCobros.razor.css
   Reporte Gestión de Cobros — Antigüedad CxC
   Usa únicamente tokens --rg-* para soporte dark/light
   ============================================================ */

.gc-container[b-sthdeckc2u] {
    padding: 1.25rem;
    max-width: 100%;
    animation: gcSlideUp-b-sthdeckc2u 0.3s ease-out;
}
@keyframes gcSlideUp-b-sthdeckc2u {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ──────────────────────────────────────────────── */
.gc-header[b-sthdeckc2u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.gc-header-left[b-sthdeckc2u] { display: flex; align-items: center; gap: 0.75rem; }
.gc-header-icon[b-sthdeckc2u] { font-size: 1.75rem; color: var(--rg-accent); }
.gc-title[b-sthdeckc2u]       { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.gc-subtitle[b-sthdeckc2u]    { font-size: 0.75rem; color: var(--rg-text-muted); }
.gc-header-actions[b-sthdeckc2u] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* ── Alert reutilizado ───────────────────────────────────── */
.crud-alert[b-sthdeckc2u] { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert > span[b-sthdeckc2u] { white-space: pre-line; line-height: 1.45; flex: 1; }
.crud-alert-success[b-sthdeckc2u] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert-error[b-sthdeckc2u]   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-sthdeckc2u]   { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert-success[b-sthdeckc2u] { background: rgba(34,197,94,0.12);  color: #86efac; border-color: rgba(34,197,94,0.25); }
[data-mode="dark"] .crud-alert-error[b-sthdeckc2u]   { background: rgba(239,68,68,0.12);  color: #fca5a5; border-color: rgba(239,68,68,0.25); }

/* ── Botones ─────────────────────────────────────────────── */
.btn-crud[b-sthdeckc2u] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-sthdeckc2u] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.btn-sm[b-sthdeckc2u]   { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-primary[b-sthdeckc2u]  { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-sthdeckc2u] { filter: brightness(1.1); }
.btn-outline[b-sthdeckc2u]  { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-sthdeckc2u] { background: var(--rg-bg-hover); }
.btn-danger[b-sthdeckc2u]   { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-sthdeckc2u] { filter: brightness(1.1); }

/* ── Panel filtros (acordeón) ────────────────────────────── */
.gc-filters-panel[b-sthdeckc2u] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    overflow: hidden;
}

/* Cabecera clickeable */
.gc-filters-toggle[b-sthdeckc2u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.55rem 1rem;
    cursor: pointer;
    user-select: none;
    gap: 0.5rem;
    transition: background 0.15s;
}
.gc-filters-toggle:hover[b-sthdeckc2u] { background: var(--rg-bg-hover); }

.gc-filters-toggle-left[b-sthdeckc2u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}
.gc-filters-icon[b-sthdeckc2u]    { color: var(--rg-accent); font-size: 0.85rem; }
.gc-filters-label[b-sthdeckc2u]   { font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); white-space: nowrap; }
.gc-filters-summary[b-sthdeckc2u] {
    font-size: 0.74rem;
    color: var(--rg-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gc-filters-chevron[b-sthdeckc2u] { color: var(--rg-text-muted); font-size: 0.75rem; flex-shrink: 0; transition: transform 0.2s; }

/* Cuerpo colapsable */
.gc-filters-body[b-sthdeckc2u] {
    max-height: 200px;
    overflow: hidden;
    transition: max-height 0.25s ease, opacity 0.2s ease, padding 0.2s ease;
    opacity: 1;
    padding: 0 1rem 0.75rem;
    border-top: 1px solid var(--rg-border);
}
.gc-filters-collapsed[b-sthdeckc2u] {
    max-height: 0 !important;
    opacity: 0;
    padding-bottom: 0;
    border-top-color: transparent;
}

.gc-filters-row[b-sthdeckc2u] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
    padding-top: 0.65rem;
}
.gc-filter-group[b-sthdeckc2u] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 160px;
}
.gc-filter-group label[b-sthdeckc2u] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.gc-input[b-sthdeckc2u] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    padding: 0.4rem 0.65rem;
    font-size: 0.82rem;
    outline: none;
    transition: border-color 0.15s;
}
.gc-input:focus[b-sthdeckc2u] { border-color: var(--rg-accent); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.gc-filter-actions[b-sthdeckc2u] { display: flex; gap: 0.5rem; padding-bottom: 0; }

/* ── Tabs ────────────────────────────────────────────────── */
.gc-tabs[b-sthdeckc2u] {
    display: flex;
    gap: 0.25rem;
    border-bottom: 2px solid var(--rg-border);
    margin-bottom: 0.75rem;
}
.gc-tab[b-sthdeckc2u] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--rg-text-secondary);
    cursor: pointer;
    transition: all 0.15s;
    border-radius: 0.375rem 0.375rem 0 0;
}
.gc-tab:hover[b-sthdeckc2u] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.gc-tab.active[b-sthdeckc2u] {
    color: var(--rg-accent);
    border-bottom-color: var(--rg-accent);
    font-weight: 700;
}

/* ── Loading / Empty ────────────────────────────────────── */
.gc-loading[b-sthdeckc2u], .gc-empty[b-sthdeckc2u] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted);
}
.gc-empty i[b-sthdeckc2u] { font-size: 2rem; }
.gc-spinner[b-sthdeckc2u] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: gcSpin-b-sthdeckc2u 0.6s linear infinite;
}
@keyframes gcSpin-b-sthdeckc2u { to { transform: rotate(360deg); } }
.spin[b-sthdeckc2u] { animation: gcSpin-b-sthdeckc2u 0.8s linear infinite; display: inline-block; }

/* ── Toolbar agrupación ─────────────────────────────────── */
.gc-group-toolbar[b-sthdeckc2u] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}
.gc-group-label[b-sthdeckc2u] { font-size: 0.78rem; font-weight: 600; color: var(--rg-text-secondary); }
.gc-select-group[b-sthdeckc2u] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    padding: 0.3rem 0.6rem;
    font-size: 0.8rem;
    outline: none;
    cursor: pointer;
}
.gc-expand-btns[b-sthdeckc2u] { display: flex; gap: 0.25rem; }
.gc-count-badge[b-sthdeckc2u] {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 1rem;
    padding: 0.1rem 0.6rem;
}

/* ── Grid wrapper ───────────────────────────────────────── */
.gc-grid-wrapper[b-sthdeckc2u] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 320px);
}
.gc-pivot-wrapper[b-sthdeckc2u] { max-height: calc(100vh - 280px); }

/* ── Tabla ──────────────────────────────────────────────── */
.gc-table[b-sthdeckc2u] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.77rem;
}
.gc-table thead[b-sthdeckc2u] {
    position: sticky;
    top: 0;
    z-index: 2;
}
.gc-table th[b-sthdeckc2u] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.55rem 0.7rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.71rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.gc-table tfoot[b-sthdeckc2u] { position: sticky; bottom: 0; z-index: 2; }
.gc-table td[b-sthdeckc2u] {
    padding: 0.42rem 0.7rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.num-col[b-sthdeckc2u]    { text-align: right;  font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.75rem; }
.text-right[b-sthdeckc2u] { text-align: right; }
.text-center[b-sthdeckc2u] { text-align: center; }
.font-mono[b-sthdeckc2u]  { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.73rem; }

/* th con clase num-col/text-center override el text-align:left del th base */
.gc-table th.num-col[b-sthdeckc2u]    { text-align: right;  }
.gc-table th.text-center[b-sthdeckc2u] { text-align: center; }

/* ── Filas especiales ───────────────────────────────────── */
.gc-row-sucursal[b-sthdeckc2u] {
    background: rgba(30, 58, 92, 0.12);
    cursor: pointer;
    user-select: none;
}
.gc-row-sucursal:hover[b-sthdeckc2u] { background: rgba(30, 58, 92, 0.2); }
.gc-row-sucursal td[b-sthdeckc2u] { padding: 0.45rem 0.7rem; color: var(--rg-text-primary); border-bottom: 1px solid var(--rg-border); }
[data-mode="dark"] .gc-row-sucursal[b-sthdeckc2u] { background: rgba(79,107,177,0.2); }
[data-mode="dark"] .gc-row-sucursal:hover[b-sthdeckc2u] { background: rgba(79,107,177,0.32); }

.gc-row-group[b-sthdeckc2u] {
    background: var(--rg-bg-subtle);
    cursor: pointer;
    user-select: none;
}
.gc-row-group:hover[b-sthdeckc2u] { background: var(--rg-bg-hover); }
.gc-row-group td[b-sthdeckc2u] { padding: 0.38rem 0.7rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }

.gc-row-detail:hover td[b-sthdeckc2u] { background: var(--rg-bg-hover); }
.gc-row-detail td[b-sthdeckc2u] { transition: background 0.1s; }

.gc-row-subtotal[b-sthdeckc2u] {
    background: var(--rg-bg-subtle);
    font-size: 0.74rem;
}
.gc-row-subtotal td[b-sthdeckc2u] { padding: 0.3rem 0.7rem; border-bottom: 2px solid var(--rg-border); color: var(--rg-text-secondary); }

.gc-row-grand-total[b-sthdeckc2u] {
    background: rgba(30, 58, 92, 0.08);
}
.gc-row-grand-total td[b-sthdeckc2u] { padding: 0.5rem 0.7rem; border-top: 2px solid var(--rg-border); color: var(--rg-text-primary); }
[data-mode="dark"] .gc-row-grand-total[b-sthdeckc2u] { background: rgba(79,107,177,0.15); }

/* ── Chevron ────────────────────────────────────────────── */
.gc-chevron-cell[b-sthdeckc2u] { width: 30px; color: var(--rg-text-muted); }

/* ── Balance col coloreada ──────────────────────────────── */
.gc-balance-col[b-sthdeckc2u] { color: var(--rg-accent); font-weight: 600; }

/* ── Días vencidos ──────────────────────────────────────── */
.gc-dias-col[b-sthdeckc2u] { color: #ef4444; }
[data-mode="dark"] .gc-dias-col[b-sthdeckc2u] { color: #fca5a5; }

/* ── Sub-total inline (cuando colapsado) ────────────────── */
.gc-inline-subtotal[b-sthdeckc2u] { color: var(--rg-text-secondary); font-size: 0.74rem; white-space: nowrap; }

/* ── Badge de reg count ─────────────────────────────────── */
.gc-reg-badge[b-sthdeckc2u] {
    display: inline-block;
    background: rgba(79,70,229,0.1);
    color: var(--rg-accent);
    border: 1px solid rgba(79,70,229,0.2);
    border-radius: 1rem;
    padding: 0 0.4rem;
    font-size: 0.68rem;
    font-weight: 700;
    margin-left: 0.25rem;
}
[data-mode="dark"] .gc-reg-badge[b-sthdeckc2u] { background: rgba(129,140,248,0.15); color: #818cf8; }

/* ── Pivot table ────────────────────────────────────────── */
.gc-pivot-table th.gc-th-aging[b-sthdeckc2u] {
    background: rgba(30, 58, 92, 0.15);
    color: var(--rg-text-primary);
    font-size: 0.75rem;
    text-transform: none;
    letter-spacing: 0;
    border-bottom: 1px solid var(--rg-border);
}
[data-mode="dark"] .gc-pivot-table th.gc-th-aging[b-sthdeckc2u] { background: rgba(79,107,177,0.25); }
.gc-th-bucket[b-sthdeckc2u] { white-space: nowrap; min-width: 75px; }
.gc-th-total[b-sthdeckc2u]  { min-width: 90px; }
.gc-cell-empty[b-sthdeckc2u] { color: var(--rg-text-muted); font-size: 0.7rem; }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 768px) {
    .gc-container[b-sthdeckc2u] { padding: 0.75rem; }
    .gc-header[b-sthdeckc2u]    { flex-direction: column; align-items: flex-start; }
    .btn-text[b-sthdeckc2u]     { display: none; }
    .gc-filters-row[b-sthdeckc2u] { flex-direction: column; }
    .gc-filter-group[b-sthdeckc2u] { width: 100%; }
}
/* _content/Rgclouds.Web/Components/Pages/Cobros/Frmreporteremisiones.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ekf776hwl2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ekf776hwl2 0.3s ease-out; }
@keyframes slideUp-b-ekf776hwl2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ekf776hwl2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ekf776hwl2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ekf776hwl2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ekf776hwl2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ekf776hwl2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ekf776hwl2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ekf776hwl2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ekf776hwl2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ekf776hwl2] { filter: brightness(1.1); }
.btn-outline[b-ekf776hwl2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ekf776hwl2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ekf776hwl2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ekf776hwl2] { filter: brightness(1.1); }
.btn-icon[b-ekf776hwl2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ekf776hwl2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ekf776hwl2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ekf776hwl2] { color: #ef4444; }
.btn-delete:hover[b-ekf776hwl2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ekf776hwl2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ekf776hwl2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ekf776hwl2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ekf776hwl2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ekf776hwl2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ekf776hwl2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ekf776hwl2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ekf776hwl2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ekf776hwl2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ekf776hwl2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ekf776hwl2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ekf776hwl2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ekf776hwl2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ekf776hwl2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ekf776hwl2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ekf776hwl2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ekf776hwl2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ekf776hwl2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ekf776hwl2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ekf776hwl2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ekf776hwl2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ekf776hwl2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ekf776hwl2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ekf776hwl2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ekf776hwl2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ekf776hwl2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ekf776hwl2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ekf776hwl2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ekf776hwl2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ekf776hwl2] { display: block; }
.hide-on-cards[b-ekf776hwl2] { display: none !important; }
.show-on-cards[b-ekf776hwl2] { display: grid; }
.hide-on-grid[b-ekf776hwl2] { display: none !important; }

/* Badges */
.badge[b-ekf776hwl2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ekf776hwl2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ekf776hwl2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ekf776hwl2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ekf776hwl2] { text-align: center; }
.text-muted[b-ekf776hwl2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ekf776hwl2], .crud-empty-state[b-ekf776hwl2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ekf776hwl2] { font-size: 2rem; }
.crud-spinner[b-ekf776hwl2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ekf776hwl2 0.6s linear infinite; }
.crud-spinner-sm[b-ekf776hwl2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ekf776hwl2 0.6s linear infinite; }
@keyframes spin-b-ekf776hwl2 { to { transform: rotate(360deg); } }
.spin[b-ekf776hwl2] { animation: spin-b-ekf776hwl2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ekf776hwl2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ekf776hwl2 0.15s ease-out; }
.modal-container[b-ekf776hwl2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ekf776hwl2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ekf776hwl2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ekf776hwl2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ekf776hwl2] { max-width: 420px; }
@keyframes fadeIn-b-ekf776hwl2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ekf776hwl2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ekf776hwl2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ekf776hwl2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ekf776hwl2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ekf776hwl2] { color: #dc2626; }
.modal-close[b-ekf776hwl2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ekf776hwl2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ekf776hwl2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ekf776hwl2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ekf776hwl2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ekf776hwl2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ekf776hwl2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ekf776hwl2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ekf776hwl2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ekf776hwl2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ekf776hwl2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ekf776hwl2] { flex: 2; }
.form-group label[b-ekf776hwl2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ekf776hwl2], .form-group select[b-ekf776hwl2], .form-textarea[b-ekf776hwl2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ekf776hwl2], .form-group select:focus[b-ekf776hwl2], .form-textarea:focus[b-ekf776hwl2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ekf776hwl2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ekf776hwl2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ekf776hwl2] { flex: 1; display: flex; align-items: center; }
.form-check[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ekf776hwl2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ekf776hwl2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ekf776hwl2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ekf776hwl2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ekf776hwl2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ekf776hwl2] { font-size: 3rem; }
.photo-placeholder span[b-ekf776hwl2] { font-size: 0.78rem; }
.photo-actions[b-ekf776hwl2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ekf776hwl2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ekf776hwl2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ekf776hwl2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ekf776hwl2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ekf776hwl2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ekf776hwl2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ekf776hwl2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ekf776hwl2] { filter: brightness(1.15); transform: scale(1.05); }
[b-ekf776hwl2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ekf776hwl2] { padding: 0.75rem; }
    .crud-header[b-ekf776hwl2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ekf776hwl2] { font-size: 1.1rem; }
    .btn-text[b-ekf776hwl2] { display: none; }
    .form-row[b-ekf776hwl2] { flex-direction: column; }
    .form-row-4[b-ekf776hwl2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ekf776hwl2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ekf776hwl2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ekf776hwl2] { padding: 0.75rem; }
    .modal-tabs[b-ekf776hwl2] { overflow-x: auto; }
    .modal-tab[b-ekf776hwl2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ekf776hwl2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ekf776hwl2] { display: grid !important; }
    .crud-cards-wrapper[b-ekf776hwl2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ekf776hwl2] { grid-template-columns: 1fr; }
    .card-details[b-ekf776hwl2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ekf776hwl2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ekf776hwl2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ekf776hwl2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ekf776hwl2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/FrmClgAnulacionDocumento.razor.rz.scp.css */
/* ============================================================
   FrmClgAnulacionDocumento — Estilos CRUD estándar + específicos
   ============================================================ */

.crud-container[b-gzvz90okkk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gzvz90okkk 0.3s ease-out; }
@keyframes slideUp-b-gzvz90okkk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gzvz90okkk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gzvz90okkk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gzvz90okkk] { font-size: 1.75rem; }
.crud-title[b-gzvz90okkk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-gzvz90okkk] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-gzvz90okkk] { display: flex; gap: 0.5rem; }

/* Botones */
.btn-crud[b-gzvz90okkk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gzvz90okkk] { opacity: 0.6; cursor: not-allowed; }
.btn-outline[b-gzvz90okkk] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-gzvz90okkk] { background: var(--rg-bg-hover); }
.btn-danger[b-gzvz90okkk] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-gzvz90okkk] { filter: brightness(1.1); }
.btn-icon[b-gzvz90okkk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-icon:disabled[b-gzvz90okkk] { opacity: 0.4; cursor: not-allowed; }
.btn-delete[b-gzvz90okkk] { color: var(--rg-danger); }
.btn-delete:hover:not(:disabled)[b-gzvz90okkk] { background: rgba(220,38,38,0.1); }

/* Alert */
.crud-alert[b-gzvz90okkk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gzvz90okkk] { background: rgba(22,163,74,0.1); color: var(--rg-success); border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-gzvz90okkk]   { background: rgba(220,38,38,0.1); color: var(--rg-danger); border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-gzvz90okkk] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-gzvz90okkk]   { color: #fca5a5; }
.crud-alert-close[b-gzvz90okkk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Búsqueda */
.crud-search-bar[b-gzvz90okkk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card); }
.crud-search-bar input[b-gzvz90okkk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-btn[b-gzvz90okkk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; }
.crud-search-clear[b-gzvz90okkk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-gzvz90okkk] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-gzvz90okkk] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-gzvz90okkk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gzvz90okkk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gzvz90okkk] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gzvz90okkk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-gzvz90okkk] { background: var(--rg-bg-hover); }
.crud-table tbody tr.row-anulado td[b-gzvz90okkk] { opacity: 0.55; }
.col-actions[b-gzvz90okkk] { text-align: center; white-space: nowrap; }
.text-right[b-gzvz90okkk] { text-align: right; }
.text-center[b-gzvz90okkk] { text-align: center; }
.text-muted[b-gzvz90okkk] { color: var(--rg-text-muted); }
.font-mono[b-gzvz90okkk] { font-family: 'Cascadia Code', 'Fira Code', monospace; }

/* Loading / Empty */
.crud-loading[b-gzvz90okkk] { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 3rem; color: var(--rg-text-muted); }
.crud-spinner[b-gzvz90okkk] { width: 1.5rem; height: 1.5rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-gzvz90okkk 0.7s linear infinite; }
@keyframes spin-b-gzvz90okkk { to { transform: rotate(360deg); } }
.crud-empty-state[b-gzvz90okkk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }

/* Icono tipo doc (columna avatar) */
.doc-icon[b-gzvz90okkk] { width: 28px; height: 28px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 0.85rem; }
.tipo-rc[b-gzvz90okkk] { background: rgba(37,99,235,0.1); color: var(--rg-accent); }
.tipo-nc[b-gzvz90okkk] { background: rgba(22,163,74,0.1); color: var(--rg-success); }
.tipo-nd[b-gzvz90okkk] { background: rgba(220,38,38,0.1); color: var(--rg-danger); }

/* Badges */
.badge[b-gzvz90okkk] { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem; border-radius: 1rem; font-size: .7rem; font-weight: 600; }
.badge-rc[b-gzvz90okkk]      { background: rgba(37,99,235,0.12);  color: #1d4ed8; }
.badge-nc[b-gzvz90okkk]      { background: rgba(22,163,74,0.12);  color: #15803d; }
.badge-nd[b-gzvz90okkk]      { background: rgba(220,38,38,0.12);  color: #b91c1c; }
.badge-anulado[b-gzvz90okkk] { background: rgba(100,116,139,0.15); color: var(--rg-text-muted); }
.badge-yes[b-gzvz90okkk]     { background: rgba(22,163,74,0.12);  color: #15803d; }
.badge-no[b-gzvz90okkk]      { background: rgba(100,116,139,0.12); color: var(--rg-text-muted); }
[data-mode="dark"] .badge-rc[b-gzvz90okkk] { color: #93c5fd; }
[data-mode="dark"] .badge-nc[b-gzvz90okkk] { color: #86efac; }
[data-mode="dark"] .badge-nd[b-gzvz90okkk] { color: #fca5a5; }
[data-mode="dark"] .badge-yes[b-gzvz90okkk] { color: #86efac; }

/* Spin */
.spin[b-gzvz90okkk] { animation: spin-b-gzvz90okkk 0.7s linear infinite; }

/* ── Modal ──────────────────────────────────────────────────── */
.modal-backdrop[b-gzvz90okkk]  { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1000; }
.modal-container[b-gzvz90okkk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gzvz90okkk]    { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; box-shadow: 0 20px 60px rgba(0,0,0,0.25); pointer-events: all; display: flex; flex-direction: column; max-height: 90vh; width: 90%; max-width: 460px; }
.modal-sm[b-gzvz90okkk]        { max-width: 440px; }
.modal-header[b-gzvz90okkk]    { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-gzvz90okkk] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: .5rem; }
.modal-close[b-gzvz90okkk]     { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: .25rem; border-radius: 4px; }
.modal-close:hover:not(:disabled)[b-gzvz90okkk] { background: var(--rg-bg-hover); }
.modal-body[b-gzvz90okkk]      { padding: 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gzvz90okkk]    { display: flex; justify-content: flex-end; gap: .5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--rg-border); }

/* ── Card datos del documento ─────────────────────────────── */
.anu-doc-card[b-gzvz90okkk] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .75rem 1rem; display: flex; flex-direction: column; gap: .4rem; }
.anu-doc-row[b-gzvz90okkk]  { display: flex; align-items: baseline; gap: .5rem; font-size: .82rem; }
.anu-label[b-gzvz90okkk]    { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); min-width: 90px; }
.anu-value[b-gzvz90okkk]    { color: var(--rg-text-primary); font-weight: 500; }

/* ── Campo NCF ────────────────────────────────────────────── */
.form-group[b-gzvz90okkk]       { display: flex; flex-direction: column; gap: .3rem; }
.form-group label[b-gzvz90okkk] { font-size: .78rem; font-weight: 600; color: var(--rg-text-secondary); display: flex; align-items: center; gap: .35rem; }
.anu-required[b-gzvz90okkk]     { color: var(--rg-danger); }
.anu-ncf-input[b-gzvz90okkk]    { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 6px; padding: .45rem .65rem; font-size: .9rem; font-family: 'Cascadia Code', 'Fira Code', monospace; letter-spacing: .06em; width: 100%; }
.anu-ncf-input:focus[b-gzvz90okkk] { outline: none; border-color: var(--rg-primary); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }
select.anu-ncf-input[b-gzvz90okkk] { appearance: auto; font-family: inherit; letter-spacing: normal; cursor: pointer; }
.anu-ncf-hint[b-gzvz90okkk]     { font-size: .72rem; display: flex; align-items: center; gap: .3rem; color: var(--rg-text-muted); }
.anu-ncf-hint.ok[b-gzvz90okkk]  { color: var(--rg-success); }
.anu-ncf-hint.error[b-gzvz90okkk] { color: var(--rg-danger); }
[data-mode="dark"] .anu-ncf-hint.ok[b-gzvz90okkk]    { color: #86efac; }
[data-mode="dark"] .anu-ncf-hint.error[b-gzvz90okkk] { color: #fca5a5; }

/* Aviso sin NCF */
.anu-sin-ncf[b-gzvz90okkk] { background: rgba(37,99,235,0.06); border-left: 4px solid var(--rg-accent); border-radius: 0 .5rem .5rem 0; padding: .65rem .9rem; font-size: .8rem; color: var(--rg-text-secondary); display: flex; align-items: center; gap: .5rem; margin-top: .5rem; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclgnotacreditocondonacion.razor.rz.scp.css */
/* ── Layout ──────────────────────────────────────────────────────────────── */
.nc-container[b-qzmx3zna3t] { padding: 1rem 1.25rem; animation: ncUp-b-qzmx3zna3t .35s ease-out; }
@keyframes ncUp-b-qzmx3zna3t { from { opacity:0; transform: translateY(12px);} to { opacity:1; transform:none; } }

.nc-header[b-qzmx3zna3t] { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; flex-wrap:wrap; }
.nc-header-left[b-qzmx3zna3t] { display:flex; align-items:center; gap:.75rem; }
.nc-header-icon[b-qzmx3zna3t] { font-size:1.6rem; color:var(--rg-accent,#2563eb); }
.nc-title[b-qzmx3zna3t] { margin:0; font-size:1.25rem; font-weight:700; color:var(--rg-text-primary,#1e293b); display:flex; align-items:center; gap:.5rem; }
.nc-subtitle[b-qzmx3zna3t] { font-size:.85rem; color:var(--rg-text-secondary,#475569); }
.nc-help[b-qzmx3zna3t] { width:1.4rem; height:1.4rem; border-radius:50%; border:1px solid var(--rg-border,#e2e8f0);
    background:rgba(37,99,235,.08); color:var(--rg-accent,#2563eb); font-weight:700; cursor:pointer; font-size:.8rem; line-height:1; }

.nc-alert[b-qzmx3zna3t] { display:flex; justify-content:space-between; align-items:center; gap:.75rem; padding:.6rem .85rem;
    border-radius:.5rem; margin-bottom:.85rem; font-size:.85rem; }
.nc-alert.success[b-qzmx3zna3t] { background:rgba(22,163,74,.1); color:var(--rg-success,#16a34a); border:1px solid rgba(22,163,74,.3); }
.nc-alert.error[b-qzmx3zna3t]   { background:rgba(220,38,38,.1); color:var(--rg-danger,#dc2626);  border:1px solid rgba(220,38,38,.3); }
.nc-alert-close[b-qzmx3zna3t] { background:none; border:none; cursor:pointer; color:inherit; }

.nc-empty[b-qzmx3zna3t] { display:flex; flex-direction:column; align-items:center; gap:.6rem; padding:3rem 1rem;
    color:var(--rg-text-muted,#94a3b8); font-size:.9rem; }
.nc-empty i[b-qzmx3zna3t] { font-size:2rem; }
.nc-spinner[b-qzmx3zna3t] { width:2rem; height:2rem; border:3px solid var(--rg-border,#e2e8f0); border-top-color:var(--rg-accent,#2563eb);
    border-radius:50%; animation:ncSpin-b-qzmx3zna3t .7s linear infinite; }
@keyframes ncSpin-b-qzmx3zna3t { to { transform: rotate(360deg);} }

/* ── Filtro de fuente ────────────────────────────────────────────────────── */
.nc-tabs[b-qzmx3zna3t] { display:flex; gap:.5rem; margin-bottom:1rem; }
.nc-tab[b-qzmx3zna3t] { flex:1; display:flex; align-items:center; justify-content:center; gap:.4rem; padding:.6rem .8rem;
    border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; background:var(--rg-bg-card,#fff);
    color:var(--rg-text-secondary,#475569); font-size:.85rem; font-weight:600; cursor:pointer; transition:all .15s; }
.nc-tab:hover[b-qzmx3zna3t] { background:var(--rg-bg-hover,#f1f5f9); }
.nc-tab.active[b-qzmx3zna3t] { border:2px solid var(--rg-accent,#2563eb); background:rgba(37,99,235,.08); color:var(--rg-accent,#2563eb); }
.nc-tab-sub[b-qzmx3zna3t] { font-weight:400; font-size:.72rem; opacity:.75; }

/* ── KPIs ────────────────────────────────────────────────────────────────── */
.nc-kpis[b-qzmx3zna3t] { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin-bottom:1rem; }
.nc-kpi[b-qzmx3zna3t] { background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0);
    border-radius:.6rem; padding:.7rem .9rem; display:flex; flex-direction:column; gap:.2rem; }
.nc-kpi-lbl[b-qzmx3zna3t] { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-muted,#94a3b8); }
.nc-kpi-val[b-qzmx3zna3t] { font-size:1.3rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code','Fira Code',monospace; }
.nc-kpi-danger[b-qzmx3zna3t] { color:var(--rg-danger,#dc2626); }

/* ── Tabla ───────────────────────────────────────────────────────────────── */
.nc-grid-wrapper[b-qzmx3zna3t] { border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; overflow:hidden;
    max-height:calc(100vh - 420px); overflow-y:auto; }
.nc-table[b-qzmx3zna3t] { width:100%; border-collapse:collapse; font-size:.85rem; }
.nc-table thead th[b-qzmx3zna3t] { position:sticky; top:0; background:var(--rg-bg-subtle,#f1f5f9); color:var(--rg-text-secondary,#475569);
    text-align:left; padding:.55rem .7rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.03em;
    border-bottom:2px solid var(--rg-border,#e2e8f0); }
.nc-table tbody td[b-qzmx3zna3t] { padding:.5rem .7rem; border-bottom:1px solid var(--rg-border,#e2e8f0); color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-card,#fff); }
.nc-row-sel td[b-qzmx3zna3t] { background:rgba(37,99,235,.05); }
[data-mode="dark"] .nc-row-sel td[b-qzmx3zna3t] { background:rgba(37,99,235,.12); }
.text-right[b-qzmx3zna3t] { text-align:right; } .text-center[b-qzmx3zna3t] { text-align:center; }
.font-mono[b-qzmx3zna3t] { font-family:'Cascadia Code','Fira Code',monospace; }
.nc-vencida[b-qzmx3zna3t] { color:var(--rg-danger,#dc2626); font-weight:600; }
.nc-ref[b-qzmx3zna3t] { color:var(--rg-text-secondary,#475569); font-size:.8rem; }
.nc-amt[b-qzmx3zna3t] { width:100px; text-align:right; background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b);
    border:1px solid var(--rg-border,#e2e8f0); border-radius:.4rem; padding:.3rem .45rem; }
.nc-amt:disabled[b-qzmx3zna3t] { opacity:.4; }

.nc-badge[b-qzmx3zna3t] { display:inline-block; font-size:.68rem; font-weight:700; padding:.15rem .5rem; border-radius:999px; white-space:nowrap; }
.nc-badge-coleg[b-qzmx3zna3t] { background:rgba(37,99,235,.12); color:#1e40af; }
.nc-badge-mora[b-qzmx3zna3t]  { background:rgba(220,38,38,.12); color:#991b1b; }
.nc-badge-cargo[b-qzmx3zna3t] { background:rgba(124,58,237,.12); color:#5b21b6; }
.nc-badge-ec[b-qzmx3zna3t]    { background:rgba(13,148,136,.12); color:#0f766e; }
[data-mode="dark"] .nc-badge-coleg[b-qzmx3zna3t] { color:#93c5fd; }
[data-mode="dark"] .nc-badge-mora[b-qzmx3zna3t]  { color:#fca5a5; }
[data-mode="dark"] .nc-badge-cargo[b-qzmx3zna3t] { color:#c4b5fd; }
[data-mode="dark"] .nc-badge-ec[b-qzmx3zna3t]    { color:#5eead4; }

/* ── Footer ──────────────────────────────────────────────────────────────── */
.nc-footer[b-qzmx3zna3t] { display:flex; gap:.75rem; align-items:flex-end; margin-top:1rem; flex-wrap:wrap; }
.nc-motivo[b-qzmx3zna3t] { flex:1; min-width:240px; display:flex; flex-direction:column; gap:.25rem; }
.nc-motivo label[b-qzmx3zna3t] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.nc-motivo input[b-qzmx3zna3t] { background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b);
    border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .65rem; }
.nc-lbl-invalid[b-qzmx3zna3t] { color:var(--rg-danger,#dc2626) !important; }
.nc-input-invalid[b-qzmx3zna3t] { border-color:var(--rg-danger,#dc2626) !important; box-shadow:0 0 0 3px rgba(220,38,38,.12); }
.nc-btn-emitir[b-qzmx3zna3t] { background:var(--rg-danger,#dc2626); color:#fff; border:1px solid var(--rg-danger,#dc2626); }
.nc-btn-emitir:hover:not(:disabled)[b-qzmx3zna3t] { filter:brightness(1.05); }
.nc-btn-emitir:disabled[b-qzmx3zna3t] { opacity:.5; cursor:not-allowed; }
.nc-note[b-qzmx3zna3t] { display:flex; align-items:center; gap:.4rem; margin-top:.6rem; font-size:.75rem; color:var(--rg-text-muted,#94a3b8); }

.nc-result-row[b-qzmx3zna3t] { display:flex; justify-content:space-between; align-items:baseline; padding:.4rem 0;
    border-bottom:1px solid var(--rg-border,#e2e8f0); }
.nc-result-lbl[b-qzmx3zna3t] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.nc-result-val[b-qzmx3zna3t] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.spin[b-qzmx3zna3t] { animation:ncSpin-b-qzmx3zna3t 1s linear infinite; display:inline-block; }

/* ── Modal (obligatorio por CSS isolation) ───────────────────────────────── */
.modal-backdrop[b-qzmx3zna3t] { position:fixed; inset:0; background:rgba(0,0,0,0.4); backdrop-filter:blur(4px); z-index:1000; }
.modal-container[b-qzmx3zna3t] { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1001; pointer-events:none; }
.modal-dialog[b-qzmx3zna3t] { pointer-events:auto; background:var(--rg-bg-card,#fff); border-radius:.75rem; width:95%; max-width:680px; max-height:90vh; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,0.2); }
.modal-dialog.modal-sm[b-qzmx3zna3t] { max-width:380px; }
.modal-header[b-qzmx3zna3t] { display:flex; justify-content:space-between; align-items:center; padding:.75rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.modal-header h2[b-qzmx3zna3t] { margin:0; font-size:1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); display:flex; align-items:center; gap:.5rem; }
.modal-close[b-qzmx3zna3t] { background:none; border:none; cursor:pointer; color:var(--rg-text-muted,#94a3b8); font-size:1rem; padding:.25rem; border-radius:.25rem; }
.modal-close:hover[b-qzmx3zna3t] { color:var(--rg-text-primary); background:var(--rg-bg-hover); }
.modal-body[b-qzmx3zna3t] { padding:1rem 1.25rem; overflow-y:auto; flex:1; }
.modal-footer[b-qzmx3zna3t] { display:flex; justify-content:flex-end; gap:.5rem; padding:.625rem 1.25rem; border-top:1px solid var(--rg-border,#e2e8f0); }

/* ── Ayuda ───────────────────────────────────────────────────────────────── */
.help-icon-header[b-qzmx3zna3t] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-qzmx3zna3t] { padding:0; }
.help-section[b-qzmx3zna3t] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-qzmx3zna3t] { border-bottom:none; }
.help-section p[b-qzmx3zna3t], .help-section li[b-qzmx3zna3t] { font-size:.85rem; color:var(--rg-text-secondary,#475569); }
.help-section ol[b-qzmx3zna3t] { padding-left:1.25rem; margin:0; }
.help-section-title[b-qzmx3zna3t] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-qzmx3zna3t] { color:var(--rg-accent,#2563eb); }
.help-tip[b-qzmx3zna3t] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,.07); border-left:4px solid var(--rg-accent,#2563eb);
    border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary,#475569); }
.help-tip i[b-qzmx3zna3t] { color:var(--rg-accent,#2563eb); font-size:1rem; flex-shrink:0; }
[data-mode="dark"] .help-tip[b-qzmx3zna3t] { background:rgba(37,99,235,.12); }

@media (max-width:760px) { .nc-kpis[b-qzmx3zna3t] { grid-template-columns:1fr; } .nc-tabs[b-qzmx3zna3t] { flex-direction:column; } }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_antiguedad_saldo.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_antiguedad_saldo
   ============================================================ */

.crud-container[b-5wk63m2u1z] { padding: 1.25rem; animation: slideUp-b-5wk63m2u1z 0.3s ease-out; }
@keyframes slideUp-b-5wk63m2u1z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-5wk63m2u1z] { animation: slideUp-b-5wk63m2u1z 0.3s ease-out; }

.crud-header[b-5wk63m2u1z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5wk63m2u1z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5wk63m2u1z] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-5wk63m2u1z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-5wk63m2u1z] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-5wk63m2u1z] { display: flex; gap: 0.5rem; }

.btn-crud[b-5wk63m2u1z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-5wk63m2u1z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5wk63m2u1z] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-5wk63m2u1z] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-5wk63m2u1z] { background: var(--rg-bg-hover); }

.btn-text[b-5wk63m2u1z] { display: inline; }
@media (max-width: 768px) { .btn-text[b-5wk63m2u1z] { display: none; } }

.crud-alert[b-5wk63m2u1z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.info[b-5wk63m2u1z] { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-5wk63m2u1z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.info[b-5wk63m2u1z] { color: #93c5fd; }

/* Filtros */
.filtros-bar[b-5wk63m2u1z] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    flex-wrap: wrap;
}
.filtro-item[b-5wk63m2u1z] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-5wk63m2u1z] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.form-input[b-5wk63m2u1z] {
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
}
.form-input:focus[b-5wk63m2u1z] { border-color: var(--rg-accent); }

.crud-loading[b-5wk63m2u1z] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 3rem; gap: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-spinner[b-5wk63m2u1z] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: ant-spin-b-5wk63m2u1z 0.6s linear infinite;
}
@keyframes ant-spin-b-5wk63m2u1z { to { transform: rotate(360deg); } }
.spin[b-5wk63m2u1z] { animation: ant-spin-b-5wk63m2u1z 0.8s linear infinite; display: inline-block; }

/* ── Modal ───────────────────────────────────────────────────────── */
.modal-backdrop[b-5wk63m2u1z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-5wk63m2u1z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5wk63m2u1z] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 480px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-5wk63m2u1z] { max-width: 400px; }
.modal-header[b-5wk63m2u1z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-5wk63m2u1z] { margin: 0; font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-5wk63m2u1z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5wk63m2u1z] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-5wk63m2u1z] { overflow-y: auto; flex: 1; }
.modal-footer[b-5wk63m2u1z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Form group en modal ─────────────────────────────────────────── */
.form-group[b-5wk63m2u1z] { display: flex; flex-direction: column; gap: 0.25rem; }

/* ── Alertas success/error ────────────────────────────────────────── */
.crud-alert.success[b-5wk63m2u1z] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-5wk63m2u1z]   { background: rgba(220,38,38,0.1); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-5wk63m2u1z] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-5wk63m2u1z]   { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_caja.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_caja.razor.css
   Estilos CRUD canónicos + específicos de Caja + EvidenciaPhoto + Post-Save
   ============================================================ */

/* ── CRUD base ──────────────────────────────────────────────── */
.crud-container[b-04xu0mg9ah] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-04xu0mg9ah 0.3s ease-out; }
@keyframes slideUp-b-04xu0mg9ah { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-04xu0mg9ah] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-04xu0mg9ah] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-04xu0mg9ah] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-04xu0mg9ah] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-04xu0mg9ah] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-04xu0mg9ah] { display: flex; gap: 0.5rem; }

.btn-crud[b-04xu0mg9ah] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-04xu0mg9ah] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-04xu0mg9ah] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-04xu0mg9ah] { filter: brightness(1.1); }
.btn-outline[b-04xu0mg9ah] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-04xu0mg9ah] { background: var(--rg-bg-hover); }

.crud-alert[b-04xu0mg9ah] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-04xu0mg9ah] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-04xu0mg9ah]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-04xu0mg9ah]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-04xu0mg9ah] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-04xu0mg9ah] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-04xu0mg9ah]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-04xu0mg9ah]    { color: #93c5fd; }

.font-mono[b-04xu0mg9ah] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.78rem; }
.text-right[b-04xu0mg9ah] { text-align: right; }

/* Badges */
.badge[b-04xu0mg9ah] {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.15rem 0.5rem; border-radius: 1rem;
    font-size: 0.68rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em;
}
.badge-warning[b-04xu0mg9ah] { background: rgba(217,119,6,0.12); color: #92400e; border: 1px solid rgba(217,119,6,0.3); }
.badge-neutral[b-04xu0mg9ah] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-warning[b-04xu0mg9ah] { color: #fcd34d; }

/* ── Layout específico Caja ────────────────────────────────── */
.caja-grid-2[b-04xu0mg9ah] {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}
@media (max-width: 992px) {
    .caja-grid-2[b-04xu0mg9ah] { grid-template-columns: 1fr; }
}

.caja-panel[b-04xu0mg9ah] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 1.5rem;
}
.caja-panel-head[b-04xu0mg9ah] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}
.caja-panel-head h2[b-04xu0mg9ah] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.caja-panel-body[b-04xu0mg9ah] { padding: 1rem; }

/* Badges informativos al lado de "Tipo NCF" */
.ncf-badge[b-04xu0mg9ah] {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.05rem 0.4rem;
    border-radius: 0.7rem;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    vertical-align: middle;
}
.ncf-badge-ecf[b-04xu0mg9ah] {
    background: rgba(37,99,235,0.15);
    color: var(--rg-accent);
    border: 1px solid rgba(37,99,235,0.35);
}
.ncf-badge-trad[b-04xu0mg9ah] {
    background: rgba(100,116,139,0.15);
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
}
[data-mode="dark"] .ncf-badge-ecf[b-04xu0mg9ah] { color: #93c5fd; }

/* Vista compacta cuando no hay datos relevantes */
.caja-panel-compact[b-04xu0mg9ah] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.55rem 1rem;
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
}
.caja-panel-compact i[b-04xu0mg9ah] { color: var(--rg-text-muted); font-size: 0.95rem; }
.caja-panel-compact.ok i[b-04xu0mg9ah] { color: var(--rg-success); }

/* Botón colapsar/expandir en el head del panel */
.caja-panel-toggle[b-04xu0mg9ah] {
    background: transparent; border: 1px solid var(--rg-border);
    color: var(--rg-text-secondary);
    width: 26px; height: 26px;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background 0.15s;
}
.caja-panel-toggle:hover[b-04xu0mg9ah] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}

/* ── Estado de cuenta resumido ──────────────────────────── */
.caja-resumen-body[b-04xu0mg9ah] { padding: 1rem; }
.caja-panel-head[b-04xu0mg9ah] { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.btn-ver-detalle[b-04xu0mg9ah] {
    padding: 0.4rem 0.85rem !important;
    font-size: 0.75rem !important;
    white-space: nowrap;
}

.caja-resumen-grid[b-04xu0mg9ah] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}
@media (max-width: 1100px) {
    .caja-resumen-grid[b-04xu0mg9ah] { grid-template-columns: repeat(2, 1fr); }
}
.caja-resumen-card[b-04xu0mg9ah] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.6rem 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.resumen-lbl[b-04xu0mg9ah] {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--rg-text-muted);
    font-weight: 700;
}
.resumen-val[b-04xu0mg9ah] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
}
.resumen-sub[b-04xu0mg9ah] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
}

.caja-resumen-periodos[b-04xu0mg9ah] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding-top: 0.5rem;
    border-top: 1px dashed var(--rg-border);
}
.periodos-lbl[b-04xu0mg9ah] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    margin-right: 0.25rem;
}
.periodo-chip[b-04xu0mg9ah] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0.3rem 0.65rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.75rem;
}
.periodo-nombre[b-04xu0mg9ah] { font-weight: 700; color: var(--rg-text-primary); }
.periodo-cnt[b-04xu0mg9ah]    { color: var(--rg-text-muted); font-size: 0.7rem; }
.periodo-monto[b-04xu0mg9ah]  {
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-weight: 700;
    color: var(--rg-accent);
    font-size: 0.78rem;
}

/* ── Modal detalle EC (clases únicas para evitar conflicto con Bootstrap) ── */
.ec-det-backdrop[b-04xu0mg9ah] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    z-index: 1500;
    animation: ecDetFadeIn-b-04xu0mg9ah 0.15s ease-out;
}
.ec-det-container[b-04xu0mg9ah] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1501; pointer-events: none; padding: 1rem;
}
.ec-det-dialog[b-04xu0mg9ah] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-primary, #1e293b);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    width: 95%; max-width: 1100px;
    max-height: 90vh;
    display: flex; flex-direction: column;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    animation: ecDetScaleIn-b-04xu0mg9ah 0.2s ease-out;
}
.ec-det-header[b-04xu0mg9ah] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.ec-det-header h2[b-04xu0mg9ah] {
    margin: 0; font-size: 1rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex; align-items: center; gap: 0.5rem;
}
.ec-det-close[b-04xu0mg9ah] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem;
}
.ec-det-close:hover[b-04xu0mg9ah] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-hover, #f1f5f9);
}
.ec-det-body[b-04xu0mg9ah] {
    flex: 1; overflow-y: auto; padding: 0;
    background: var(--rg-bg-card);
}
.ec-det-footer[b-04xu0mg9ah] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

@keyframes ecDetFadeIn-b-04xu0mg9ah  { from { opacity: 0; } to { opacity: 1; } }
@keyframes ecDetScaleIn-b-04xu0mg9ah { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.ec-detalle-wrap[b-04xu0mg9ah] {
    max-height: calc(90vh - 160px);
    overflow: auto;
}
.ec-detalle-table[b-04xu0mg9ah] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}
.ec-detalle-table thead[b-04xu0mg9ah] { position: sticky; top: 0; z-index: 1; }
.ec-detalle-table th[b-04xu0mg9ah] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.ec-detalle-table th.text-right[b-04xu0mg9ah] { text-align: right; }
.ec-detalle-table td[b-04xu0mg9ah] {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.ec-detalle-table td.text-right[b-04xu0mg9ah] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.ec-detalle-table tbody tr:hover[b-04xu0mg9ah] { background: var(--rg-bg-hover); }
.ec-detalle-total td[b-04xu0mg9ah] {
    background: var(--rg-bg-subtle) !important;
    font-weight: 700;
    border-top: 2px solid var(--rg-text-primary);
    border-bottom: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.78rem;
}
.ec-detalle-total td:last-child[b-04xu0mg9ah] { color: var(--rg-accent); }

.caja-empty-state[b-04xu0mg9ah] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    gap: 1rem;
    text-align: center;
    color: var(--rg-text-muted);
}
.caja-empty-state i[b-04xu0mg9ah] { font-size: 2.5rem; color: var(--rg-text-muted); }
.caja-empty-state h3[b-04xu0mg9ah] { color: var(--rg-text-primary); font-size: 1.05rem; margin: 0; }
.caja-empty-state p[b-04xu0mg9ah] { margin: 0; max-width: 24rem; font-size: 0.85rem; }
.caja-spinner[b-04xu0mg9ah] {
    width: 2.25rem; height: 2.25rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: caja-spin-b-04xu0mg9ah 0.6s linear infinite;
}
@keyframes caja-spin-b-04xu0mg9ah { to { transform: rotate(360deg); } }
.spin[b-04xu0mg9ah] { display: inline-block; animation: caja-spin-b-04xu0mg9ah 0.8s linear infinite; }

/* Tabla estado de cuenta */
.caja-table[b-04xu0mg9ah] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.caja-table th[b-04xu0mg9ah] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.caja-table th.text-right[b-04xu0mg9ah] { text-align: right; }
.caja-table td[b-04xu0mg9ah] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.caja-table td.text-right[b-04xu0mg9ah] { text-align: right; font-variant-numeric: tabular-nums; }
.caja-table tbody tr:last-child td[b-04xu0mg9ah] { border-bottom: none; }
.caja-table tbody tr:hover td[b-04xu0mg9ah] { background: var(--rg-bg-hover); }

/* Form */
.form-row[b-04xu0mg9ah] { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.75rem; }
.form-row label[b-04xu0mg9ah] {
    font-size: 0.7rem;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.form-row.form-row-h[b-04xu0mg9ah] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
@media (max-width: 600px) { .form-row.form-row-h[b-04xu0mg9ah] { grid-template-columns: 1fr; } }

.form-input[b-04xu0mg9ah], select.form-input[b-04xu0mg9ah] {
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.15s;
}
.form-input:focus[b-04xu0mg9ah] { border-color: var(--rg-accent); }

.caja-amount[b-04xu0mg9ah] {
    font-size: 1.15rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
    padding: 0.65rem 0.85rem;
}

.caja-max-hint[b-04xu0mg9ah] {
    margin-left: 0.5rem;
    font-size: 0.62rem;
    color: var(--rg-text-muted);
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}
.caja-max-hint strong[b-04xu0mg9ah] {
    color: var(--rg-text-secondary);
    font-family: 'Cascadia Code','Fira Code',monospace;
}

.caja-amount-row[b-04xu0mg9ah] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}
.caja-amount-row .caja-amount[b-04xu0mg9ah] { flex: 1; }
.btn-pagar-todo[b-04xu0mg9ah] {
    white-space: nowrap;
    padding: 0.5rem 0.85rem;
    font-size: 0.78rem;
}

.caja-amount-error[b-04xu0mg9ah] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.4rem;
    padding: 0.45rem 0.65rem;
    background: rgba(239,68,68,0.1);
    color: #991b1b;
    border: 1px solid rgba(239,68,68,0.3);
    border-radius: 0.4rem;
    font-size: 0.78rem;
}
[data-mode="dark"] .caja-amount-error[b-04xu0mg9ah] { color: #fca5a5; }

.caja-buttons-row[b-04xu0mg9ah] {
    display: flex;
    gap: 0.5rem;
    margin-top: 1rem;
}

/* EvidenciaPhoto → ahora es EvidenciaPhotoSection.razor (componente compartido) */

/* ── Modal post-save anidado ──────────────────────────────────── */
.modal-backdrop-nested[b-04xu0mg9ah] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 2000;
}
.modal-container-nested[b-04xu0mg9ah] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2001;
    padding: 1rem;
    pointer-events: none;
}
.modal-dialog-nested[b-04xu0mg9ah] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.ps-modal[b-04xu0mg9ah] { max-width: 380px; }

.modal-header[b-04xu0mg9ah] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
}
.modal-header h2[b-04xu0mg9ah] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-close[b-04xu0mg9ah] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-04xu0mg9ah] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-04xu0mg9ah] { padding: 1rem 1.25rem; }
.modal-footer[b-04xu0mg9ah] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border);
}

.ps-recibo-info[b-04xu0mg9ah] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.6rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.6rem 0.8rem;
    margin-bottom: 0.5rem;
}
.ps-label[b-04xu0mg9ah] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted);
}
.ps-value[b-04xu0mg9ah] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}
.ps-cliente-info[b-04xu0mg9ah] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--rg-text-secondary);
    margin: 0.5rem 0 1rem;
}
.ps-acciones[b-04xu0mg9ah] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.ps-acciones .btn-crud[b-04xu0mg9ah] {
    width: 100%;
    justify-content: center;
}

.rg-slide-up[b-04xu0mg9ah] { animation: slideUp-b-04xu0mg9ah 0.3s ease-out; }

/* ── Chips distribución cascada ────────────────────────── */
.caja-chips[b-04xu0mg9ah] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.5rem 1rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
}
.caja-chip[b-04xu0mg9ah] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.22rem 0.6rem;
    border-radius: 1rem;
    font-size: 0.72rem;
    font-weight: 600;
    border: 1px solid transparent;
}
.chip-cuota[b-04xu0mg9ah] {
    background: rgba(37,99,235,0.1);
    color: var(--rg-accent);
    border-color: rgba(37,99,235,0.22);
}
[data-mode="dark"] .chip-cuota[b-04xu0mg9ah] { color: #93c5fd; }
.chip-mora[b-04xu0mg9ah] {
    background: rgba(217,119,6,0.1);
    color: #92400e;
    border-color: rgba(217,119,6,0.22);
}
[data-mode="dark"] .chip-mora[b-04xu0mg9ah] { color: #fcd34d; }
.chip-cargo[b-04xu0mg9ah] {
    background: rgba(100,116,139,0.1);
    color: var(--rg-text-secondary);
    border-color: var(--rg-border);
}
.caja-chip-sobrante[b-04xu0mg9ah] {
    color: var(--rg-text-muted);
    font-size: 0.78rem;
    margin-left: 0.2rem;
}

/* ── Proyección mora compacta ───────────────────────────── */
.caja-proj-grid[b-04xu0mg9ah] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
    padding: 0.65rem 1rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
    text-align: center;
}
.caja-proj[b-04xu0mg9ah] {
    padding: 0.45rem 0.5rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
}
.caja-proj-lbl[b-04xu0mg9ah] {
    font-size: 0.6rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}
.caja-proj-val[b-04xu0mg9ah] {
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-weight: 700;
    font-size: 0.82rem;
    color: #d97706;
    margin-top: 0.15rem;
}
[data-mode="dark"] .caja-proj-val[b-04xu0mg9ah] { color: #fcd34d; }

/* ── Modales base (backdrop + container sin anidamiento) ───── */
.modal-backdrop[b-04xu0mg9ah] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1050;
}
.modal-container[b-04xu0mg9ah] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1051; padding: 1rem; pointer-events: none;
}
.modal-dialog[b-04xu0mg9ah] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.modal-sm[b-04xu0mg9ah]  { max-width: 480px; }
.modal-lg[b-04xu0mg9ah]  { max-width: 860px; }

/* Modal QR → movido a EvidenciaPhotoSection.razor.css */
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_condonacion_bandeja.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_condonacion_bandeja
   ============================================================ */

.crud-container[b-q0n3yafmwf] { padding: 1.25rem; animation: slideUp-b-q0n3yafmwf 0.3s ease-out; }
@keyframes slideUp-b-q0n3yafmwf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-q0n3yafmwf] { animation: slideUp-b-q0n3yafmwf 0.3s ease-out; }

.crud-header[b-q0n3yafmwf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-q0n3yafmwf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-q0n3yafmwf] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-q0n3yafmwf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-q0n3yafmwf] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-q0n3yafmwf] { display: flex; gap: 0.5rem; }

.btn-crud[b-q0n3yafmwf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-q0n3yafmwf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-q0n3yafmwf] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-q0n3yafmwf] { filter: brightness(1.1); }
.btn-outline[b-q0n3yafmwf] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-q0n3yafmwf] { background: var(--rg-bg-hover); }

.btn-icon[b-q0n3yafmwf] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem;
    border: none; border-radius: 0.4rem;
    cursor: pointer; transition: all 0.15s;
    background: transparent;
}
.btn-edit[b-q0n3yafmwf] { color: var(--rg-accent); }
.btn-edit:hover[b-q0n3yafmwf] { background: rgba(99,102,241,0.1); }

.crud-alert[b-q0n3yafmwf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-q0n3yafmwf] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-q0n3yafmwf]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-q0n3yafmwf]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-q0n3yafmwf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-q0n3yafmwf] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-q0n3yafmwf]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-q0n3yafmwf]    { color: #93c5fd; }

.btn-text[b-q0n3yafmwf] { display: inline; }
@media (max-width: 768px) { .btn-text[b-q0n3yafmwf] { display: none; } }

/* Filtros */
.filtros-bar[b-q0n3yafmwf] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    flex-wrap: wrap;
}
.filtro-item[b-q0n3yafmwf] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-q0n3yafmwf] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.filtros-count[b-q0n3yafmwf] {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    font-variant-numeric: tabular-nums;
}

.form-input[b-q0n3yafmwf] {
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
}

/* Grid */
.crud-grid-wrapper[b-q0n3yafmwf] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 280px);
}
.crud-table[b-q0n3yafmwf] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-q0n3yafmwf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-q0n3yafmwf] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.crud-table th.text-right[b-q0n3yafmwf] { text-align: right; }
.crud-table td[b-q0n3yafmwf] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.crud-table td.text-right[b-q0n3yafmwf] { text-align: right; font-variant-numeric: tabular-nums; }
.row-clickable[b-q0n3yafmwf] { cursor: pointer; }
.row-clickable:hover td[b-q0n3yafmwf] { background: var(--rg-bg-hover); }
.col-actions[b-q0n3yafmwf] { width: 60px; text-align: center; }

.font-mono[b-q0n3yafmwf] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-q0n3yafmwf] { text-align: right; }

/* Badges de estado */
.badge[b-q0n3yafmwf] {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.65rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em;
    border: 1px solid;
}
.badge[b-q0n3yafmwf]::before {
    content: ''; width: 5px; height: 5px;
    border-radius: 50%; background: currentColor;
}
.badge-pendiente[b-q0n3yafmwf] { background: rgba(217,119,6,0.12);  color: #92400e; border-color: rgba(217,119,6,0.3); }
.badge-aprobada[b-q0n3yafmwf]  { background: rgba(22,163,74,0.12);  color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-rechazada[b-q0n3yafmwf] { background: rgba(220,38,38,0.12);  color: #991b1b; border-color: rgba(220,38,38,0.3); }
.badge-aplicada[b-q0n3yafmwf]  { background: rgba(37,99,235,0.12);  color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-vencida[b-q0n3yafmwf]   { background: var(--rg-bg-subtle);   color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-neutral[b-q0n3yafmwf]   { background: var(--rg-bg-subtle);   color: var(--rg-text-secondary); border-color: var(--rg-border); }

[data-mode="dark"] .badge-pendiente[b-q0n3yafmwf] { color: #fcd34d; }
[data-mode="dark"] .badge-aprobada[b-q0n3yafmwf]  { color: #86efac; }
[data-mode="dark"] .badge-rechazada[b-q0n3yafmwf] { color: #fca5a5; }
[data-mode="dark"] .badge-aplicada[b-q0n3yafmwf]  { color: #93c5fd; }

/* Estados */
.crud-loading[b-q0n3yafmwf], .crud-empty-state[b-q0n3yafmwf] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 3rem; gap: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-spinner[b-q0n3yafmwf] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: cb-spin-b-q0n3yafmwf 0.6s linear infinite;
}
@keyframes cb-spin-b-q0n3yafmwf { to { transform: rotate(360deg); } }
.spin[b-q0n3yafmwf] { animation: cb-spin-b-q0n3yafmwf 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_condonacion_detalle.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_condonacion_detalle — dos paneles cajero/supervisor
   ============================================================ */

.crud-container[b-qx8v54ka7z] { padding: 1.25rem; animation: slideUp-b-qx8v54ka7z 0.3s ease-out; }
@keyframes slideUp-b-qx8v54ka7z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-qx8v54ka7z] { animation: slideUp-b-qx8v54ka7z 0.3s ease-out; }

.crud-header[b-qx8v54ka7z] { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qx8v54ka7z] { display: flex; align-items: flex-start; gap: 0.75rem; }
.crud-header-icon[b-qx8v54ka7z] { font-size: 1.75rem; color: var(--rg-accent); margin-top: 0.25rem; }
.crud-title[b-qx8v54ka7z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-meta-row[b-qx8v54ka7z] {
    display: flex;
    gap: 1.25rem;
    margin-top: 0.4rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    flex-wrap: wrap;
}
.crud-meta-row b[b-qx8v54ka7z] { color: var(--rg-text-primary); font-weight: 600; margin-right: 0.3rem; }
.crud-header-actions[b-qx8v54ka7z] { display: flex; gap: 0.5rem; }

.btn-crud[b-qx8v54ka7z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.55rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-qx8v54ka7z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qx8v54ka7z] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-qx8v54ka7z] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-qx8v54ka7z] { background: var(--rg-bg-hover); }
.btn-success[b-qx8v54ka7z] { background: #16a34a; color: #fff; border-color: #16a34a; }
.btn-success:hover:not(:disabled)[b-qx8v54ka7z] { filter: brightness(1.1); }
.btn-danger[b-qx8v54ka7z] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-qx8v54ka7z] { background: rgba(220,38,38,0.1); }

.btn-text[b-qx8v54ka7z] { display: inline; }
@media (max-width: 768px) { .btn-text[b-qx8v54ka7z] { display: none; } }

.crud-alert[b-qx8v54ka7z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-qx8v54ka7z] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-qx8v54ka7z]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-qx8v54ka7z]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-qx8v54ka7z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-qx8v54ka7z] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-qx8v54ka7z]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-qx8v54ka7z]    { color: #93c5fd; }

/* Layout dos paneles */
.cond-grid[b-qx8v54ka7z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1rem;
}
@media (max-width: 992px) {
    .cond-grid[b-qx8v54ka7z] { grid-template-columns: 1fr; }
}

.cond-pane[b-qx8v54ka7z] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: border-color 0.15s;
}
.cond-pane.active[b-qx8v54ka7z] { border-color: var(--rg-accent); }

.cond-pane-head[b-qx8v54ka7z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.7rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.cond-pane.active .cond-pane-head[b-qx8v54ka7z] {
    background: rgba(99,102,241,0.06);
}
.cond-pane-title[b-qx8v54ka7z] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}
.cond-pane-body[b-qx8v54ka7z] { padding: 1rem; }

.role-pill[b-qx8v54ka7z] {
    font-size: 0.65rem;
    padding: 0.2rem 0.55rem;
    border-radius: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    border: 1px solid;
}
.role-cajero[b-qx8v54ka7z]     { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.role-supervisor[b-qx8v54ka7z] { background: rgba(217,119,6,0.12); color: #92400e; border-color: rgba(217,119,6,0.3); }
[data-mode="dark"] .role-cajero[b-qx8v54ka7z]     { color: #93c5fd; }
[data-mode="dark"] .role-supervisor[b-qx8v54ka7z] { color: #fcd34d; }

/* Tabla del detalle */
.form-label[b-qx8v54ka7z] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 0.4rem;
}

.cond-table[b-qx8v54ka7z] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    overflow: hidden;
}
.cond-table th[b-qx8v54ka7z] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.5rem 0.65rem;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--rg-border);
}
.cond-table th.text-right[b-qx8v54ka7z] { text-align: right; }
.cond-table td[b-qx8v54ka7z] {
    padding: 0.5rem 0.65rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.cond-table td.text-right[b-qx8v54ka7z] { text-align: right; font-variant-numeric: tabular-nums; }
.cond-table tbody tr:last-child td[b-qx8v54ka7z] { border-bottom: none; }

.cond-total-row td[b-qx8v54ka7z] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
}

.cond-cell-sub[b-qx8v54ka7z] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-top: 0.1rem;
}

.cond-input[b-qx8v54ka7z] {
    width: 100px;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    font-size: 0.85rem;
}
.cond-input:focus[b-qx8v54ka7z] { outline: none; border-color: var(--rg-accent); }

.cond-motivo[b-qx8v54ka7z] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.65rem 0.85rem;
    font-style: italic;
    color: var(--rg-text-primary);
    font-size: 0.85rem;
    line-height: 1.45;
}
.cond-meta[b-qx8v54ka7z] {
    margin-top: 0.5rem;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
}

.cond-textarea[b-qx8v54ka7z] {
    width: 100%;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    font-size: 0.85rem;
    font-family: inherit;
    resize: vertical;
    outline: none;
}
.cond-textarea:focus[b-qx8v54ka7z] { border-color: var(--rg-accent); }

.cond-buttons[b-qx8v54ka7z] {
    display: flex;
    gap: 0.5rem;
    margin-top: 1rem;
}
.cond-buttons .btn-crud[b-qx8v54ka7z] { flex: 1; justify-content: center; }
.cond-buttons .btn-success[b-qx8v54ka7z] { flex: 1.6; }

/* Resuelta (modo lectura) */
.cond-resolved-info[b-qx8v54ka7z] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.8rem;
}
.cond-resolved-row[b-qx8v54ka7z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.3rem 0;
    border-bottom: 1px dashed var(--rg-border);
    font-size: 0.85rem;
}
.cond-resolved-row:last-child[b-qx8v54ka7z] { border-bottom: none; }
.cond-label[b-qx8v54ka7z] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

/* Badges */
.badge[b-qx8v54ka7z] {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.65rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em;
    border: 1px solid;
}
.badge[b-qx8v54ka7z]::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.badge-pendiente[b-qx8v54ka7z] { background: rgba(217,119,6,0.12);  color: #92400e; border-color: rgba(217,119,6,0.3); }
.badge-aprobada[b-qx8v54ka7z]  { background: rgba(22,163,74,0.12);  color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-rechazada[b-qx8v54ka7z] { background: rgba(220,38,38,0.12);  color: #991b1b; border-color: rgba(220,38,38,0.3); }
.badge-aplicada[b-qx8v54ka7z]  { background: rgba(37,99,235,0.12);  color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-vencida[b-qx8v54ka7z]   { background: var(--rg-bg-subtle);   color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-neutral[b-qx8v54ka7z]   { background: var(--rg-bg-subtle);   color: var(--rg-text-secondary); border-color: var(--rg-border); }
[data-mode="dark"] .badge-pendiente[b-qx8v54ka7z] { color: #fcd34d; }
[data-mode="dark"] .badge-aprobada[b-qx8v54ka7z]  { color: #86efac; }
[data-mode="dark"] .badge-rechazada[b-qx8v54ka7z] { color: #fca5a5; }
[data-mode="dark"] .badge-aplicada[b-qx8v54ka7z]  { color: #93c5fd; }

.font-mono[b-qx8v54ka7z] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.78rem; }
.text-right[b-qx8v54ka7z] { text-align: right; }

.crud-loading[b-qx8v54ka7z], .crud-empty-state[b-qx8v54ka7z] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 3rem 1rem; gap: 0.75rem;
    color: var(--rg-text-muted);
    text-align: center;
}
.crud-spinner[b-qx8v54ka7z] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: cdg-spin-b-qx8v54ka7z 0.6s linear infinite;
}
@keyframes cdg-spin-b-qx8v54ka7z { to { transform: rotate(360deg); } }
.spin[b-qx8v54ka7z] { animation: cdg-spin-b-qx8v54ka7z 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_dashboard.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_dashboard — KPIs + 2 paneles + quick links
   ============================================================ */

.crud-container[b-c3pr3orsv8] { padding: 1.25rem; animation: slideUp-b-c3pr3orsv8 0.3s ease-out; }
@keyframes slideUp-b-c3pr3orsv8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-c3pr3orsv8] { animation: slideUp-b-c3pr3orsv8 0.3s ease-out; }

.crud-header[b-c3pr3orsv8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c3pr3orsv8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c3pr3orsv8] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-c3pr3orsv8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-c3pr3orsv8] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-c3pr3orsv8] { display: flex; gap: 0.5rem; }

.btn-crud[b-c3pr3orsv8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-c3pr3orsv8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c3pr3orsv8] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-c3pr3orsv8] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-c3pr3orsv8] { background: var(--rg-bg-hover); }

.btn-text[b-c3pr3orsv8] { display: inline; }
@media (max-width: 768px) { .btn-text[b-c3pr3orsv8] { display: none; } }

.btn-link[b-c3pr3orsv8] {
    background: none; border: none;
    color: var(--rg-accent);
    font-size: 0.78rem; font-weight: 600;
    cursor: pointer;
    padding: 0.25rem 0;
}
.btn-link:hover[b-c3pr3orsv8] { text-decoration: underline; }

/* Grid 2 columnas */
.dash-grid[b-c3pr3orsv8] {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}
@media (max-width: 992px) { .dash-grid[b-c3pr3orsv8] { grid-template-columns: 1fr; } }

.dash-panel[b-c3pr3orsv8] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
}
.dash-panel-head[b-c3pr3orsv8] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.7rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.dash-panel-head h3[b-c3pr3orsv8] {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex; align-items: center; gap: 0.5rem;
}
.dash-panel-body[b-c3pr3orsv8] { padding: 1rem; }

.dash-table[b-c3pr3orsv8] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.dash-table th[b-c3pr3orsv8] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600; text-align: left;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.dash-table th.text-right[b-c3pr3orsv8] { text-align: right; }
.dash-table td[b-c3pr3orsv8] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.dash-table td.text-right[b-c3pr3orsv8] { text-align: right; font-variant-numeric: tabular-nums; }
.dash-table tbody tr:last-child td[b-c3pr3orsv8] { border-bottom: none; }
.dash-table tbody tr:hover td[b-c3pr3orsv8] { background: var(--rg-bg-hover); }
.row-clickable[b-c3pr3orsv8] { cursor: pointer; }

.dash-state[b-c3pr3orsv8] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 2rem 1rem; gap: 0.75rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
    text-align: center;
}
.dash-state i[b-c3pr3orsv8] { font-size: 1.5rem; }

.crud-spinner[b-c3pr3orsv8] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: ds-spin-b-c3pr3orsv8 0.6s linear infinite;
}
@keyframes ds-spin-b-c3pr3orsv8 { to { transform: rotate(360deg); } }
.spin[b-c3pr3orsv8] { animation: ds-spin-b-c3pr3orsv8 0.8s linear infinite; display: inline-block; }

/* Quick links */
.dash-quick-links[b-c3pr3orsv8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}
@media (max-width: 768px) { .dash-quick-links[b-c3pr3orsv8] { grid-template-columns: 1fr; } }

.quick-link[b-c3pr3orsv8] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.25rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.15s;
    text-align: left;
}
.quick-link:hover[b-c3pr3orsv8] {
    border-color: var(--rg-accent);
    background: var(--rg-bg-hover);
    transform: translateY(-1px);
}
.quick-link i[b-c3pr3orsv8] {
    font-size: 1.5rem;
    color: var(--rg-accent);
    flex-shrink: 0;
}
.quick-link div[b-c3pr3orsv8] { display: flex; flex-direction: column; gap: 0.15rem; }
.quick-link strong[b-c3pr3orsv8] {
    color: var(--rg-text-primary);
    font-size: 0.9rem;
}
.quick-link span[b-c3pr3orsv8] {
    color: var(--rg-text-muted);
    font-size: 0.72rem;
}

/* Badges */
.badge[b-c3pr3orsv8] {
    display: inline-flex;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.65rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.05em;
}
.badge-metodo[b-c3pr3orsv8] {
    background: rgba(37,99,235,0.12);
    color: #1e40af;
    border: 1px solid rgba(37,99,235,0.3);
}
[data-mode="dark"] .badge-metodo[b-c3pr3orsv8] { color: #93c5fd; }

.font-mono[b-c3pr3orsv8] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-c3pr3orsv8] { text-align: right; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_estado_cuenta.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_estado_cuenta
   ============================================================ */

.crud-container[b-fcpmgvtb8y] { padding: 1.25rem; animation: slideUp-b-fcpmgvtb8y 0.3s ease-out; }
@keyframes slideUp-b-fcpmgvtb8y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-fcpmgvtb8y] { animation: slideUp-b-fcpmgvtb8y 0.3s ease-out; }

.crud-header[b-fcpmgvtb8y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fcpmgvtb8y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fcpmgvtb8y] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-fcpmgvtb8y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-fcpmgvtb8y] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-fcpmgvtb8y] { display: flex; gap: 0.5rem; }

.btn-crud[b-fcpmgvtb8y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-fcpmgvtb8y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fcpmgvtb8y] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-fcpmgvtb8y] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-fcpmgvtb8y] { background: var(--rg-bg-hover); }

.btn-text[b-fcpmgvtb8y] { display: inline; }
@media (max-width: 768px) { .btn-text[b-fcpmgvtb8y] { display: none; } }

.crud-alert[b-fcpmgvtb8y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.info[b-fcpmgvtb8y] { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-fcpmgvtb8y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.info[b-fcpmgvtb8y] { color: #93c5fd; }

/* Panel */
.ec-panel[b-fcpmgvtb8y] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 1.25rem;
}
.ec-panel-head[b-fcpmgvtb8y] {
    padding: 0.7rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.ec-panel-head h3[b-fcpmgvtb8y] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.ec-panel-body[b-fcpmgvtb8y] { padding: 0; }

.ec-table-wrapper[b-fcpmgvtb8y] {
    overflow: auto;
    max-height: 60vh;
}
.ec-table[b-fcpmgvtb8y] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}
.ec-table thead[b-fcpmgvtb8y] { position: sticky; top: 0; z-index: 1; }
.ec-table th[b-fcpmgvtb8y] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}
.ec-table th.text-right[b-fcpmgvtb8y] { text-align: right; }
.ec-table td[b-fcpmgvtb8y] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.ec-table td.text-right[b-fcpmgvtb8y] { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ec-table tbody tr:hover td[b-fcpmgvtb8y] { background: var(--rg-bg-hover); }
.ec-table tbody tr:last-child td[b-fcpmgvtb8y] { border-bottom: none; }

/* Badges */
.badge[b-fcpmgvtb8y] {
    display: inline-flex; align-items: center; gap: 0.25rem;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.65rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em;
    border: 1px solid;
}
.badge[b-fcpmgvtb8y]::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.badge-pagada[b-fcpmgvtb8y]   { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-vigente[b-fcpmgvtb8y]  { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-atrasada[b-fcpmgvtb8y] { background: rgba(220,38,38,0.12); color: #991b1b; border-color: rgba(220,38,38,0.3); }
[data-mode="dark"] .badge-pagada[b-fcpmgvtb8y]   { color: #86efac; }
[data-mode="dark"] .badge-vigente[b-fcpmgvtb8y]  { color: #93c5fd; }
[data-mode="dark"] .badge-atrasada[b-fcpmgvtb8y] { color: #fca5a5; }

.font-mono[b-fcpmgvtb8y] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-fcpmgvtb8y] { text-align: right; }

/* States */
.crud-empty-state[b-fcpmgvtb8y], .crud-loading[b-fcpmgvtb8y] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 4rem 1rem; gap: 1rem;
    text-align: center;
    color: var(--rg-text-muted);
}
.crud-empty-state i[b-fcpmgvtb8y] { font-size: 2.5rem; color: var(--rg-text-muted); }
.crud-empty-state h3[b-fcpmgvtb8y] { color: var(--rg-text-primary); font-size: 1.05rem; margin: 0; }
.crud-empty-state p[b-fcpmgvtb8y] { margin: 0; max-width: 24rem; font-size: 0.85rem; }
.crud-spinner[b-fcpmgvtb8y] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: ec-spin-b-fcpmgvtb8y 0.6s linear infinite;
}
@keyframes ec-spin-b-fcpmgvtb8y { to { transform: rotate(360deg); } }
.spin[b-fcpmgvtb8y] { animation: ec-spin-b-fcpmgvtb8y 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_feriados.razor.rz.scp.css */
/* Reutilizado para Feriados, Vacaciones, Plantillas, Bandeja Notif y Reglas */

.crud-container[b-la7ggbcjwx] { padding: 1.25rem; animation: slideUp-b-la7ggbcjwx 0.3s ease-out; }
@keyframes slideUp-b-la7ggbcjwx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-la7ggbcjwx] { animation: slideUp-b-la7ggbcjwx 0.3s ease-out; }

.crud-header[b-la7ggbcjwx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-la7ggbcjwx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-la7ggbcjwx] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-la7ggbcjwx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-la7ggbcjwx] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-la7ggbcjwx] { display: flex; gap: 0.5rem; }

.btn-crud[b-la7ggbcjwx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-la7ggbcjwx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-la7ggbcjwx] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-la7ggbcjwx] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-la7ggbcjwx] { background: var(--rg-bg-hover); }
.btn-danger[b-la7ggbcjwx] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-la7ggbcjwx] { background: rgba(220,38,38,0.1); }

.btn-icon[b-la7ggbcjwx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-la7ggbcjwx] { color: var(--rg-accent); }
.btn-edit:hover[b-la7ggbcjwx] { background: rgba(99,102,241,0.1); }
.btn-delete[b-la7ggbcjwx] { color: #dc2626; }
.btn-delete:hover[b-la7ggbcjwx] { background: rgba(220,38,38,0.1); }

.btn-text[b-la7ggbcjwx] { display: inline; }
@media (max-width: 768px) { .btn-text[b-la7ggbcjwx] { display: none; } }

.crud-alert[b-la7ggbcjwx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-la7ggbcjwx] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-la7ggbcjwx]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-la7ggbcjwx]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-la7ggbcjwx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-la7ggbcjwx] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-la7ggbcjwx]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-la7ggbcjwx]    { color: #93c5fd; }

.crud-grid-wrapper[b-la7ggbcjwx] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-la7ggbcjwx] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-la7ggbcjwx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-la7ggbcjwx] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table td[b-la7ggbcjwx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-la7ggbcjwx] { background: var(--rg-bg-hover); }
.col-actions[b-la7ggbcjwx] { width: 80px; text-align: center; }

.font-mono[b-la7ggbcjwx] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-la7ggbcjwx] { text-align: right; }

.badge[b-la7ggbcjwx] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge-yes[b-la7ggbcjwx] { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-la7ggbcjwx]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
[data-mode="dark"] .badge-yes[b-la7ggbcjwx] { color: #86efac; }

.crud-loading[b-la7ggbcjwx], .crud-empty-state[b-la7ggbcjwx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-la7ggbcjwx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: cf-spin-b-la7ggbcjwx 0.6s linear infinite; }
@keyframes cf-spin-b-la7ggbcjwx { to { transform: rotate(360deg); } }
.spin[b-la7ggbcjwx] { animation: cf-spin-b-la7ggbcjwx 0.8s linear infinite; display: inline-block; }

/* Modal base */
.modal-backdrop[b-la7ggbcjwx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-la7ggbcjwx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-la7ggbcjwx] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-la7ggbcjwx] { max-width: 460px; }
.modal-lg[b-la7ggbcjwx] { max-width: 800px; }
.modal-header[b-la7ggbcjwx] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-la7ggbcjwx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-la7ggbcjwx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-la7ggbcjwx] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-la7ggbcjwx] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-footer[b-la7ggbcjwx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }

.form-row[b-la7ggbcjwx] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-la7ggbcjwx] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-la7ggbcjwx] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-input[b-la7ggbcjwx], select.form-input[b-la7ggbcjwx], textarea.form-input[b-la7ggbcjwx] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; font-family: inherit; }
.form-input:focus[b-la7ggbcjwx] { border-color: var(--rg-accent); }
textarea.form-input[b-la7ggbcjwx] { resize: vertical; min-height: 120px; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_notif_bandeja.razor.rz.scp.css */
/* Bandeja de notificaciones */
.crud-container[b-v0s304bw1u] { padding: 1.25rem; animation: slideUp-b-v0s304bw1u 0.3s ease-out; }
@keyframes slideUp-b-v0s304bw1u { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-v0s304bw1u] { animation: slideUp-b-v0s304bw1u 0.3s ease-out; }

.crud-header[b-v0s304bw1u] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-v0s304bw1u] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-v0s304bw1u] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-v0s304bw1u] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-v0s304bw1u] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-v0s304bw1u] { display: flex; gap: 0.5rem; }

.btn-crud[b-v0s304bw1u] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-v0s304bw1u] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-v0s304bw1u] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-v0s304bw1u] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-v0s304bw1u] { background: var(--rg-bg-hover); }

.btn-icon[b-v0s304bw1u] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-approve[b-v0s304bw1u] { color: #16a34a; }
.btn-approve:hover[b-v0s304bw1u] { background: rgba(22,163,74,0.1); }
.btn-delete[b-v0s304bw1u] { color: #dc2626; }
.btn-delete:hover[b-v0s304bw1u] { background: rgba(220,38,38,0.1); }
.btn-view[b-v0s304bw1u] { color: var(--rg-text-secondary); }
.btn-view:hover[b-v0s304bw1u] { background: var(--rg-bg-hover); }

.btn-text[b-v0s304bw1u] { display: inline; }
@media (max-width: 768px) { .btn-text[b-v0s304bw1u] { display: none; } }

.crud-alert[b-v0s304bw1u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-v0s304bw1u] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-v0s304bw1u]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-v0s304bw1u] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-v0s304bw1u] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-v0s304bw1u]   { color: #fca5a5; }

.filtros-bar[b-v0s304bw1u] { display: flex; align-items: flex-end; gap: 0.6rem; padding: 0.75rem; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; flex-wrap: wrap; }
.filtro-item[b-v0s304bw1u] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-v0s304bw1u] { font-size: 0.65rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.filtros-count[b-v0s304bw1u] { margin-left: auto; font-size: 0.78rem; color: var(--rg-text-muted); font-variant-numeric: tabular-nums; }
.form-input[b-v0s304bw1u] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }

.crud-grid-wrapper[b-v0s304bw1u] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-v0s304bw1u] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-v0s304bw1u] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-v0s304bw1u] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table th.text-right[b-v0s304bw1u] { text-align: right; }
.crud-table td[b-v0s304bw1u] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table td.text-right[b-v0s304bw1u] { text-align: right; font-variant-numeric: tabular-nums; }
.crud-table tbody tr:hover[b-v0s304bw1u] { background: var(--rg-bg-hover); }
.crud-table tbody tr.row-selected td[b-v0s304bw1u] { background: rgba(99,102,241,0.08); }
.col-actions[b-v0s304bw1u] { width: 80px; text-align: center; }

.font-mono[b-v0s304bw1u] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.74rem; }
.text-right[b-v0s304bw1u] { text-align: right; }

.badge[b-v0s304bw1u] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.55rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge[b-v0s304bw1u]::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.badge-pendiente[b-v0s304bw1u] { background: rgba(217,119,6,0.12);  color: #92400e; border-color: rgba(217,119,6,0.3); }
.badge-aprobada[b-v0s304bw1u]  { background: rgba(37,99,235,0.12);  color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-yes[b-v0s304bw1u]       { background: rgba(22,163,74,0.12);  color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-rechazada[b-v0s304bw1u] { background: rgba(220,38,38,0.12);  color: #991b1b; border-color: rgba(220,38,38,0.3); }
.badge-no[b-v0s304bw1u]        { background: var(--rg-bg-subtle);   color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-canal[b-v0s304bw1u]     { background: rgba(99,102,241,0.12); color: #4f46e5; border-color: rgba(99,102,241,0.3); }
[data-mode="dark"] .badge-pendiente[b-v0s304bw1u] { color: #fcd34d; }
[data-mode="dark"] .badge-aprobada[b-v0s304bw1u]  { color: #93c5fd; }
[data-mode="dark"] .badge-yes[b-v0s304bw1u]       { color: #86efac; }
[data-mode="dark"] .badge-rechazada[b-v0s304bw1u] { color: #fca5a5; }
[data-mode="dark"] .badge-canal[b-v0s304bw1u]     { color: #a5b4fc; }

.crud-loading[b-v0s304bw1u], .crud-empty-state[b-v0s304bw1u] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-v0s304bw1u] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: nb-spin-b-v0s304bw1u 0.6s linear infinite; }
@keyframes nb-spin-b-v0s304bw1u { to { transform: rotate(360deg); } }
.spin[b-v0s304bw1u] { animation: nb-spin-b-v0s304bw1u 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_plantillas.razor.rz.scp.css */
/* Hereda patrón CRUD + ajustes específicos plantillas */
.crud-container[b-7wyj998i3e] { padding: 1.25rem; animation: slideUp-b-7wyj998i3e 0.3s ease-out; }
@keyframes slideUp-b-7wyj998i3e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-7wyj998i3e] { animation: slideUp-b-7wyj998i3e 0.3s ease-out; }

.crud-header[b-7wyj998i3e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7wyj998i3e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7wyj998i3e] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-7wyj998i3e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-7wyj998i3e] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-7wyj998i3e] { display: flex; gap: 0.5rem; }

.btn-crud[b-7wyj998i3e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-7wyj998i3e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7wyj998i3e] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-7wyj998i3e] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-7wyj998i3e] { background: var(--rg-bg-hover); }
.btn-danger[b-7wyj998i3e] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-7wyj998i3e] { background: rgba(220,38,38,0.1); }

.btn-icon[b-7wyj998i3e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7wyj998i3e] { color: var(--rg-accent); }
.btn-edit:hover[b-7wyj998i3e] { background: rgba(99,102,241,0.1); }
.btn-delete[b-7wyj998i3e] { color: #dc2626; }
.btn-delete:hover[b-7wyj998i3e] { background: rgba(220,38,38,0.1); }

.btn-text[b-7wyj998i3e] { display: inline; }
@media (max-width: 768px) { .btn-text[b-7wyj998i3e] { display: none; } }

.crud-alert[b-7wyj998i3e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-7wyj998i3e] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-7wyj998i3e]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-7wyj998i3e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-7wyj998i3e] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-7wyj998i3e]   { color: #fca5a5; }

.crud-search-bar[b-7wyj998i3e] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-input); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.25rem 0.5rem; }
.crud-search-bar input[b-7wyj998i3e] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.85rem; padding: 0.4rem 0.25rem; outline: none; }
.crud-search-btn[b-7wyj998i3e] { background: transparent; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.35rem 0.5rem; border-radius: 0.25rem; font-size: 0.9rem; }
.crud-search-btn:hover[b-7wyj998i3e] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.crud-count[b-7wyj998i3e] { font-size: 0.7rem; color: var(--rg-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; margin-left: 0.5rem; }

.crud-grid-wrapper[b-7wyj998i3e] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-7wyj998i3e] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-7wyj998i3e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7wyj998i3e] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table td[b-7wyj998i3e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-7wyj998i3e] { background: var(--rg-bg-hover); }
.col-actions[b-7wyj998i3e] { width: 80px; text-align: center; }

.font-mono[b-7wyj998i3e] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.badge[b-7wyj998i3e] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge-yes[b-7wyj998i3e] { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-7wyj998i3e]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-tipo[b-7wyj998i3e] { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
[data-mode="dark"] .badge-yes[b-7wyj998i3e]  { color: #86efac; }
[data-mode="dark"] .badge-tipo[b-7wyj998i3e] { color: #93c5fd; }

.crud-loading[b-7wyj998i3e], .crud-empty-state[b-7wyj998i3e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-7wyj998i3e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: pl-spin-b-7wyj998i3e 0.6s linear infinite; }
@keyframes pl-spin-b-7wyj998i3e { to { transform: rotate(360deg); } }
.spin[b-7wyj998i3e] { animation: pl-spin-b-7wyj998i3e 0.8s linear infinite; display: inline-block; }

.modal-backdrop[b-7wyj998i3e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-7wyj998i3e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-7wyj998i3e] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 92vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-7wyj998i3e] { max-width: 480px; }
.modal-lg[b-7wyj998i3e] { max-width: 800px; }
.modal-xl[b-7wyj998i3e] { max-width: 1100px; }
.modal-header[b-7wyj998i3e] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-7wyj998i3e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7wyj998i3e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-7wyj998i3e] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-7wyj998i3e] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-footer[b-7wyj998i3e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }

.form-row[b-7wyj998i3e] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-7wyj998i3e] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-7wyj998i3e] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-input[b-7wyj998i3e], select.form-input[b-7wyj998i3e], textarea.form-input[b-7wyj998i3e] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; font-family: inherit; }
.form-input:focus[b-7wyj998i3e] { border-color: var(--rg-accent); }
textarea.form-input[b-7wyj998i3e] { resize: vertical; font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.8rem; }

.placeholder-hint[b-7wyj998i3e] {
    padding: 0.6rem 0.85rem;
    background: rgba(37,99,235,0.08);
    border: 1px solid rgba(37,99,235,0.3);
    border-radius: 0.4rem;
    font-size: 0.78rem;
    color: #1e40af;
    line-height: 1.6;
}
.placeholder-hint code[b-7wyj998i3e] {
    background: var(--rg-bg-card);
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
    font-size: 0.72rem;
    color: var(--rg-text-primary);
    margin: 0 0.15rem;
}
[data-mode="dark"] .placeholder-hint[b-7wyj998i3e] { color: #93c5fd; }

/* ── Tabs Editor / HTML / Preview ─────────────────────────── */
.rg-tabs[b-7wyj998i3e] {
    display: flex;
    gap: 0.1rem;
    border-bottom: 1px solid var(--rg-border);
    margin-top: 0.5rem;
}
.rg-tab[b-7wyj998i3e] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 1rem;
    background: transparent;
    color: var(--rg-text-muted);
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 600;
    transition: all 0.15s;
}
.rg-tab:hover[b-7wyj998i3e] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.rg-tab.active[b-7wyj998i3e] {
    color: var(--rg-accent);
    border-bottom-color: var(--rg-accent);
}

.rg-tab-content[b-7wyj998i3e] { padding-top: 0.85rem; min-height: 360px; }

/* HTML mode */
.rg-html-source[b-7wyj998i3e] {
    font-family: 'Cascadia Code','Fira Code',monospace !important;
    font-size: 0.78rem !important;
    min-height: 320px;
}
.rg-html-hint[b-7wyj998i3e] {
    margin-top: 0.5rem;
    padding: 0.45rem 0.65rem;
    background: rgba(217,119,6,0.08);
    border: 1px solid rgba(217,119,6,0.3);
    border-radius: 0.4rem;
    font-size: 0.72rem;
    color: #92400e;
    display: flex; align-items: center; gap: 0.4rem;
}
[data-mode="dark"] .rg-html-hint[b-7wyj998i3e] { color: #fcd34d; }

/* Preview */
.rg-preview-toolbar[b-7wyj998i3e] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.5rem 0.85rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem 0.4rem 0 0;
    border-bottom: none;
    font-size: 0.74rem;
}
.rg-preview-lbl[b-7wyj998i3e] {
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    font-size: 0.65rem;
}
.rg-preview-sample[b-7wyj998i3e] { color: var(--rg-text-secondary); }
.rg-preview-frame[b-7wyj998i3e] {
    background: #ffffff;
    color: #1e293b;
    border: 1px solid var(--rg-border);
    border-top: none;
    border-radius: 0 0 0.4rem 0.4rem;
    padding: 1.5rem 2rem;
    min-height: 280px;
    font-family: 'Segoe UI', system-ui, sans-serif;
    font-size: 0.9rem;
    line-height: 1.6;
    overflow: auto;
    max-height: 50vh;
}
[data-mode="dark"] .rg-preview-frame[b-7wyj998i3e] {
    background: #f8fafc;
    color: #0f172a;
}
.rg-preview-asunto[b-7wyj998i3e] {
    margin-bottom: 1rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.95rem;
}
.rg-preview-label-mini[b-7wyj998i3e] {
    display: block;
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    font-weight: 700;
    margin-bottom: 0.2rem;
}
.rg-preview-body :first-child[b-7wyj998i3e] { margin-top: 0; }
.rg-preview-body :last-child[b-7wyj998i3e] { margin-bottom: 0; }
.rg-preview-empty[b-7wyj998i3e] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 0.5rem; padding: 3rem 1rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-input);
    border: 1px dashed var(--rg-border);
    border-radius: 0.4rem;
    text-align: center;
}
.rg-preview-empty i[b-7wyj998i3e] { font-size: 2rem; }

.rg-hint-mini[b-7wyj998i3e] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
    margin-left: 0.5rem;
}

/* ── Sección BoardDataSource ──────────────────────────────── */
.pl-board-section[b-7wyj998i3e] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.pl-board-header[b-7wyj998i3e] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}

.pl-board-icon[b-7wyj998i3e] {
    color: var(--rg-accent);
    font-size: 1.1rem;
    margin-top: 0.1rem;
    flex-shrink: 0;
}

.pl-board-title[b-7wyj998i3e] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-secondary);
    display: block;
}

.pl-board-hint[b-7wyj998i3e] {
    font-size: 0.74rem;
    color: var(--rg-text-muted);
    display: block;
    margin-top: 0.15rem;
}

.pl-chips-label[b-7wyj998i3e] {
    font-size: 0.7rem;
    color: var(--rg-text-secondary);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.25rem;
}

.pl-chips[b-7wyj998i3e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.pl-chip[b-7wyj998i3e] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    background: rgba(37,99,235,0.1);
    color: var(--rg-accent);
    border: 1px solid rgba(37,99,235,0.3);
    border-radius: 1rem;
    font-size: 0.72rem;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.pl-chip:hover[b-7wyj998i3e] {
    background: rgba(37,99,235,0.2);
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

[data-mode="dark"] .pl-chip[b-7wyj998i3e] {
    color: #93c5fd;
    border-color: rgba(147,197,253,0.35);
    background: rgba(147,197,253,0.1);
}

.pl-chips-note[b-7wyj998i3e] {
    font-size: 0.71rem;
    color: var(--rg-text-muted);
    display: flex;
    align-items: flex-start;
    gap: 0.35rem;
    background: rgba(37,99,235,0.05);
    border-radius: 0.4rem;
    padding: 0.4rem 0.6rem;
    line-height: 1.5;
}

.pl-loading-sources[b-7wyj998i3e] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
}

.pl-loading-sources .crud-spinner[b-7wyj998i3e] {
    width: 1rem;
    height: 1rem;
    border-width: 2px;
}

/* ── Preview multi-fila datasource ───────────────────────── */
.rg-preview-ds-header[b-7wyj998i3e] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(37,99,235,0.07);
    border: 1px solid rgba(37,99,235,0.2);
    border-radius: 0.5rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    margin-bottom: 0.75rem;
}

.rg-preview-ds-header i[b-7wyj998i3e] { color: var(--rg-accent); }
.rg-preview-ds-header .btn-crud[b-7wyj998i3e] { margin-left: auto; padding: 0.2rem 0.5rem; }

.rg-preview-record[b-7wyj998i3e] {
    margin-bottom: 1.25rem;
    position: relative;
}

.rg-preview-record-badge[b-7wyj998i3e] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.6rem;
    background: var(--rg-accent);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 0.3rem 0.3rem 0 0;
    margin-bottom: -1px;
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_realizados.razor.rz.scp.css */
/* ============================================================
   Frmclg_cobros_realizados — estilos CRUD + filtros + cuadre
   ============================================================ */

.crud-container[b-oi06pn6dux] { padding: 1.25rem; animation: slideUp-b-oi06pn6dux 0.3s ease-out; }
@keyframes slideUp-b-oi06pn6dux { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-oi06pn6dux] { animation: slideUp-b-oi06pn6dux 0.3s ease-out; }

.crud-header[b-oi06pn6dux] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-oi06pn6dux] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-oi06pn6dux] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-oi06pn6dux] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-oi06pn6dux] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-oi06pn6dux] { display: flex; gap: 0.5rem; }

.btn-crud[b-oi06pn6dux] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-oi06pn6dux] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-oi06pn6dux] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-oi06pn6dux] { filter: brightness(1.1); }
.btn-outline[b-oi06pn6dux] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-oi06pn6dux] { background: var(--rg-bg-hover); }

.btn-icon[b-oi06pn6dux] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem;
    border: none; border-radius: 0.4rem;
    cursor: pointer; transition: all 0.15s;
    background: transparent;
}
.btn-view[b-oi06pn6dux] { color: #dc2626; }
.btn-view:hover[b-oi06pn6dux] { background: rgba(220,38,38,0.1); }

.crud-alert[b-oi06pn6dux] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-oi06pn6dux] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-oi06pn6dux]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-oi06pn6dux]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-oi06pn6dux] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-oi06pn6dux] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-oi06pn6dux]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-oi06pn6dux]    { color: #93c5fd; }

/* Filtros */
.filtros-bar[b-oi06pn6dux] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    flex-wrap: wrap;
}
.filtro-item[b-oi06pn6dux] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-oi06pn6dux] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.filtros-count[b-oi06pn6dux] {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    font-variant-numeric: tabular-nums;
}

.form-input[b-oi06pn6dux] {
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    transition: border-color 0.15s;
}
.form-input:focus[b-oi06pn6dux] { border-color: var(--rg-accent); }

.btn-text[b-oi06pn6dux] { display: inline; }
@media (max-width: 768px) { .btn-text[b-oi06pn6dux] { display: none; } }

/* Grid */
.crud-grid-wrapper[b-oi06pn6dux] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 420px);
    margin-bottom: 1.25rem;
}
.crud-table[b-oi06pn6dux] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-oi06pn6dux] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-oi06pn6dux] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.crud-table th.text-right[b-oi06pn6dux] { text-align: right; }
.crud-table td[b-oi06pn6dux] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.crud-table td.text-right[b-oi06pn6dux] { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.crud-table tbody tr:hover[b-oi06pn6dux] { background: var(--rg-bg-hover); }
.col-actions[b-oi06pn6dux] { width: 60px; text-align: center; }

.font-mono[b-oi06pn6dux] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-oi06pn6dux] { text-align: right; }

/* Badges */
.badge[b-oi06pn6dux] {
    display: inline-flex; align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.65rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em;
}
.badge-metodo[b-oi06pn6dux] {
    background: rgba(37,99,235,0.12);
    color: #1e40af;
    border: 1px solid rgba(37,99,235,0.3);
}
[data-mode="dark"] .badge-metodo[b-oi06pn6dux] { color: #93c5fd; }
.badge-suffix[b-oi06pn6dux] { font-size: 0.7rem; color: var(--rg-text-muted); margin-left: 0.25rem; }

/* Estados */
.crud-loading[b-oi06pn6dux], .crud-empty-state[b-oi06pn6dux] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 3rem; gap: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-spinner[b-oi06pn6dux] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: cr-spin-b-oi06pn6dux 0.6s linear infinite;
}
@keyframes cr-spin-b-oi06pn6dux { to { transform: rotate(360deg); } }
.spin[b-oi06pn6dux] { animation: cr-spin-b-oi06pn6dux 0.8s linear infinite; display: inline-block; }

/* Cuadre */
.cuadre-panel[b-oi06pn6dux] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: clip; /* clip (no scroll) — preserva border-radius sin bloquear scroll interno */
}
.cuadre-head[b-oi06pn6dux] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.cuadre-head h3[b-oi06pn6dux] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cuadre-hint[b-oi06pn6dux] {
    font-size: 0.8rem;
    color: var(--rg-text-secondary);
    font-variant-numeric: tabular-nums;
}
.cuadre-scroll[b-oi06pn6dux] { overflow-x: auto; width: 100%; }
.cuadre-scroll .cuadre-table[b-oi06pn6dux] { min-width: 100%; }
.cuadre-table[b-oi06pn6dux] { border: none; white-space: nowrap; }
.cuadre-table th[b-oi06pn6dux], .cuadre-table td[b-oi06pn6dux] { border-bottom: 1px solid var(--rg-border); }
.cuadre-table tbody tr:last-child td[b-oi06pn6dux] { border-bottom: none; background: var(--rg-bg-subtle); font-weight: 600; }

/* Botón de envío por fila */
.btn-send[b-oi06pn6dux] { color: var(--rg-primary); }
.btn-send:hover[b-oi06pn6dux] { background: rgba(37,99,235,0.1); }

/* Botón de codificación contable — verde (mejor contraste sobre el fondo) */
.btn-codif[b-oi06pn6dux] { color: #16a34a; }
.btn-codif:hover[b-oi06pn6dux] { background: rgba(22,163,74,0.12); }
[data-mode="dark"] .btn-codif[b-oi06pn6dux] { color: #4ade80; }
[data-mode="dark"] .btn-codif:hover[b-oi06pn6dux] { background: rgba(22,163,74,0.18); }

/* ── Modales de envío ──────────────────────────────── */
.cr-backdrop[b-oi06pn6dux] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
}
.cr-container[b-oi06pn6dux] {
    position: fixed; inset: 0;
    z-index: 1001;
    display: flex; align-items: center; justify-content: center;
    padding: 1rem;
}
.cr-dialog[b-oi06pn6dux] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    display: flex; flex-direction: column;
    max-height: 90vh;
    width: 100%;
    overflow: hidden;
}
.cr-sm[b-oi06pn6dux] { max-width: 400px; }
.cr-header[b-oi06pn6dux] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}
.cr-header h2[b-oi06pn6dux] {
    margin: 0; font-size: 0.95rem; font-weight: 700;
    color: var(--rg-text-primary);
    display: flex; align-items: center; gap: 0.5rem;
}
.cr-close[b-oi06pn6dux] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted); font-size: 0.85rem;
    width: 1.75rem; height: 1.75rem;
    display: flex; align-items: center; justify-content: center;
    border-radius: 0.35rem; transition: all 0.15s;
}
.cr-close:hover[b-oi06pn6dux] { background: var(--rg-bg-hover); color: var(--rg-danger); }
.cr-body[b-oi06pn6dux] {
    padding: 1.25rem;
    flex: 1; overflow-y: auto;
}
.cr-footer[b-oi06pn6dux] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border);
}
.cr-form-group[b-oi06pn6dux] {
    display: flex; flex-direction: column; gap: 0.3rem;
    margin-bottom: 0.85rem;
}
.cr-form-group label[b-oi06pn6dux] {
    font-size: 0.72rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em;
    color: var(--rg-text-secondary);
    display: flex; align-items: center; gap: 0.3rem;
}
.cr-input[b-oi06pn6dux] {
    padding: 0.45rem 0.65rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.85rem;
    transition: border-color 0.15s;
}
.cr-input:focus[b-oi06pn6dux] { outline: none; border-color: var(--rg-primary); }
.cr-hint[b-oi06pn6dux] {
    font-size: 0.82rem; color: var(--rg-text-secondary);
    margin-bottom: 1rem;
    padding: 0.6rem 0.75rem;
    background: var(--rg-bg-subtle);
    border-radius: 0.4rem;
    border: 1px solid var(--rg-border);
}

/* ── Acordeón NCF ──────────────────────────────────────── */
.ncf-accordion[b-oi06pn6dux] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.ncf-group[b-oi06pn6dux] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--rg-bg-card);
}

.ncf-group-header[b-oi06pn6dux] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.65rem 1rem;
    background: var(--rg-bg-subtle);
    cursor: pointer;
    user-select: none;
    transition: background 0.15s;
    gap: 0.75rem;
    flex-wrap: wrap;
}
.ncf-group-header:hover[b-oi06pn6dux] { background: var(--rg-bg-hover); }

.ncf-group-left[b-oi06pn6dux] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.ncf-chevron[b-oi06pn6dux] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    transition: transform 0.2s;
    width: 0.8rem;
}

.ncf-tipo-badge[b-oi06pn6dux] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    background: rgba(37,99,235,0.12);
    color: #1e40af;
    border: 1px solid rgba(37,99,235,0.3);
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    font-family: 'Cascadia Code','Fira Code',monospace;
    letter-spacing: 0.03em;
}
[data-mode="dark"] .ncf-tipo-badge[b-oi06pn6dux] { color: #93c5fd; }

.ncf-tipo-label[b-oi06pn6dux] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary);
}

.ncf-group-right[b-oi06pn6dux] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-left: auto;
}

.ncf-group-count[b-oi06pn6dux] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
}

.ncf-group-total[b-oi06pn6dux] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
}

.ncf-group-body[b-oi06pn6dux] {
    border-top: 1px solid var(--rg-border);
    overflow-x: auto;
}

/* Badge tipo documento (RC / NC) */
.tipo-doc-badge[b-oi06pn6dux] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 0.3rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    font-family: 'Cascadia Code','Fira Code',monospace;
    border: 1px solid transparent;
}
.tipo-doc-badge.tipo-rc[b-oi06pn6dux] {
    background: rgba(37,99,235,0.12);
    color: #1d4ed8;
    border-color: rgba(37,99,235,0.3);
}
.tipo-doc-badge.tipo-nc[b-oi06pn6dux] {
    background: rgba(22,163,74,0.12);
    color: #15803d;
    border-color: rgba(22,163,74,0.3);
}
[data-mode="dark"] .tipo-doc-badge.tipo-rc[b-oi06pn6dux] { color: #93c5fd; }
[data-mode="dark"] .tipo-doc-badge.tipo-nc[b-oi06pn6dux] { color: #86efac; }

/* Grid de 3 cuadres (método · NCF · tipo doc) */
.cuadres-grid[b-oi06pn6dux] {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1.2fr;
    gap: 1rem;
    margin-top: 1rem;
}
@media (max-width: 1200px) {
    .cuadres-grid[b-oi06pn6dux] { grid-template-columns: 1fr; }
}
.cuadres-grid .cuadre-panel[b-oi06pn6dux] { margin-top: 0; }
.cuadres-grid .cuadre-table th[b-oi06pn6dux],
.cuadres-grid .cuadre-table td[b-oi06pn6dux] { font-size: 0.78rem; padding: 0.35rem 0.5rem; }
.cuadres-grid .ncf-label-cell[b-oi06pn6dux] {
    font-size: 0.75rem;
    color: var(--rg-text-secondary);
}

/* Override: 4 columnas para el grid cuando se agrega cuadre de marca */
.cuadres-grid[b-oi06pn6dux] {
    grid-template-columns: 1fr 1.3fr 1.2fr 1.1fr;
}
@media (max-width: 1500px) {
    .cuadres-grid[b-oi06pn6dux] { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .cuadres-grid[b-oi06pn6dux] { grid-template-columns: 1fr; }
}

/* Badge marca de tarjeta */
.marca-badge[b-oi06pn6dux] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.15rem 0.55rem;
    border-radius: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    background: rgba(168,85,247,0.12);
    color: #7e22ce;
    border: 1px solid rgba(168,85,247,0.3);
}
[data-mode="dark"] .marca-badge[b-oi06pn6dux] { color: #d8b4fe; }
.marca-badge i[b-oi06pn6dux] { font-size: 0.85rem; }

/* Estado vacío del cuadre de marcas */
.cuadre-empty[b-oi06pn6dux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1.5rem 1rem;
    color: var(--rg-text-muted);
    font-size: 0.82rem;
}
.cuadre-empty i[b-oi06pn6dux] { font-size: 1.6rem; opacity: 0.4; }

.cr-help[b-oi06pn6dux] {
    display: block;
    margin-top: 0.2rem;
    color: var(--rg-text-muted);
    font-size: 0.7rem;
    font-style: italic;
}

/* ── Selector de vista (Agrupado · Grid · Tarjetas) ─────────────── */
.view-toggle[b-oi06pn6dux] {
    display: inline-flex;
    gap: 0.25rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.55rem;
    padding: 0.2rem;
    margin-bottom: 0.9rem;
}
.vt-btn[b-oi06pn6dux] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--rg-text-secondary);
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.4rem 0.8rem;
    border-radius: 0.4rem;
    transition: all 0.15s;
}
.vt-btn:hover[b-oi06pn6dux] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.vt-btn.active[b-oi06pn6dux] {
    background: var(--rg-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(26,58,92,0.25);
}
.vt-btn i[b-oi06pn6dux] { font-size: 0.95rem; }
@media (max-width: 640px) { .vt-btn span[b-oi06pn6dux] { display: none; } }

/* ── Vista TARJETAS ─────────────────────────────────────────────── */
.cobros-cards[b-oi06pn6dux] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 0.85rem;
    margin-bottom: 1.25rem;
}
.cobro-card[b-oi06pn6dux] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-left: 4px solid var(--rg-primary);
    border-radius: 0.6rem;
    padding: 0.8rem 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    transition: box-shadow 0.15s, transform 0.15s;
}
.cobro-card:hover[b-oi06pn6dux] { box-shadow: 0 6px 18px rgba(0,0,0,0.1); transform: translateY(-2px); }
.cobro-card.is-nc[b-oi06pn6dux] { border-left-color: var(--rg-success, #16a34a); }
.cc-top[b-oi06pn6dux] { display: flex; align-items: center; gap: 0.5rem; }
.cc-recibo[b-oi06pn6dux] { font-size: 0.9rem; font-weight: 700; color: var(--rg-text-primary); }
.cc-fecha[b-oi06pn6dux] { margin-left: auto; font-size: 0.72rem; color: var(--rg-text-muted); white-space: nowrap; }
.cc-familia[b-oi06pn6dux] { font-size: 0.85rem; color: var(--rg-text-secondary); display: flex; align-items: center; gap: 0.35rem; }
.cc-familia i[b-oi06pn6dux] { color: var(--rg-text-muted); }
.cc-total[b-oi06pn6dux] { font-size: 1.35rem; font-weight: 800; color: var(--rg-primary); letter-spacing: -0.01em; }
[data-mode="dark"] .cc-total[b-oi06pn6dux] { color: #93c5fd; }
.cobro-card.is-nc .cc-total[b-oi06pn6dux] { color: var(--rg-success, #16a34a); }
[data-mode="dark"] .cobro-card.is-nc .cc-total[b-oi06pn6dux] { color: #86efac; }
.cc-desglose[b-oi06pn6dux] { display: flex; flex-wrap: wrap; gap: 0.35rem 0.75rem; font-size: 0.74rem; color: var(--rg-text-muted); }
.cc-desglose strong[b-oi06pn6dux] { color: var(--rg-text-secondary); font-weight: 700; }
.cc-foot[b-oi06pn6dux] { display: flex; align-items: center; justify-content: space-between; gap: 0.4rem; padding-top: 0.35rem; border-top: 1px dashed var(--rg-border); }
.cc-cajero[b-oi06pn6dux] { font-size: 0.72rem; color: var(--rg-text-muted); display: inline-flex; align-items: center; gap: 0.25rem; }
.cc-actions[b-oi06pn6dux] { display: flex; gap: 0.3rem; justify-content: flex-end; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_reglas.razor.rz.scp.css */
.crud-container[b-dwkrambedv] { padding: 1.25rem; animation: slideUp-b-dwkrambedv 0.3s ease-out; }
@keyframes slideUp-b-dwkrambedv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-dwkrambedv] { animation: slideUp-b-dwkrambedv 0.3s ease-out; }

.crud-header[b-dwkrambedv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dwkrambedv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dwkrambedv] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-dwkrambedv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-dwkrambedv] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-dwkrambedv] { display: flex; gap: 0.5rem; }

.btn-crud[b-dwkrambedv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-dwkrambedv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dwkrambedv] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-dwkrambedv] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-dwkrambedv] { background: var(--rg-bg-hover); }
.btn-danger[b-dwkrambedv] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-dwkrambedv] { background: rgba(220,38,38,0.1); }
.btn-icon[b-dwkrambedv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; background: transparent; }
.btn-edit[b-dwkrambedv] { color: var(--rg-accent); }
.btn-edit:hover[b-dwkrambedv] { background: rgba(99,102,241,0.1); }
.btn-delete[b-dwkrambedv] { color: #dc2626; }
.btn-delete:hover[b-dwkrambedv] { background: rgba(220,38,38,0.1); }
.btn-text[b-dwkrambedv] { display: inline; }
@media (max-width: 768px) { .btn-text[b-dwkrambedv] { display: none; } }

.crud-alert[b-dwkrambedv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-dwkrambedv] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-dwkrambedv]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-dwkrambedv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-dwkrambedv] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-dwkrambedv]   { color: #fca5a5; }

.crud-search-bar[b-dwkrambedv] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-input); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.25rem 0.5rem; }
.crud-search-bar input[b-dwkrambedv] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.85rem; padding: 0.4rem 0.25rem; outline: none; }
.crud-search-btn[b-dwkrambedv] { background: transparent; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.35rem 0.5rem; border-radius: 0.25rem; }
.crud-search-btn:hover[b-dwkrambedv] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.crud-count[b-dwkrambedv] { font-size: 0.72rem; color: var(--rg-text-muted); margin-left: 0.5rem; }

.crud-grid-wrapper[b-dwkrambedv] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-dwkrambedv] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-dwkrambedv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dwkrambedv] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table td[b-dwkrambedv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr.row-clickable[b-dwkrambedv] { cursor: pointer; }
.crud-table tbody tr.row-clickable:hover td[b-dwkrambedv] { background: var(--rg-bg-hover); }
.col-actions[b-dwkrambedv] { width: 80px; text-align: center; }

.font-mono[b-dwkrambedv] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.badge[b-dwkrambedv] { display: inline-flex; padding: 0.15rem 0.55rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge-yes[b-dwkrambedv]        { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-dwkrambedv]         { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-disparador[b-dwkrambedv] { background: rgba(99,102,241,0.12); color: #4f46e5; border-color: rgba(99,102,241,0.3); }
.badge-auto[b-dwkrambedv]       { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-manual[b-dwkrambedv]     { background: rgba(217,119,6,0.12); color: #92400e; border-color: rgba(217,119,6,0.3); }
[data-mode="dark"] .badge-yes[b-dwkrambedv]        { color: #86efac; }
[data-mode="dark"] .badge-disparador[b-dwkrambedv] { color: #a5b4fc; }
[data-mode="dark"] .badge-auto[b-dwkrambedv]       { color: #86efac; }
[data-mode="dark"] .badge-manual[b-dwkrambedv]     { color: #fcd34d; }

.crud-loading[b-dwkrambedv], .crud-empty-state[b-dwkrambedv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-dwkrambedv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: rg-spin-b-dwkrambedv 0.6s linear infinite; }
@keyframes rg-spin-b-dwkrambedv { to { transform: rotate(360deg); } }
.spin[b-dwkrambedv] { animation: rg-spin-b-dwkrambedv 0.8s linear infinite; display: inline-block; }

.modal-backdrop[b-dwkrambedv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 1000; }
.modal-container[b-dwkrambedv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; padding: 1rem; pointer-events: none; }
.modal-dialog[b-dwkrambedv] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-dwkrambedv] { max-width: 480px; }
.modal-header[b-dwkrambedv] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-dwkrambedv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-dwkrambedv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-dwkrambedv] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-dwkrambedv] { padding: 1.25rem; }
.modal-footer[b-dwkrambedv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_regla_editor.razor.rz.scp.css */
.crud-container[b-fqhry2cm7m] { padding: 1.25rem; animation: slideUp-b-fqhry2cm7m 0.3s ease-out; }
@keyframes slideUp-b-fqhry2cm7m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-fqhry2cm7m] { animation: slideUp-b-fqhry2cm7m 0.3s ease-out; }

.crud-header[b-fqhry2cm7m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fqhry2cm7m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fqhry2cm7m] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-fqhry2cm7m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-fqhry2cm7m] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-fqhry2cm7m] { display: flex; gap: 0.5rem; }

.btn-crud[b-fqhry2cm7m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-fqhry2cm7m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fqhry2cm7m] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-fqhry2cm7m] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-fqhry2cm7m] { background: var(--rg-bg-hover); }
.btn-text[b-fqhry2cm7m] { display: inline; }
@media (max-width: 768px) { .btn-text[b-fqhry2cm7m] { display: none; } }

.crud-alert[b-fqhry2cm7m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-fqhry2cm7m] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-fqhry2cm7m]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-fqhry2cm7m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-fqhry2cm7m] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-fqhry2cm7m]   { color: #fca5a5; }

.form-row[b-fqhry2cm7m] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-fqhry2cm7m] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-fqhry2cm7m] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-input[b-fqhry2cm7m], select.form-input[b-fqhry2cm7m] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-input:focus[b-fqhry2cm7m] { border-color: var(--rg-accent); }

.filtro-checks[b-fqhry2cm7m] { display: flex; flex-direction: column; gap: 0.4rem; padding: 0.6rem 0.85rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); }

.canales-grid[b-fqhry2cm7m] { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.5rem; }
.canal-opt[b-fqhry2cm7m] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
    cursor: pointer;
    border-radius: 0.4rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
    transition: all 0.15s;
}
.canal-opt:hover[b-fqhry2cm7m] { background: var(--rg-bg-hover); }
.canal-opt.checked[b-fqhry2cm7m] { border-color: var(--rg-accent); background: rgba(99,102,241,0.06); }
.canal-opt i[b-fqhry2cm7m] { color: var(--rg-accent); }
[data-mode="dark"] .canal-opt.checked[b-fqhry2cm7m] { background: rgba(99,102,241,0.18); }

.crud-loading[b-fqhry2cm7m] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-fqhry2cm7m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: re-spin-b-fqhry2cm7m 0.6s linear infinite; }
@keyframes re-spin-b-fqhry2cm7m { to { transform: rotate(360deg); } }
.spin[b-fqhry2cm7m] { animation: re-spin-b-fqhry2cm7m 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_cobros_vacaciones.razor.rz.scp.css */
/* Hereda el mismo patrón CRUD de Frmclg_cobros_feriados.razor.css */
.crud-container[b-85btp4b2gx] { padding: 1.25rem; animation: slideUp-b-85btp4b2gx 0.3s ease-out; }
@keyframes slideUp-b-85btp4b2gx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-85btp4b2gx] { animation: slideUp-b-85btp4b2gx 0.3s ease-out; }

.crud-header[b-85btp4b2gx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-85btp4b2gx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-85btp4b2gx] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-85btp4b2gx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-85btp4b2gx] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-85btp4b2gx] { display: flex; gap: 0.5rem; }

.btn-crud[b-85btp4b2gx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-85btp4b2gx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-85btp4b2gx] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-85btp4b2gx] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-85btp4b2gx] { background: var(--rg-bg-hover); }
.btn-danger[b-85btp4b2gx] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-85btp4b2gx] { background: rgba(220,38,38,0.1); }

.btn-icon[b-85btp4b2gx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-85btp4b2gx] { color: var(--rg-accent); }
.btn-edit:hover[b-85btp4b2gx] { background: rgba(99,102,241,0.1); }
.btn-delete[b-85btp4b2gx] { color: #dc2626; }
.btn-delete:hover[b-85btp4b2gx] { background: rgba(220,38,38,0.1); }

.btn-text[b-85btp4b2gx] { display: inline; }
@media (max-width: 768px) { .btn-text[b-85btp4b2gx] { display: none; } }

.crud-alert[b-85btp4b2gx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.success[b-85btp4b2gx] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-85btp4b2gx]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-85btp4b2gx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-85btp4b2gx] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-85btp4b2gx]   { color: #fca5a5; }

.crud-grid-wrapper[b-85btp4b2gx] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-85btp4b2gx] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-85btp4b2gx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-85btp4b2gx] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table td[b-85btp4b2gx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-85btp4b2gx] { background: var(--rg-bg-hover); }
.col-actions[b-85btp4b2gx] { width: 80px; text-align: center; }

.font-mono[b-85btp4b2gx] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.badge[b-85btp4b2gx] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge-yes[b-85btp4b2gx] { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-85btp4b2gx]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
[data-mode="dark"] .badge-yes[b-85btp4b2gx] { color: #86efac; }

.crud-loading[b-85btp4b2gx], .crud-empty-state[b-85btp4b2gx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-85btp4b2gx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: vac-spin-b-85btp4b2gx 0.6s linear infinite; }
@keyframes vac-spin-b-85btp4b2gx { to { transform: rotate(360deg); } }
.spin[b-85btp4b2gx] { animation: vac-spin-b-85btp4b2gx 0.8s linear infinite; display: inline-block; }

.modal-backdrop[b-85btp4b2gx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-85btp4b2gx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-85btp4b2gx] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-85btp4b2gx] { max-width: 480px; }
.modal-header[b-85btp4b2gx] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-85btp4b2gx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-85btp4b2gx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-85btp4b2gx] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-85btp4b2gx] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-footer[b-85btp4b2gx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }

.form-row[b-85btp4b2gx] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-85btp4b2gx] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-85btp4b2gx] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-input[b-85btp4b2gx] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-input:focus[b-85btp4b2gx] { border-color: var(--rg-accent); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_contrato_educativo.razor.rz.scp.css */
/* ============================================================
   Frmclg_descuento_familia — Descuento Pronto Pago por Familia
   Estilos CRUD estándar + elementos específicos del módulo.
   IMPORTANTE: CSS isolation de Blazor — no hereda de otros componentes.
   ============================================================ */

/* ── Animación entrada ──────────────────────────────────────── */
.rg-slide-up[b-82myjxfmyi] { animation: slideUp-b-82myjxfmyi 0.3s ease-out; }
@keyframes slideUp-b-82myjxfmyi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Contenedor raíz ────────────────────────────────────────── */
.crud-container[b-82myjxfmyi] { padding: 1.25rem; max-width: 100%; }

/* ── Header ─────────────────────────────────────────────────── */
.crud-header[b-82myjxfmyi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-82myjxfmyi] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-82myjxfmyi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-82myjxfmyi] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-82myjxfmyi] { display: flex; gap: 0.5rem; }

/* ── Botones ────────────────────────────────────────────────── */
.btn-crud[b-82myjxfmyi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-82myjxfmyi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-82myjxfmyi] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-82myjxfmyi] { filter: brightness(1.1); }
.btn-outline[b-82myjxfmyi] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-82myjxfmyi] { background: var(--rg-bg-hover); }
.btn-danger[b-82myjxfmyi] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-82myjxfmyi] { filter: brightness(1.1); }
.btn-icon[b-82myjxfmyi] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-82myjxfmyi] { color: var(--rg-accent); }
.btn-edit:hover[b-82myjxfmyi] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-82myjxfmyi] { color: var(--rg-danger); }
.btn-delete:hover[b-82myjxfmyi] { background: rgba(239, 68, 68, 0.1); }

/* ── Alerta ─────────────────────────────────────────────────── */
.crud-alert[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-82myjxfmyi] { background: rgba(22, 163, 74, 0.1); color: #14532d; border: 1px solid rgba(22, 163, 74, 0.3); }
.crud-alert.error[b-82myjxfmyi] { background: rgba(220, 38, 38, 0.1); color: #7f1d1d; border: 1px solid rgba(220, 38, 38, 0.3); }
.crud-alert-close[b-82myjxfmyi] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-82myjxfmyi] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-82myjxfmyi]   { color: #fca5a5; }

/* ── Filtros ────────────────────────────────────────────────── */
.df-filters[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.df-search[b-82myjxfmyi] { flex: 1; min-width: 260px; }

/* ── Search bar ─────────────────────────────────────────────── */
.crud-search-bar[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-82myjxfmyi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0.15rem 0.25rem; border-radius: 0.25rem; }
.crud-search-btn:hover[b-82myjxfmyi] { color: var(--rg-accent); }
.crud-search-bar input[b-82myjxfmyi] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-82myjxfmyi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-82myjxfmyi] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* ── Filtro extras ──────────────────────────────────────────── */
.df-filter-extra[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.75rem; }
.df-select[b-82myjxfmyi] { padding: 0.45rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.8rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; }
.df-select:focus[b-82myjxfmyi] { border-color: var(--rg-accent); }
.df-check-label[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; color: var(--rg-text-secondary); cursor: pointer; white-space: nowrap; }
.df-check-label input[type="checkbox"][b-82myjxfmyi] { accent-color: var(--rg-accent); }

/* ── Grid ───────────────────────────────────────────────────── */
.crud-grid-wrapper[b-82myjxfmyi] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 310px); }
.crud-table[b-82myjxfmyi] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-82myjxfmyi] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-82myjxfmyi] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-82myjxfmyi] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-82myjxfmyi] { background: var(--rg-bg-hover); }
.col-actions[b-82myjxfmyi] { width: 80px; text-align: center; white-space: nowrap; }

/* ── Celdas específicas ─────────────────────────────────────── */
.df-familia-id[b-82myjxfmyi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; font-weight: 700; color: var(--rg-text-primary); }
.df-familia-nombre[b-82myjxfmyi] { font-size: 0.72rem; color: var(--rg-text-secondary); }
.df-badge-periodo[b-82myjxfmyi] { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 0.375rem; background: rgba(79, 70, 229, 0.1); color: var(--rg-accent); font-size: 0.72rem; font-weight: 700; font-family: 'Cascadia Code', monospace; }
[data-mode="dark"] .df-badge-periodo[b-82myjxfmyi] { background: rgba(99, 102, 241, 0.2); }
.df-pct[b-82myjxfmyi] { font-size: 0.82rem; font-weight: 700; color: var(--rg-success); }

/* ── Badges ─────────────────────────────────────────────────── */
.badge[b-82myjxfmyi] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-82myjxfmyi] { background: rgba(22, 163, 74, 0.1); color: #166534; border: 1px solid rgba(22, 163, 74, 0.25); }
.badge-no[b-82myjxfmyi]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-82myjxfmyi] { color: #86efac; }

/* ── Utilidades ─────────────────────────────────────────────── */
.font-mono[b-82myjxfmyi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-82myjxfmyi] { text-align: center; }
.text-muted[b-82myjxfmyi] { color: var(--rg-text-muted); font-size: 0.78rem; }

/* ── Estados ────────────────────────────────────────────────── */
.crud-loading[b-82myjxfmyi], .crud-empty-state[b-82myjxfmyi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-82myjxfmyi] { font-size: 2.5rem; opacity: 0.5; }
.crud-spinner[b-82myjxfmyi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-82myjxfmyi 0.6s linear infinite; }
@keyframes spin-b-82myjxfmyi { to { transform: rotate(360deg); } }
.spin[b-82myjxfmyi] { animation: spin-b-82myjxfmyi 0.8s linear infinite; }

/* ── Modal ──────────────────────────────────────────────────── */
.modal-backdrop[b-82myjxfmyi] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-82myjxfmyi] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-82myjxfmyi] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 480px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.df-modal[b-82myjxfmyi] { max-width: 520px; }
.modal-sm[b-82myjxfmyi] { max-width: 420px; }
.modal-header[b-82myjxfmyi] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-82myjxfmyi] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-82myjxfmyi] { border-bottom-color: rgba(220, 38, 38, 0.3); }
.modal-header-danger h2[b-82myjxfmyi] { color: var(--rg-danger); }
.modal-close[b-82myjxfmyi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-82myjxfmyi] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-82myjxfmyi] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-82myjxfmyi] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Formulario ─────────────────────────────────────────────── */
.form-row[b-82myjxfmyi] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-82myjxfmyi] { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.form-group input[b-82myjxfmyi], .form-group select[b-82myjxfmyi] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-82myjxfmyi], .form-group select:focus[b-82myjxfmyi] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-check-group[b-82myjxfmyi] { display: flex; align-items: center; }
.form-check[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.82rem; color: var(--rg-text-primary); }
.form-check input[type="checkbox"][b-82myjxfmyi] { width: 1rem; height: 1rem; accent-color: var(--rg-accent); }

/* ── Labels del modal ───────────────────────────────────────── */
.df-field-label[b-82myjxfmyi] { font-size: 0.68rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.15rem; display: block; }
.df-required[b-82myjxfmyi] { color: var(--rg-danger); }

/* ── Family picker ──────────────────────────────────────────── */
.df-familia-picker[b-82myjxfmyi] { border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem; background: var(--rg-bg-subtle); }
.df-picker-row[b-82myjxfmyi] { display: flex; gap: 0.5rem; align-items: center; }
.df-picker-input[b-82myjxfmyi] { flex: 1; padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }
.df-picker-input:focus[b-82myjxfmyi] { border-color: var(--rg-accent); }
.df-btn-search[b-82myjxfmyi] { padding: 0.375rem 0.75rem; font-size: 0.78rem; flex-shrink: 0; }
.df-picker-results[b-82myjxfmyi] { border: 1px solid var(--rg-border); border-radius: 0.375rem; margin-top: 0.35rem; max-height: 140px; overflow-y: auto; background: var(--rg-bg-card); }
.df-picker-row-item[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.65rem; cursor: pointer; border-bottom: 1px solid var(--rg-border); font-size: 0.78rem; transition: background 0.1s; }
.df-picker-row-item:last-child[b-82myjxfmyi] { border-bottom: none; }
.df-picker-row-item:hover[b-82myjxfmyi] { background: var(--rg-bg-hover); }
.df-fam-id[b-82myjxfmyi] { font-family: 'Cascadia Code', monospace; font-size: 0.72rem; color: var(--rg-text-muted); white-space: nowrap; }
.df-fam-nom[b-82myjxfmyi] { flex: 1; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.df-familia-selected[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.5rem; font-size: 0.8rem; color: var(--rg-text-primary); background: rgba(79, 70, 229, 0.06); border: 1px solid rgba(79, 70, 229, 0.2); border-radius: 0.375rem; padding: 0.35rem 0.65rem; flex-wrap: wrap; }
.df-fam-selected-nom[b-82myjxfmyi] { color: var(--rg-text-secondary); font-size: 0.78rem; }
.df-fam-clear[b-82myjxfmyi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; margin-left: auto; display: flex; align-items: center; }
.df-fam-clear:hover[b-82myjxfmyi] { color: var(--rg-danger); }

/* ── Cascada: picker deshabilitado (sin período) ────────────── */
.df-picker-disabled[b-82myjxfmyi] { opacity: 0.55; pointer-events: none; }
.df-picker-disabled .df-picker-input[b-82myjxfmyi] { background: var(--rg-bg-subtle); cursor: not-allowed; }

/* ── Badges de paso (1/2) ───────────────────────────────────── */
.df-step-badge[b-82myjxfmyi] { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--rg-accent); color: #fff; font-size: 0.65rem; font-weight: 700; margin-right: 0.25rem; flex-shrink: 0; }
.df-step-pending[b-82myjxfmyi] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }

/* ── Hint de campo ──────────────────────────────────────────── */
.df-field-hint[b-82myjxfmyi] { font-size: 0.72rem; color: var(--rg-text-muted); font-weight: 400; margin-left: 0.25rem; }

/* ── Botón Template (header) ────────────────────────────────── */
.df-btn-gentemplate[b-82myjxfmyi] { font-size: 0.75rem; border-color: #2563eb; color: #2563eb; }
.df-btn-gentemplate:hover:not(:disabled)[b-82myjxfmyi] { background: rgba(37,99,235,0.08); }
[data-mode="dark"] .df-btn-gentemplate[b-82myjxfmyi] { border-color: #93c5fd; color: #93c5fd; }
[data-mode="dark"] .df-btn-gentemplate:hover:not(:disabled)[b-82myjxfmyi] { background: rgba(147,197,253,0.1); }

/* ── Contrato Pronto Pago ───────────────────────────────────── */
.df-contrato-card[b-82myjxfmyi] { border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem; background: var(--rg-bg-subtle); }
.df-contrato-header[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.65rem; }
.df-contrato-icon[b-82myjxfmyi] { font-size: 1.4rem; color: #2563eb; flex-shrink: 0; }
[data-mode="dark"] .df-contrato-icon[b-82myjxfmyi] { color: #93c5fd; }
.df-contrato-title[b-82myjxfmyi] { display: block; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); }
.df-contrato-sub[b-82myjxfmyi] { display: block; font-size: 0.7rem; color: var(--rg-text-muted); }
.df-btn-contrato[b-82myjxfmyi] { margin-left: auto; padding: 0.35rem 0.75rem; font-size: 0.75rem; flex-shrink: 0; }

/* ── Evidencia / Documentos adjuntos ────────────────────────── */
.df-evid-section[b-82myjxfmyi] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: hidden; }
.df-evid-header[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem; background: var(--rg-bg-subtle); flex-wrap: wrap; }
.df-evid-icon[b-82myjxfmyi] { font-size: 1.1rem; color: var(--rg-accent); flex-shrink: 0; }
.df-evid-title[b-82myjxfmyi] { font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); }
.df-evid-sub[b-82myjxfmyi] { font-size: 0.7rem; color: var(--rg-text-muted); display: block; }
.df-btn-adjuntar[b-82myjxfmyi] { margin-left: auto; padding: 0.3rem 0.65rem; font-size: 0.72rem; cursor: pointer; }
.df-btn-adjuntar.disabled[b-82myjxfmyi] { opacity: 0.6; pointer-events: none; }

.df-evid-list[b-82myjxfmyi] { padding: 0.3rem 0.5rem; }
.df-evid-item[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.35rem 0.5rem; border-radius: 0.35rem; font-size: 0.78rem; color: var(--rg-text-primary); }
.df-evid-item:hover[b-82myjxfmyi] { background: var(--rg-bg-hover); }
.df-evid-temp[b-82myjxfmyi] { background: rgba(37,99,235,0.05); }
.df-evid-item-icon[b-82myjxfmyi] { font-size: 0.95rem; color: var(--rg-text-muted); flex-shrink: 0; }
.df-evid-item-name[b-82myjxfmyi] { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }
.df-evid-item-date[b-82myjxfmyi] { font-size: 0.68rem; color: var(--rg-text-muted); flex-shrink: 0; }
.df-evid-badge[b-82myjxfmyi] { font-size: 0.62rem; font-weight: 700; border-radius: 1rem; padding: 0.1rem 0.45rem; flex-shrink: 0; }
.df-evid-badge-new[b-82myjxfmyi] { background: rgba(37,99,235,0.15); color: #2563eb; }
[data-mode="dark"] .df-evid-badge-new[b-82myjxfmyi] { color: #93c5fd; }

.df-evid-empty[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.5rem; justify-content: center; padding: 0.75rem; font-size: 0.78rem; color: var(--rg-text-muted); }
.df-evid-uploading[b-82myjxfmyi] { padding: 0.5rem 0.75rem; font-size: 0.78rem; color: var(--rg-text-muted); }
.df-evid-hint[b-82myjxfmyi] { font-size: 0.7rem; color: var(--rg-text-muted); padding: 0.25rem 0.75rem 0.5rem; }

/* ── Panel post-guardado ─────────────────────────────────────── */
.df-postsave-panel[b-82myjxfmyi] { margin-top: 0.75rem; background: rgba(22,163,74,0.08); border: 1px solid rgba(22,163,74,0.25); border-radius: 0.5rem; padding: 0.65rem 0.75rem; }
.df-postsave-info[b-82myjxfmyi] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.82rem; color: var(--rg-text-primary); margin-bottom: 0.5rem; }
.df-postsave-btns[b-82myjxfmyi] { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.df-postsave-btns .btn-crud[b-82myjxfmyi] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
[data-mode="dark"] .df-postsave-panel[b-82myjxfmyi] { background: rgba(22,163,74,0.1); border-color: rgba(22,163,74,0.3); }

/* ── Modales anidados (envío sobre modal principal) ──────────── */
.modal-backdrop-nested[b-82myjxfmyi]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-82myjxfmyi] { z-index: 2001 !important; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-82myjxfmyi] { padding: 0.75rem; }
    .crud-header[b-82myjxfmyi] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-82myjxfmyi] { display: none; }
    .df-filters[b-82myjxfmyi] { flex-direction: column; align-items: stretch; }
    .df-filter-extra[b-82myjxfmyi] { flex-wrap: wrap; }
    .form-row[b-82myjxfmyi] { flex-direction: column; }
    .modal-dialog[b-82myjxfmyi], .df-modal[b-82myjxfmyi] { width: 98%; max-height: 95vh; }
}

/* ── Filtros de búsqueda ─────────────────────────────────────────────── */
.ce-filtros[b-82myjxfmyi] { display:flex; align-items:flex-end; gap:.6rem; padding:.75rem; margin-bottom:1rem; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.5rem; flex-wrap:wrap; }
.filtro-item[b-82myjxfmyi] { display:flex; flex-direction:column; gap:.2rem; }
.filtro-item label[b-82myjxfmyi] { font-size:.65rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.05em; font-weight:600; }
.form-input[b-82myjxfmyi] { padding:.45rem .6rem; border:1px solid var(--rg-border); border-radius:.4rem; font-size:.82rem; color:var(--rg-text-primary); background:var(--rg-bg-input); outline:none; }
.form-input:focus[b-82myjxfmyi] { border-color:var(--rg-accent); }
@media (max-width:768px) { .ce-filtros[b-82myjxfmyi] { flex-direction:column; } }

/* ── Evidencia ────────────────────────────────────────────────────────── */
.ce-btn-evid[b-82myjxfmyi] { color: var(--rg-accent) !important; border-color: rgba(37,99,235,0.3) !important; }
.ce-btn-evid:hover[b-82myjxfmyi] { background: rgba(37,99,235,0.1) !important; }

/* Botón "Ver datos" — ojo azul, lectura solamente */
.ce-btn-ver[b-82myjxfmyi] { color: var(--rg-accent) !important; }
.ce-btn-ver:hover[b-82myjxfmyi] { background: rgba(37,99,235,0.1) !important; }
.ce-evid-row td[b-82myjxfmyi] { padding: 0 !important; }

/* ── Modal vista previa datos contrato ─────────────────────────────────────── */
.ce-det-card[b-82myjxfmyi] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    padding: .6rem .85rem;
}
.ce-det-label[b-82myjxfmyi] {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--rg-text-muted);
    margin-bottom: .2rem;
}
.ce-det-value[b-82myjxfmyi] {
    font-size: .9rem;
    font-weight: 600;
    color: var(--rg-text-primary);
}
.ce-det-sub[b-82myjxfmyi] {
    font-size: .78rem;
    color: var(--rg-text-secondary);
    margin-top: .15rem;
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/Frmclg_descuento_familia.razor.rz.scp.css */
/* ============================================================
   Frmclg_descuento_familia — Descuento Pronto Pago por Familia
   Estilos CRUD estándar + elementos específicos del módulo.
   IMPORTANTE: CSS isolation de Blazor — no hereda de otros componentes.
   ============================================================ */

/* ── Animación entrada ──────────────────────────────────────── */
.rg-slide-up[b-s4ztzm9pkl] { animation: slideUp-b-s4ztzm9pkl 0.3s ease-out; }
@keyframes slideUp-b-s4ztzm9pkl { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Contenedor raíz ────────────────────────────────────────── */
.crud-container[b-s4ztzm9pkl] { padding: 1.25rem; max-width: 100%; }

/* ── Header ─────────────────────────────────────────────────── */
.crud-header[b-s4ztzm9pkl] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-s4ztzm9pkl] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-s4ztzm9pkl] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-s4ztzm9pkl] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-s4ztzm9pkl] { display: flex; gap: 0.5rem; }

/* ── Botones ────────────────────────────────────────────────── */
.btn-crud[b-s4ztzm9pkl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-s4ztzm9pkl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-s4ztzm9pkl] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-s4ztzm9pkl] { filter: brightness(1.1); }
.btn-outline[b-s4ztzm9pkl] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-s4ztzm9pkl] { background: var(--rg-bg-hover); }
.btn-danger[b-s4ztzm9pkl] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-s4ztzm9pkl] { filter: brightness(1.1); }
.btn-icon[b-s4ztzm9pkl] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-s4ztzm9pkl] { color: var(--rg-accent); }
.btn-edit:hover[b-s4ztzm9pkl] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-s4ztzm9pkl] { color: var(--rg-danger); }
.btn-delete:hover[b-s4ztzm9pkl] { background: rgba(239, 68, 68, 0.1); }

/* ── Alerta ─────────────────────────────────────────────────── */
.crud-alert[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-s4ztzm9pkl] { background: rgba(22, 163, 74, 0.1); color: #14532d; border: 1px solid rgba(22, 163, 74, 0.3); }
.crud-alert.error[b-s4ztzm9pkl] { background: rgba(220, 38, 38, 0.1); color: #7f1d1d; border: 1px solid rgba(220, 38, 38, 0.3); }
.crud-alert-close[b-s4ztzm9pkl] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-s4ztzm9pkl] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-s4ztzm9pkl]   { color: #fca5a5; }

/* ── Filtros ────────────────────────────────────────────────── */
.df-filters[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.df-search[b-s4ztzm9pkl] { flex: 1; min-width: 260px; }

/* ── Search bar ─────────────────────────────────────────────── */
.crud-search-bar[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-s4ztzm9pkl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0.15rem 0.25rem; border-radius: 0.25rem; }
.crud-search-btn:hover[b-s4ztzm9pkl] { color: var(--rg-accent); }
.crud-search-bar input[b-s4ztzm9pkl] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-s4ztzm9pkl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-s4ztzm9pkl] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* ── Filtro extras ──────────────────────────────────────────── */
.df-filter-extra[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.75rem; }
.df-select[b-s4ztzm9pkl] { padding: 0.45rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.8rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; }
.df-select:focus[b-s4ztzm9pkl] { border-color: var(--rg-accent); }
.df-check-label[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; color: var(--rg-text-secondary); cursor: pointer; white-space: nowrap; }
.df-check-label input[type="checkbox"][b-s4ztzm9pkl] { accent-color: var(--rg-accent); }

/* ── Grid ───────────────────────────────────────────────────── */
.crud-grid-wrapper[b-s4ztzm9pkl] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 310px); }
.crud-table[b-s4ztzm9pkl] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-s4ztzm9pkl] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-s4ztzm9pkl] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-s4ztzm9pkl] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-s4ztzm9pkl] { background: var(--rg-bg-hover); }
.col-actions[b-s4ztzm9pkl] { width: 80px; text-align: center; white-space: nowrap; }

/* ── Celdas específicas ─────────────────────────────────────── */
.df-familia-id[b-s4ztzm9pkl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; font-weight: 700; color: var(--rg-text-primary); }
.df-familia-nombre[b-s4ztzm9pkl] { font-size: 0.72rem; color: var(--rg-text-secondary); }
.df-badge-periodo[b-s4ztzm9pkl] { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 0.375rem; background: rgba(79, 70, 229, 0.1); color: var(--rg-accent); font-size: 0.72rem; font-weight: 700; font-family: 'Cascadia Code', monospace; }
[data-mode="dark"] .df-badge-periodo[b-s4ztzm9pkl] { background: rgba(99, 102, 241, 0.2); }
.df-pct[b-s4ztzm9pkl] { font-size: 0.82rem; font-weight: 700; color: var(--rg-success); }

/* ── Badges ─────────────────────────────────────────────────── */
.badge[b-s4ztzm9pkl] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-s4ztzm9pkl] { background: rgba(22, 163, 74, 0.1); color: #166534; border: 1px solid rgba(22, 163, 74, 0.25); }
.badge-no[b-s4ztzm9pkl]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-s4ztzm9pkl] { color: #86efac; }

/* ── Utilidades ─────────────────────────────────────────────── */
.font-mono[b-s4ztzm9pkl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-s4ztzm9pkl] { text-align: center; }
.text-muted[b-s4ztzm9pkl] { color: var(--rg-text-muted); font-size: 0.78rem; }

/* ── Estados ────────────────────────────────────────────────── */
.crud-loading[b-s4ztzm9pkl], .crud-empty-state[b-s4ztzm9pkl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-s4ztzm9pkl] { font-size: 2.5rem; opacity: 0.5; }
.crud-spinner[b-s4ztzm9pkl] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-s4ztzm9pkl 0.6s linear infinite; }
@keyframes spin-b-s4ztzm9pkl { to { transform: rotate(360deg); } }
.spin[b-s4ztzm9pkl] { animation: spin-b-s4ztzm9pkl 0.8s linear infinite; }

/* ── Modal ──────────────────────────────────────────────────── */
.modal-backdrop[b-s4ztzm9pkl] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-s4ztzm9pkl] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-s4ztzm9pkl] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 480px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.df-modal[b-s4ztzm9pkl] { max-width: 520px; }
.modal-sm[b-s4ztzm9pkl] { max-width: 420px; }
.modal-header[b-s4ztzm9pkl] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-s4ztzm9pkl] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-s4ztzm9pkl] { border-bottom-color: rgba(220, 38, 38, 0.3); }
.modal-header-danger h2[b-s4ztzm9pkl] { color: var(--rg-danger); }
.modal-close[b-s4ztzm9pkl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-s4ztzm9pkl] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-s4ztzm9pkl] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-s4ztzm9pkl] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Formulario ─────────────────────────────────────────────── */
.form-row[b-s4ztzm9pkl] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-s4ztzm9pkl] { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.form-group input[b-s4ztzm9pkl], .form-group select[b-s4ztzm9pkl] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-s4ztzm9pkl], .form-group select:focus[b-s4ztzm9pkl] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-check-group[b-s4ztzm9pkl] { display: flex; align-items: center; }
.form-check[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.82rem; color: var(--rg-text-primary); }
.form-check input[type="checkbox"][b-s4ztzm9pkl] { width: 1rem; height: 1rem; accent-color: var(--rg-accent); }

/* ── Labels del modal ───────────────────────────────────────── */
.df-field-label[b-s4ztzm9pkl] { font-size: 0.68rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.15rem; display: block; }
.df-required[b-s4ztzm9pkl] { color: var(--rg-danger); }

/* ── Family picker ──────────────────────────────────────────── */
.df-familia-picker[b-s4ztzm9pkl] { border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem; background: var(--rg-bg-subtle); }
.df-picker-row[b-s4ztzm9pkl] { display: flex; gap: 0.5rem; align-items: center; }
.df-picker-input[b-s4ztzm9pkl] { flex: 1; padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }
.df-picker-input:focus[b-s4ztzm9pkl] { border-color: var(--rg-accent); }
.df-btn-search[b-s4ztzm9pkl] { padding: 0.375rem 0.75rem; font-size: 0.78rem; flex-shrink: 0; }
.df-picker-results[b-s4ztzm9pkl] { border: 1px solid var(--rg-border); border-radius: 0.375rem; margin-top: 0.35rem; max-height: 140px; overflow-y: auto; background: var(--rg-bg-card); }
.df-picker-row-item[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.65rem; cursor: pointer; border-bottom: 1px solid var(--rg-border); font-size: 0.78rem; transition: background 0.1s; }
.df-picker-row-item:last-child[b-s4ztzm9pkl] { border-bottom: none; }
.df-picker-row-item:hover[b-s4ztzm9pkl] { background: var(--rg-bg-hover); }
.df-fam-id[b-s4ztzm9pkl] { font-family: 'Cascadia Code', monospace; font-size: 0.72rem; color: var(--rg-text-muted); white-space: nowrap; }
.df-fam-nom[b-s4ztzm9pkl] { flex: 1; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.df-familia-selected[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.5rem; font-size: 0.8rem; color: var(--rg-text-primary); background: rgba(79, 70, 229, 0.06); border: 1px solid rgba(79, 70, 229, 0.2); border-radius: 0.375rem; padding: 0.35rem 0.65rem; flex-wrap: wrap; }
.df-fam-selected-nom[b-s4ztzm9pkl] { color: var(--rg-text-secondary); font-size: 0.78rem; }
.df-fam-clear[b-s4ztzm9pkl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; margin-left: auto; display: flex; align-items: center; }
.df-fam-clear:hover[b-s4ztzm9pkl] { color: var(--rg-danger); }

/* ── Cascada: picker deshabilitado (sin período) ────────────── */
.df-picker-disabled[b-s4ztzm9pkl] { opacity: 0.55; pointer-events: none; }
.df-picker-disabled .df-picker-input[b-s4ztzm9pkl] { background: var(--rg-bg-subtle); cursor: not-allowed; }

/* ── Badges de paso (1/2) ───────────────────────────────────── */
.df-step-badge[b-s4ztzm9pkl] { display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--rg-accent); color: #fff; font-size: 0.65rem; font-weight: 700; margin-right: 0.25rem; flex-shrink: 0; }
.df-step-pending[b-s4ztzm9pkl] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }

/* ── Hint de campo ──────────────────────────────────────────── */
.df-field-hint[b-s4ztzm9pkl] { font-size: 0.72rem; color: var(--rg-text-muted); font-weight: 400; margin-left: 0.25rem; }

/* ── Botón Template (header) ────────────────────────────────── */
.df-btn-gentemplate[b-s4ztzm9pkl] { font-size: 0.75rem; border-color: #2563eb; color: #2563eb; }
.df-btn-gentemplate:hover:not(:disabled)[b-s4ztzm9pkl] { background: rgba(37,99,235,0.08); }
[data-mode="dark"] .df-btn-gentemplate[b-s4ztzm9pkl] { border-color: #93c5fd; color: #93c5fd; }
[data-mode="dark"] .df-btn-gentemplate:hover:not(:disabled)[b-s4ztzm9pkl] { background: rgba(147,197,253,0.1); }

/* ── Contrato Pronto Pago ───────────────────────────────────── */
.df-contrato-card[b-s4ztzm9pkl] { border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem; background: var(--rg-bg-subtle); }
.df-contrato-header[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.65rem; }
.df-contrato-icon[b-s4ztzm9pkl] { font-size: 1.4rem; color: #2563eb; flex-shrink: 0; }
[data-mode="dark"] .df-contrato-icon[b-s4ztzm9pkl] { color: #93c5fd; }
.df-contrato-title[b-s4ztzm9pkl] { display: block; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); }
.df-contrato-sub[b-s4ztzm9pkl] { display: block; font-size: 0.7rem; color: var(--rg-text-muted); }
.df-btn-contrato[b-s4ztzm9pkl] { margin-left: auto; padding: 0.35rem 0.75rem; font-size: 0.75rem; flex-shrink: 0; }

/* ── Evidencia / Documentos adjuntos ────────────────────────── */
.df-evid-section[b-s4ztzm9pkl] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: hidden; }
.df-evid-header[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem; background: var(--rg-bg-subtle); flex-wrap: wrap; }
.df-evid-icon[b-s4ztzm9pkl] { font-size: 1.1rem; color: var(--rg-accent); flex-shrink: 0; }
.df-evid-title[b-s4ztzm9pkl] { font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); }
.df-evid-sub[b-s4ztzm9pkl] { font-size: 0.7rem; color: var(--rg-text-muted); display: block; }
.df-btn-adjuntar[b-s4ztzm9pkl] { margin-left: auto; padding: 0.3rem 0.65rem; font-size: 0.72rem; cursor: pointer; }
.df-btn-adjuntar.disabled[b-s4ztzm9pkl] { opacity: 0.6; pointer-events: none; }

.df-evid-list[b-s4ztzm9pkl] { padding: 0.3rem 0.5rem; }
.df-evid-item[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.35rem 0.5rem; border-radius: 0.35rem; font-size: 0.78rem; color: var(--rg-text-primary); }
.df-evid-item:hover[b-s4ztzm9pkl] { background: var(--rg-bg-hover); }
.df-evid-temp[b-s4ztzm9pkl] { background: rgba(37,99,235,0.05); }
.df-evid-item-icon[b-s4ztzm9pkl] { font-size: 0.95rem; color: var(--rg-text-muted); flex-shrink: 0; }
.df-evid-item-name[b-s4ztzm9pkl] { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px; }
.df-evid-item-date[b-s4ztzm9pkl] { font-size: 0.68rem; color: var(--rg-text-muted); flex-shrink: 0; }
.df-evid-badge[b-s4ztzm9pkl] { font-size: 0.62rem; font-weight: 700; border-radius: 1rem; padding: 0.1rem 0.45rem; flex-shrink: 0; }
.df-evid-badge-new[b-s4ztzm9pkl] { background: rgba(37,99,235,0.15); color: #2563eb; }
[data-mode="dark"] .df-evid-badge-new[b-s4ztzm9pkl] { color: #93c5fd; }

.df-evid-empty[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.5rem; justify-content: center; padding: 0.75rem; font-size: 0.78rem; color: var(--rg-text-muted); }
.df-evid-uploading[b-s4ztzm9pkl] { padding: 0.5rem 0.75rem; font-size: 0.78rem; color: var(--rg-text-muted); }
.df-evid-hint[b-s4ztzm9pkl] { font-size: 0.7rem; color: var(--rg-text-muted); padding: 0.25rem 0.75rem 0.5rem; }

/* ── Panel post-guardado ─────────────────────────────────────── */
.df-postsave-panel[b-s4ztzm9pkl] { margin-top: 0.75rem; background: rgba(22,163,74,0.08); border: 1px solid rgba(22,163,74,0.25); border-radius: 0.5rem; padding: 0.65rem 0.75rem; }
.df-postsave-info[b-s4ztzm9pkl] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.82rem; color: var(--rg-text-primary); margin-bottom: 0.5rem; }
.df-postsave-btns[b-s4ztzm9pkl] { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.df-postsave-btns .btn-crud[b-s4ztzm9pkl] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
[data-mode="dark"] .df-postsave-panel[b-s4ztzm9pkl] { background: rgba(22,163,74,0.1); border-color: rgba(22,163,74,0.3); }

/* ── Modales anidados (envío sobre modal principal) ──────────── */
.modal-backdrop-nested[b-s4ztzm9pkl]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-s4ztzm9pkl] { z-index: 2001 !important; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-s4ztzm9pkl] { padding: 0.75rem; }
    .crud-header[b-s4ztzm9pkl] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-s4ztzm9pkl] { display: none; }
    .df-filters[b-s4ztzm9pkl] { flex-direction: column; align-items: stretch; }
    .df-filter-extra[b-s4ztzm9pkl] { flex-wrap: wrap; }
    .form-row[b-s4ztzm9pkl] { flex-direction: column; }
    .modal-dialog[b-s4ztzm9pkl], .df-modal[b-s4ztzm9pkl] { width: 98%; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/FrmCLG_ProgramcionDescuento.razor.rz.scp.css */
/* ============================================================
   FrmCLG_ProgramcionDescuento — Programación de Descuento Pronto Pago
   CSS isolation de Blazor: auto-contenido, tokens var(--rg-*).
   ============================================================ */

.rg-slide-up[b-zg9162v1tm] { animation: slideUp-b-zg9162v1tm 0.3s ease-out; }
@keyframes slideUp-b-zg9162v1tm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Contenedor ─────────────────────────────────────────────── */
.crud-container[b-zg9162v1tm] { padding: 1.25rem; max-width: 100%; }

/* ── Header ─────────────────────────────────────────────────── */
.crud-header[b-zg9162v1tm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zg9162v1tm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zg9162v1tm] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-zg9162v1tm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-zg9162v1tm] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-zg9162v1tm] { display: flex; gap: 0.5rem; }

/* ── Botones ────────────────────────────────────────────────── */
.btn-crud[b-zg9162v1tm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zg9162v1tm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zg9162v1tm] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zg9162v1tm] { filter: brightness(1.1); }
.btn-outline[b-zg9162v1tm] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-zg9162v1tm] { background: var(--rg-bg-hover); }
.btn-danger[b-zg9162v1tm] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-zg9162v1tm] { filter: brightness(1.1); }
.btn-icon[b-zg9162v1tm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zg9162v1tm] { color: var(--rg-accent); }
.btn-edit:hover[b-zg9162v1tm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zg9162v1tm] { color: var(--rg-danger); }
.btn-delete:hover[b-zg9162v1tm] { background: rgba(239, 68, 68, 0.1); }

/* ── Alerta ─────────────────────────────────────────────────── */
.crud-alert[b-zg9162v1tm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zg9162v1tm] { background: rgba(22, 163, 74, 0.1); color: #14532d; border: 1px solid rgba(22, 163, 74, 0.3); }
.crud-alert.error[b-zg9162v1tm] { background: rgba(220, 38, 38, 0.1); color: #7f1d1d; border: 1px solid rgba(220, 38, 38, 0.3); }
.crud-alert-close[b-zg9162v1tm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-zg9162v1tm] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-zg9162v1tm]   { color: #fca5a5; }

/* ── Info bar ───────────────────────────────────────────────── */
.dp-info-bar[b-zg9162v1tm] { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.625rem 0.875rem; background: rgba(37, 99, 235, 0.06); border: 1px solid rgba(37, 99, 235, 0.2); border-radius: 0.5rem; margin-bottom: 0.875rem; font-size: 0.8rem; color: var(--rg-text-secondary); line-height: 1.5; }
[data-mode="dark"] .dp-info-bar[b-zg9162v1tm] { background: rgba(99, 102, 241, 0.1); border-color: rgba(99, 102, 241, 0.3); }

/* ── Grid ───────────────────────────────────────────────────── */
.crud-grid-wrapper[b-zg9162v1tm] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 340px); }
.crud-table[b-zg9162v1tm] { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.crud-table thead[b-zg9162v1tm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zg9162v1tm] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-zg9162v1tm] { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-zg9162v1tm] { background: var(--rg-bg-hover); }
.col-actions[b-zg9162v1tm] { width: 80px; text-align: center; white-space: nowrap; }

/* ── Celdas específicas ─────────────────────────────────────── */
.dp-badge-periodo[b-zg9162v1tm] { display: inline-block; padding: 0.2rem 0.65rem; border-radius: 0.375rem; background: rgba(79, 70, 229, 0.1); color: var(--rg-accent); font-size: 0.82rem; font-weight: 700; font-family: 'Cascadia Code', 'Fira Code', monospace; letter-spacing: 0.02em; }
[data-mode="dark"] .dp-badge-periodo[b-zg9162v1tm] { background: rgba(99, 102, 241, 0.2); }
.dp-cuotas-value[b-zg9162v1tm] { font-size: 1.4rem; font-weight: 800; color: var(--rg-accent); line-height: 1; }
.dp-cuotas-label[b-zg9162v1tm] { font-size: 0.72rem; color: var(--rg-text-muted); margin-left: 0.25rem; }

/* ── Utilidades ─────────────────────────────────────────────── */
.font-mono[b-zg9162v1tm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zg9162v1tm] { text-align: center; }
.text-muted[b-zg9162v1tm] { color: var(--rg-text-muted); font-size: 0.8rem; }

/* ── Estados ────────────────────────────────────────────────── */
.crud-loading[b-zg9162v1tm], .crud-empty-state[b-zg9162v1tm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-zg9162v1tm] { font-size: 2.5rem; opacity: 0.5; }
.crud-spinner[b-zg9162v1tm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-zg9162v1tm 0.6s linear infinite; }
@keyframes spin-b-zg9162v1tm { to { transform: rotate(360deg); } }
.spin[b-zg9162v1tm] { animation: spin-b-zg9162v1tm 0.8s linear infinite; }

/* ── Modal ──────────────────────────────────────────────────── */
.modal-backdrop[b-zg9162v1tm] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-zg9162v1tm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zg9162v1tm] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 420px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-zg9162v1tm] { max-width: 420px; }
.dp-modal[b-zg9162v1tm] { max-width: 440px; }
.modal-header[b-zg9162v1tm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-zg9162v1tm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zg9162v1tm] { border-bottom-color: rgba(220, 38, 38, 0.3); }
.modal-header-danger h2[b-zg9162v1tm] { color: var(--rg-danger); }
.modal-close[b-zg9162v1tm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zg9162v1tm] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-zg9162v1tm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zg9162v1tm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Form modal ─────────────────────────────────────────────── */
.form-group[b-zg9162v1tm] { display: flex; flex-direction: column; gap: 0.2rem; }
.form-group select[b-zg9162v1tm], .form-group input[type="number"][b-zg9162v1tm] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group select:focus[b-zg9162v1tm], .form-group input:focus[b-zg9162v1tm] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.dp-readonly[b-zg9162v1tm] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); font-family: 'Cascadia Code', monospace; font-weight: 700; width: 100%; }
.dp-field-label[b-zg9162v1tm] { font-size: 0.68rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.dp-required[b-zg9162v1tm] { color: var(--rg-danger); }
.dp-hint[b-zg9162v1tm] { font-size: 0.7rem; color: var(--rg-text-muted); margin-top: 0.2rem; }
.dp-cuotas-input-row[b-zg9162v1tm] { display: flex; align-items: center; gap: 0.5rem; }
.dp-cuotas-input-row input[b-zg9162v1tm] { flex: 1; }
.dp-cuotas-suffix[b-zg9162v1tm] { font-size: 0.78rem; color: var(--rg-text-secondary); white-space: nowrap; }

/* ── Resumen ────────────────────────────────────────────────── */
.dp-resumen-box[b-zg9162v1tm] { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.625rem 0.875rem; background: rgba(217, 119, 6, 0.08); border: 1px solid rgba(217, 119, 6, 0.25); border-radius: 0.5rem; margin-top: 0.75rem; font-size: 0.8rem; color: var(--rg-text-secondary); line-height: 1.5; }
[data-mode="dark"] .dp-resumen-box[b-zg9162v1tm] { background: rgba(217, 119, 6, 0.12); }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-zg9162v1tm] { padding: 0.75rem; }
    .crud-header[b-zg9162v1tm] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-zg9162v1tm] { display: none; }
    .modal-dialog[b-zg9162v1tm], .dp-modal[b-zg9162v1tm] { width: 98%; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/AgingTable.razor.rz.scp.css */
/* ============================================================
   AgingTable — Tintes progresivos por bucket
   Tokens --rg-* + soporte dark mode
   ============================================================ */

.ag-wrapper[b-tammz42aor] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 320px);
}

.ag-table[b-tammz42aor] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.ag-table thead[b-tammz42aor] { position: sticky; top: 0; z-index: 1; }
.ag-table th[b-tammz42aor] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.55rem 0.75rem;
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--rg-border);
    white-space: nowrap;
}
.ag-table th.ag-num[b-tammz42aor] { text-align: right; }
.ag-table td[b-tammz42aor] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.ag-table td.ag-num[b-tammz42aor] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.78rem;
    white-space: nowrap;
}
.ag-table tbody tr:hover td[b-tammz42aor] { background: var(--rg-bg-hover); }

.ag-cell-sub[b-tammz42aor] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-top: 0.1rem;
}
.font-mono[b-tammz42aor] { font-family: 'Cascadia Code','Fira Code',monospace; }

.ag-total[b-tammz42aor] { color: var(--rg-text-primary); }

.ag-empty[b-tammz42aor] {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--rg-text-muted);
    font-style: italic;
}

/* Bucket borders (verde → ámbar → rojo) */
.ag-th-vigente[b-tammz42aor] { border-bottom: 3px solid #16a34a !important; }
.ag-th-30[b-tammz42aor]      { border-bottom: 3px solid #facc15 !important; }
.ag-th-60[b-tammz42aor]      { border-bottom: 3px solid #f59e0b !important; }
.ag-th-90[b-tammz42aor]      { border-bottom: 3px solid #ea580c !important; }
.ag-th-90p[b-tammz42aor]     { border-bottom: 3px solid #dc2626 !important; }

/* Bucket cell tints (light mode) */
.ag-cell-vigente[b-tammz42aor] { background: rgba(22,163,74,0.04); }
.ag-cell-30[b-tammz42aor]      { background: rgba(250,204,21,0.05); }
.ag-cell-60[b-tammz42aor]      { background: rgba(245,158,11,0.08); }
.ag-cell-90[b-tammz42aor]      { background: rgba(234,88,12,0.10); }
.ag-cell-90p[b-tammz42aor]     { background: rgba(220,38,38,0.12); color: #991b1b; font-weight: 600; }

/* Bucket cell tints (dark mode) — alpha más alto para contraste */
[data-mode="dark"] .ag-cell-vigente[b-tammz42aor] { background: rgba(22,163,74,0.10); }
[data-mode="dark"] .ag-cell-30[b-tammz42aor]      { background: rgba(250,204,21,0.10); }
[data-mode="dark"] .ag-cell-60[b-tammz42aor]      { background: rgba(245,158,11,0.14); }
[data-mode="dark"] .ag-cell-90[b-tammz42aor]      { background: rgba(234,88,12,0.16); }
[data-mode="dark"] .ag-cell-90p[b-tammz42aor]     { background: rgba(220,38,38,0.18); color: #fca5a5; }

/* Columna Cargos — azul / informativo (CLG_CARGOS_MOVIMIENTOS pendientes) */
.ag-th-cargos[b-tammz42aor]  { border-bottom: 3px solid #2563eb !important; }
.ag-cell-cargos[b-tammz42aor] {
    background: rgba(37,99,235,0.06);
    color: #1d4ed8;
    font-weight: 600;
}
[data-mode="dark"] .ag-cell-cargos[b-tammz42aor] {
    background: rgba(37,99,235,0.14);
    color: #93c5fd;
}

/* Columna Mora — ámbar / advertencia (separada del capital) */
.ag-th-mora[b-tammz42aor]   { border-bottom: 3px solid #d97706 !important; }
.ag-cell-mora[b-tammz42aor] {
    background: rgba(217,119,6,0.07);
    color: #92400e;
    font-weight: 600;
}
[data-mode="dark"] .ag-cell-mora[b-tammz42aor] {
    background: rgba(217,119,6,0.15);
    color: #fcd34d;
}

/* Columna Total General — destaca por encima del resto */
.ag-th-total-gen[b-tammz42aor] { border-bottom: 3px solid var(--rg-text-primary) !important; }
.ag-total-gen[b-tammz42aor]    { color: var(--rg-text-primary); font-weight: 700; }

/* Footer (totales) */
.ag-foot td[b-tammz42aor] {
    background: var(--rg-bg-subtle) !important;
    font-weight: 700;
    border-top: 2px solid var(--rg-text-primary);
    border-bottom: none;
}
.ag-foot td.ag-cell-90p[b-tammz42aor]     { color: #991b1b; }
[data-mode="dark"] .ag-foot td.ag-cell-90p[b-tammz42aor] { color: #fca5a5; }
.ag-foot td.ag-cell-cargos[b-tammz42aor]  { color: #1d4ed8; }
[data-mode="dark"] .ag-foot td.ag-cell-cargos[b-tammz42aor] { color: #93c5fd; }
.ag-foot td.ag-cell-mora[b-tammz42aor]    { color: #92400e; }
[data-mode="dark"] .ag-foot td.ag-cell-mora[b-tammz42aor] { color: #fcd34d; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/CascadeBreakdown.razor.rz.scp.css */
/* ============================================================
   CascadeBreakdown — Cascada de pago visual
   Tokens --rg-* + dark mode
   ============================================================ */

.cb-box[b-3b1meni5w0] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
}

.cb-section[b-3b1meni5w0] {
    background: var(--rg-bg-subtle);
    padding: 0.5rem 1rem;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    color: var(--rg-text-secondary);
    border-bottom: 1px solid var(--rg-border);
}

.cb-line[b-3b1meni5w0] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    font-size: 0.85rem;
    align-items: center;
}
.cb-line:last-child[b-3b1meni5w0] { border-bottom: none; }

.cb-label[b-3b1meni5w0] {
    color: var(--rg-text-primary);
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.cb-formula[b-3b1meni5w0] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    margin-top: 0.15rem;
    font-variant-numeric: tabular-nums;
}

.cb-value[b-3b1meni5w0] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    white-space: nowrap;
    font-size: 0.85rem;
}
.cb-value.applied[b-3b1meni5w0] { color: #16a34a; }
.cb-value.pending[b-3b1meni5w0] { color: var(--rg-text-muted); }

[data-mode="dark"] .cb-value.applied[b-3b1meni5w0] { color: #86efac; }

.cb-line.cb-subtotal[b-3b1meni5w0] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
    border-top: 2px solid var(--rg-text-primary);
}
.cb-line.cb-subtotal .cb-value[b-3b1meni5w0] { font-weight: 700; }

.cb-line.cb-total[b-3b1meni5w0] {
    background: var(--rg-text-primary);
    color: var(--rg-bg-card);
    font-weight: 700;
    font-size: 0.95rem;
}
.cb-line.cb-total .cb-label[b-3b1meni5w0] { color: var(--rg-bg-card); }
.cb-line.cb-total .cb-value[b-3b1meni5w0] {
    color: var(--rg-bg-card);
    font-size: 1.05rem;
}

[data-mode="dark"] .cb-line.cb-total[b-3b1meni5w0] {
    background: var(--rg-bg-page);
    color: var(--rg-text-primary);
}
[data-mode="dark"] .cb-line.cb-total .cb-label[b-3b1meni5w0],
[data-mode="dark"] .cb-line.cb-total .cb-value[b-3b1meni5w0] {
    color: var(--rg-text-primary);
}

.cb-empty[b-3b1meni5w0] {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
.cb-empty i[b-3b1meni5w0] { font-size: 1.1rem; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/ClgFamiliaPickerModal.razor.rz.scp.css */
/* ============================================================
   ClgFamiliaPickerModal — Modal selector de familias
   Tokens --rg-* + soporte dark mode
   ============================================================ */

.cfp-modal-backdrop[b-8a2enlulzy] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: cfp-fadeIn-b-8a2enlulzy 0.15s ease-out;
}

.cfp-modal-container[b-8a2enlulzy] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
    padding: 1rem;
}

.cfp-modal-dialog[b-8a2enlulzy] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    max-width: 800px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    animation: cfp-scaleIn-b-8a2enlulzy 0.2s ease-out;
}

@keyframes cfp-fadeIn-b-8a2enlulzy { from { opacity: 0; } to { opacity: 1; } }
@keyframes cfp-scaleIn-b-8a2enlulzy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.cfp-modal-header[b-8a2enlulzy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}
.cfp-modal-header h2[b-8a2enlulzy] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cfp-modal-close[b-8a2enlulzy] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    transition: all 0.15s;
}
.cfp-modal-close:hover[b-8a2enlulzy] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

.cfp-modal-body[b-8a2enlulzy] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
    flex: 1;
}

.cfp-modal-footer[b-8a2enlulzy] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}

/* Search bar */
.cfp-search-bar[b-8a2enlulzy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
}
.cfp-search-bar input[b-8a2enlulzy] {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--rg-text-primary);
    font-size: 0.85rem;
    padding: 0.4rem 0.25rem;
    outline: none;
}
.cfp-search-btn[b-8a2enlulzy], .cfp-search-clear[b-8a2enlulzy] {
    background: transparent;
    border: none;
    color: var(--rg-text-muted);
    cursor: pointer;
    padding: 0.35rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.9rem;
}
.cfp-search-btn:hover[b-8a2enlulzy], .cfp-search-clear:hover[b-8a2enlulzy] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}
.cfp-count[b-8a2enlulzy] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    margin-left: 0.5rem;
}

/* Grid */
.cfp-grid-wrapper[b-8a2enlulzy] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: 50vh;
}
.cfp-table[b-8a2enlulzy] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.cfp-table thead[b-8a2enlulzy] { position: sticky; top: 0; z-index: 1; }
.cfp-table th[b-8a2enlulzy] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.cfp-table th.cfp-num[b-8a2enlulzy] { text-align: right; }
.cfp-table td[b-8a2enlulzy] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.cfp-table td.cfp-num[b-8a2enlulzy] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.cfp-table td.cfp-mono[b-8a2enlulzy] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.78rem;
}
.cfp-row-clickable[b-8a2enlulzy] { cursor: pointer; transition: background 0.1s; }
.cfp-row-clickable:hover td[b-8a2enlulzy] { background: var(--rg-bg-hover); }

.cfp-avatar[b-8a2enlulzy] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(99, 102, 241, 0.12);
    color: #6366f1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
}
[data-mode="dark"] .cfp-avatar[b-8a2enlulzy] { color: #a5b4fc; }

/* States */
.cfp-state[b-8a2enlulzy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem;
    gap: 0.75rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
}
.cfp-spinner[b-8a2enlulzy] {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: cfp-spin-b-8a2enlulzy 0.6s linear infinite;
}
@keyframes cfp-spin-b-8a2enlulzy { to { transform: rotate(360deg); } }
.spin[b-8a2enlulzy] { animation: cfp-spin-b-8a2enlulzy 0.8s linear infinite; display: inline-block; }

/* Botones */
.cfp-btn[b-8a2enlulzy] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border-radius: 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    border: 1px solid var(--rg-border);
    background: transparent;
    color: var(--rg-text-secondary);
}
.cfp-btn:hover[b-8a2enlulzy] { background: var(--rg-bg-hover); }
.cfp-btn-outline[b-8a2enlulzy] { /* default */ }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/ClgSolicitarCondonacionModal.razor.rz.scp.css */
/* ============================================================
   ClgSolicitarCondonacionModal — Tokens --rg-* + dark mode
   ============================================================ */

.scm-modal-backdrop[b-3xtrr9im36] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 2000;
    animation: scm-fadeIn-b-3xtrr9im36 0.15s ease-out;
}
.scm-modal-container[b-3xtrr9im36] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2001;
    pointer-events: none;
    padding: 1rem;
}
.scm-modal-dialog[b-3xtrr9im36] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    max-width: 640px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: scm-scaleIn-b-3xtrr9im36 0.2s ease-out;
}

@keyframes scm-fadeIn-b-3xtrr9im36 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scm-scaleIn-b-3xtrr9im36 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.scm-modal-header[b-3xtrr9im36] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1.25rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.scm-modal-header h2[b-3xtrr9im36] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.scm-modal-close[b-3xtrr9im36] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
}
.scm-modal-close:hover[b-3xtrr9im36] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }

.scm-modal-body[b-3xtrr9im36] {
    padding: 1.25rem;
    overflow-y: auto;
    flex: 1;
}

.scm-modal-footer[b-3xtrr9im36] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}

.scm-familia-info[b-3xtrr9im36] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.6rem 0.85rem;
    margin-bottom: 1rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
}
.scm-familia-info i[b-3xtrr9im36] { color: var(--rg-accent); }
.scm-meta[b-3xtrr9im36] {
    margin-left: auto;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.75rem;
    color: var(--rg-text-muted);
}

.scm-alert[b-3xtrr9im36] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border-radius: 0.4rem;
    margin-bottom: 0.75rem;
    font-size: 0.82rem;
    background: rgba(220,38,38,0.1);
    color: #991b1b;
    border: 1px solid rgba(220,38,38,0.3);
}
[data-mode="dark"] .scm-alert[b-3xtrr9im36] { color: #fca5a5; }

.scm-form-label[b-3xtrr9im36] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 0.4rem;
}

.scm-required[b-3xtrr9im36] { color: #dc2626; }

.scm-table-wrapper[b-3xtrr9im36] {
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    overflow: hidden;
}
.scm-table[b-3xtrr9im36] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.scm-table th[b-3xtrr9im36] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.5rem 0.65rem;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--rg-border);
}
.scm-table th.text-right[b-3xtrr9im36] { text-align: right; }
.scm-table td[b-3xtrr9im36] {
    padding: 0.5rem 0.65rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.scm-table td.text-right[b-3xtrr9im36] { text-align: right; font-variant-numeric: tabular-nums; }
.scm-table tbody tr:last-child td[b-3xtrr9im36] { border-bottom: none; }

.scm-total-row td[b-3xtrr9im36] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
}

.scm-cell-sub[b-3xtrr9im36] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-top: 0.1rem;
}

.scm-input[b-3xtrr9im36] {
    width: 110px;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    font-size: 0.85rem;
}
.scm-input:focus[b-3xtrr9im36] { outline: none; border-color: var(--rg-accent); }

/* Columna de porcentajes rápidos */
.scm-th-pct[b-3xtrr9im36] { width: 160px; text-align: center; }

.scm-pct-group[b-3xtrr9im36] {
    display: flex;
    gap: 0.25rem;
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.scm-btn-mini[b-3xtrr9im36] {
    padding: 0.2rem 0.4rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    background: var(--rg-bg-card);
    color: var(--rg-text-secondary);
    font-size: 0.62rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    min-width: 32px;
}
.scm-btn-mini:hover[b-3xtrr9im36] {
    background: var(--rg-accent);
    color: #fff;
    border-color: var(--rg-accent);
}

.scm-textarea[b-3xtrr9im36] {
    width: 100%;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    font-size: 0.85rem;
    font-family: inherit;
    resize: vertical;
    outline: none;
    box-sizing: border-box;
}
.scm-textarea:focus[b-3xtrr9im36] { border-color: var(--rg-accent); }

.scm-info-banner[b-3xtrr9im36] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    margin-top: 0.85rem;
    background: rgba(37,99,235,0.08);
    border: 1px solid rgba(37,99,235,0.3);
    border-radius: 0.4rem;
    font-size: 0.78rem;
    color: #1e40af;
}
.scm-info-banner i[b-3xtrr9im36] { font-size: 0.95rem; margin-top: 0.1rem; flex-shrink: 0; }
[data-mode="dark"] .scm-info-banner[b-3xtrr9im36] { color: #93c5fd; }

.scm-empty[b-3xtrr9im36] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem;
    gap: 0.5rem;
    color: var(--rg-text-muted);
    text-align: center;
}
.scm-empty p[b-3xtrr9im36] { margin: 0; font-size: 0.9rem; }

/* Botones */
.scm-btn[b-3xtrr9im36] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 1rem;
    border-radius: 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    border: 1px solid var(--rg-border);
    background: transparent;
    color: var(--rg-text-secondary);
}
.scm-btn:disabled[b-3xtrr9im36] { opacity: 0.6; cursor: not-allowed; }
.scm-btn-outline:hover:not(:disabled)[b-3xtrr9im36] { background: var(--rg-bg-hover); }
.scm-btn-primary[b-3xtrr9im36] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.scm-btn-primary:hover:not(:disabled)[b-3xtrr9im36] { filter: brightness(1.1); }

.text-right[b-3xtrr9im36] { text-align: right; }
.spin[b-3xtrr9im36] { animation: scm-spin-b-3xtrr9im36 0.8s linear infinite; display: inline-block; }
@keyframes scm-spin-b-3xtrr9im36 { to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/DayOfWeekPicker.razor.rz.scp.css */
.dwp[b-ytgpnevkeb] { display: flex; gap: 0.4rem; }
.dwp-btn[b-ytgpnevkeb] {
    width: 38px; height: 38px;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-weight: 700;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.15s;
}
.dwp-btn:hover[b-ytgpnevkeb] { background: var(--rg-bg-hover); }
.dwp-btn.active[b-ytgpnevkeb] {
    background: var(--rg-text-primary);
    color: var(--rg-bg-card);
    border-color: var(--rg-text-primary);
}
[data-mode="dark"] .dwp-btn.active[b-ytgpnevkeb] {
    background: var(--rg-accent);
    color: #fff;
    border-color: var(--rg-accent);
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/ModeCardGroup.razor.rz.scp.css */
.mcg[b-17vqh6qtpw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
}
.mcg-card[b-17vqh6qtpw] {
    display: block;
    border: 2px solid var(--rg-border);
    padding: 0.85rem 1rem;
    cursor: pointer;
    background: var(--rg-bg-card);
    border-radius: 0.5rem;
    transition: all 0.15s;
}
.mcg-card:hover[b-17vqh6qtpw] { background: var(--rg-bg-hover); }
.mcg-card.selected[b-17vqh6qtpw] {
    border-color: var(--rg-accent);
    background: rgba(99,102,241,0.06);
}
[data-mode="dark"] .mcg-card.selected[b-17vqh6qtpw] { background: rgba(99,102,241,0.16); }

.mcg-card-head[b-17vqh6qtpw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}
.mcg-card-title[b-17vqh6qtpw] {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--rg-text-primary);
}
.mcg-card-desc[b-17vqh6qtpw] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    line-height: 1.45;
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Cobros/_Components/MoraProjection.razor.rz.scp.css */
/* ── Estado vacío ─────────────────────────────────── */
.mp-vacio[b-d2h2g619qb] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.85rem;
    background: rgba(22,163,74,0.08);
    border: 1px solid rgba(22,163,74,0.3);
    border-radius: 0.4rem;
    color: #166534;
    font-size: 0.85rem;
}
[data-mode="dark"] .mp-vacio[b-d2h2g619qb] { color: #86efac; }

/* ── Tabla principal ──────────────────────────────── */
.mp-table-wrap[b-d2h2g619qb] { overflow-x: auto; margin-bottom: 0.75rem; }

.mp-table[b-d2h2g619qb] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.mp-table thead th[b-d2h2g619qb] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-size: 0.67rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    padding: 0.4rem 0.65rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
}

.mp-table tbody td[b-d2h2g619qb] {
    padding: 0.38rem 0.65rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.mp-table tbody tr:last-child td[b-d2h2g619qb] { border-bottom: none; }
.mp-table tbody tr:hover td[b-d2h2g619qb] { background: var(--rg-bg-hover); }

/* ── Celdas especiales ────────────────────────────── */
.mp-id[b-d2h2g619qb]    { font-size: 0.75rem; }
.mp-fecha[b-d2h2g619qb] { font-size: 0.75rem; color: var(--rg-text-secondary); }
.text-right[b-d2h2g619qb] { text-align: right; }

.mp-ok[b-d2h2g619qb]       { color: var(--rg-text-muted); }
.mp-tasa[b-d2h2g619qb]     { color: var(--rg-text-primary); font-weight: 600; }
.mp-sin-tasa[b-d2h2g619qb] { color: var(--rg-text-muted); font-style: italic; font-size: 0.72rem; }
.mp-cero[b-d2h2g619qb]     { color: var(--rg-text-muted); }
.mp-vencida[b-d2h2g619qb] { color: #dc2626; font-weight: 700; }
[data-mode="dark"] .mp-vencida[b-d2h2g619qb] { color: #f87171; }

.mp-mora[b-d2h2g619qb] { color: #d97706; font-weight: 600; }
[data-mode="dark"] .mp-mora[b-d2h2g619qb] { color: #fcd34d; }

.mp-total-val[b-d2h2g619qb] { font-weight: 700; color: var(--rg-text-primary); }

/* ── Pie de tabla ─────────────────────────────────── */
.mp-tfoot-row td[b-d2h2g619qb] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
    font-size: 0.8rem;
    color: var(--rg-text-primary);
    padding: 0.45rem 0.65rem;
    border-top: 2px solid var(--rg-border);
}

.mp-tfoot-mora td[b-d2h2g619qb] {
    background: var(--rg-bg-subtle);
    font-size: 0.75rem;
    color: var(--rg-text-muted);
    padding: 0.35rem 0.65rem;
    border-top: 1px dashed var(--rg-border);
}

.mp-formula[b-d2h2g619qb] {
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.68rem;
    opacity: 0.75;
}

.mp-diaria[b-d2h2g619qb] { color: #d97706; font-weight: 700; }
[data-mode="dark"] .mp-diaria[b-d2h2g619qb] { color: #fcd34d; }

/* ── Tarjetas de proyección ───────────────────────── */
.mp-proj-grid[b-d2h2g619qb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
    text-align: center;
}
.mp-proj[b-d2h2g619qb] {
    padding: 0.5rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
}
.mp-proj-lbl[b-d2h2g619qb] {
    font-size: 0.62rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}
.mp-proj-val[b-d2h2g619qb] {
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-weight: 700;
    font-size: 0.85rem;
    color: #d97706;
    margin-top: 0.2rem;
}
[data-mode="dark"] .mp-proj-val[b-d2h2g619qb] { color: #fcd34d; }

.font-mono[b-d2h2g619qb] { font-family: 'Cascadia Code','Fira Code',monospace; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Crclgauditorianotas_mrt.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-jn9xmclkhc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jn9xmclkhc 0.3s ease-out; }
@keyframes slideUp-b-jn9xmclkhc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jn9xmclkhc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jn9xmclkhc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jn9xmclkhc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jn9xmclkhc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jn9xmclkhc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jn9xmclkhc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jn9xmclkhc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jn9xmclkhc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jn9xmclkhc] { filter: brightness(1.1); }
.btn-outline[b-jn9xmclkhc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jn9xmclkhc] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jn9xmclkhc] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jn9xmclkhc] { filter: brightness(1.1); }
.btn-icon[b-jn9xmclkhc] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jn9xmclkhc] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jn9xmclkhc] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jn9xmclkhc] { color: #ef4444; }
.btn-delete:hover[b-jn9xmclkhc] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-jn9xmclkhc] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jn9xmclkhc] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jn9xmclkhc] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jn9xmclkhc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jn9xmclkhc] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jn9xmclkhc] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-jn9xmclkhc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jn9xmclkhc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-jn9xmclkhc] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jn9xmclkhc] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jn9xmclkhc] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jn9xmclkhc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jn9xmclkhc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jn9xmclkhc] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jn9xmclkhc] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-jn9xmclkhc] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-jn9xmclkhc] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-jn9xmclkhc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-jn9xmclkhc] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-jn9xmclkhc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-jn9xmclkhc] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-jn9xmclkhc] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-jn9xmclkhc] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-jn9xmclkhc] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-jn9xmclkhc] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-jn9xmclkhc] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-jn9xmclkhc] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-jn9xmclkhc] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-jn9xmclkhc] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-jn9xmclkhc] { display: block; }
.hide-on-cards[b-jn9xmclkhc] { display: none !important; }
.show-on-cards[b-jn9xmclkhc] { display: grid; }
.hide-on-grid[b-jn9xmclkhc] { display: none !important; }

/* Badges */
.badge[b-jn9xmclkhc] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jn9xmclkhc] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jn9xmclkhc] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-jn9xmclkhc] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jn9xmclkhc] { text-align: center; }
.text-muted[b-jn9xmclkhc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jn9xmclkhc], .crud-empty-state[b-jn9xmclkhc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jn9xmclkhc] { font-size: 2rem; }
.crud-spinner[b-jn9xmclkhc] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jn9xmclkhc 0.6s linear infinite; }
.crud-spinner-sm[b-jn9xmclkhc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jn9xmclkhc 0.6s linear infinite; }
@keyframes spin-b-jn9xmclkhc { to { transform: rotate(360deg); } }
.spin[b-jn9xmclkhc] { animation: spin-b-jn9xmclkhc 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-jn9xmclkhc] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jn9xmclkhc 0.15s ease-out; }
.modal-container[b-jn9xmclkhc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jn9xmclkhc] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jn9xmclkhc 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-jn9xmclkhc] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-jn9xmclkhc] { max-width: 420px; }
@keyframes fadeIn-b-jn9xmclkhc { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jn9xmclkhc { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jn9xmclkhc] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jn9xmclkhc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-jn9xmclkhc] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-jn9xmclkhc] { color: #dc2626; }
.modal-close[b-jn9xmclkhc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jn9xmclkhc] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jn9xmclkhc] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jn9xmclkhc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jn9xmclkhc] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-jn9xmclkhc] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jn9xmclkhc] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jn9xmclkhc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jn9xmclkhc] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jn9xmclkhc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jn9xmclkhc] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jn9xmclkhc] { flex: 2; }
.form-group label[b-jn9xmclkhc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jn9xmclkhc], .form-group select[b-jn9xmclkhc], .form-textarea[b-jn9xmclkhc] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jn9xmclkhc], .form-group select:focus[b-jn9xmclkhc], .form-textarea:focus[b-jn9xmclkhc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jn9xmclkhc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jn9xmclkhc] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jn9xmclkhc] { flex: 1; display: flex; align-items: center; }
.form-check[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jn9xmclkhc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-jn9xmclkhc] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-jn9xmclkhc] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-jn9xmclkhc] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-jn9xmclkhc] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-jn9xmclkhc] { font-size: 3rem; }
.photo-placeholder span[b-jn9xmclkhc] { font-size: 0.78rem; }
.photo-actions[b-jn9xmclkhc] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-jn9xmclkhc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-jn9xmclkhc] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-jn9xmclkhc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-jn9xmclkhc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-jn9xmclkhc] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-jn9xmclkhc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-jn9xmclkhc] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-jn9xmclkhc] { filter: brightness(1.15); transform: scale(1.05); }
[b-jn9xmclkhc] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jn9xmclkhc] { padding: 0.75rem; }
    .crud-header[b-jn9xmclkhc] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jn9xmclkhc] { font-size: 1.1rem; }
    .btn-text[b-jn9xmclkhc] { display: none; }
    .form-row[b-jn9xmclkhc] { flex-direction: column; }
    .form-row-4[b-jn9xmclkhc] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jn9xmclkhc] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jn9xmclkhc] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-jn9xmclkhc] { padding: 0.75rem; }
    .modal-tabs[b-jn9xmclkhc] { overflow-x: auto; }
    .modal-tab[b-jn9xmclkhc] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-jn9xmclkhc] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-jn9xmclkhc] { display: grid !important; }
    .crud-cards-wrapper[b-jn9xmclkhc] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-jn9xmclkhc] { grid-template-columns: 1fr; }
    .card-details[b-jn9xmclkhc] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-jn9xmclkhc] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jn9xmclkhc] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jn9xmclkhc] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jn9xmclkhc] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Crclg_cobrosrealizados_mrt.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-d414313l0e] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-d414313l0e 0.3s ease-out; }
@keyframes slideUp-b-d414313l0e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-d414313l0e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-d414313l0e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-d414313l0e] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-d414313l0e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-d414313l0e] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-d414313l0e] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-d414313l0e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-d414313l0e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-d414313l0e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-d414313l0e] { filter: brightness(1.1); }
.btn-outline[b-d414313l0e] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-d414313l0e] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-d414313l0e] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-d414313l0e] { filter: brightness(1.1); }
.btn-icon[b-d414313l0e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-d414313l0e] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-d414313l0e] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-d414313l0e] { color: #ef4444; }
.btn-delete:hover[b-d414313l0e] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-d414313l0e] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-d414313l0e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-d414313l0e] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-d414313l0e] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-d414313l0e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-d414313l0e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-d414313l0e] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-d414313l0e] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-d414313l0e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-d414313l0e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-d414313l0e] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-d414313l0e] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-d414313l0e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-d414313l0e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-d414313l0e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-d414313l0e] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-d414313l0e] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-d414313l0e] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-d414313l0e] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-d414313l0e] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-d414313l0e] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-d414313l0e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-d414313l0e] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-d414313l0e] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-d414313l0e] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-d414313l0e] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-d414313l0e] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-d414313l0e] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-d414313l0e] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-d414313l0e] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-d414313l0e] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-d414313l0e] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-d414313l0e] { display: block; }
.hide-on-cards[b-d414313l0e] { display: none !important; }
.show-on-cards[b-d414313l0e] { display: grid; }
.hide-on-grid[b-d414313l0e] { display: none !important; }

/* Badges */
.badge[b-d414313l0e] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-d414313l0e] { background: #ecfdf5; color: #065f46; }
.badge-no[b-d414313l0e] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-d414313l0e] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-d414313l0e] { text-align: center; }
.text-muted[b-d414313l0e] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-d414313l0e], .crud-empty-state[b-d414313l0e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-d414313l0e] { font-size: 2rem; }
.crud-spinner[b-d414313l0e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-d414313l0e 0.6s linear infinite; }
.crud-spinner-sm[b-d414313l0e] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-d414313l0e 0.6s linear infinite; }
@keyframes spin-b-d414313l0e { to { transform: rotate(360deg); } }
.spin[b-d414313l0e] { animation: spin-b-d414313l0e 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-d414313l0e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-d414313l0e 0.15s ease-out; }
.modal-container[b-d414313l0e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-d414313l0e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-d414313l0e 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-d414313l0e] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-d414313l0e] { max-width: 420px; }
@keyframes fadeIn-b-d414313l0e { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-d414313l0e { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-d414313l0e] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-d414313l0e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-d414313l0e] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-d414313l0e] { color: #dc2626; }
.modal-close[b-d414313l0e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-d414313l0e] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-d414313l0e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-d414313l0e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-d414313l0e] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-d414313l0e] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-d414313l0e] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-d414313l0e] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-d414313l0e] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-d414313l0e] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-d414313l0e] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-d414313l0e] { flex: 2; }
.form-group label[b-d414313l0e] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-d414313l0e], .form-group select[b-d414313l0e], .form-textarea[b-d414313l0e] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-d414313l0e], .form-group select:focus[b-d414313l0e], .form-textarea:focus[b-d414313l0e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-d414313l0e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-d414313l0e] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-d414313l0e] { flex: 1; display: flex; align-items: center; }
.form-check[b-d414313l0e] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-d414313l0e] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-d414313l0e] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-d414313l0e] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-d414313l0e] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-d414313l0e] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-d414313l0e] { font-size: 3rem; }
.photo-placeholder span[b-d414313l0e] { font-size: 0.78rem; }
.photo-actions[b-d414313l0e] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-d414313l0e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-d414313l0e] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-d414313l0e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-d414313l0e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-d414313l0e] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-d414313l0e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-d414313l0e] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-d414313l0e] { filter: brightness(1.15); transform: scale(1.05); }
[b-d414313l0e] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-d414313l0e] { padding: 0.75rem; }
    .crud-header[b-d414313l0e] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-d414313l0e] { font-size: 1.1rem; }
    .btn-text[b-d414313l0e] { display: none; }
    .form-row[b-d414313l0e] { flex-direction: column; }
    .form-row-4[b-d414313l0e] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-d414313l0e] { width: 98%; max-height: 95vh; }
    .modal-lg[b-d414313l0e] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-d414313l0e] { padding: 0.75rem; }
    .modal-tabs[b-d414313l0e] { overflow-x: auto; }
    .modal-tab[b-d414313l0e] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-d414313l0e] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-d414313l0e] { display: grid !important; }
    .crud-cards-wrapper[b-d414313l0e] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-d414313l0e] { grid-template-columns: 1fr; }
    .card-details[b-d414313l0e] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-d414313l0e] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-d414313l0e] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-d414313l0e] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-d414313l0e] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Crparadigma2_mrt.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9y4slb986q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9y4slb986q 0.3s ease-out; }
@keyframes slideUp-b-9y4slb986q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9y4slb986q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9y4slb986q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9y4slb986q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9y4slb986q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9y4slb986q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9y4slb986q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9y4slb986q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9y4slb986q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9y4slb986q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9y4slb986q] { filter: brightness(1.1); }
.btn-outline[b-9y4slb986q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9y4slb986q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9y4slb986q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9y4slb986q] { filter: brightness(1.1); }
.btn-icon[b-9y4slb986q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9y4slb986q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9y4slb986q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9y4slb986q] { color: #ef4444; }
.btn-delete:hover[b-9y4slb986q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9y4slb986q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9y4slb986q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9y4slb986q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9y4slb986q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9y4slb986q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9y4slb986q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9y4slb986q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9y4slb986q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9y4slb986q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9y4slb986q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9y4slb986q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9y4slb986q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9y4slb986q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9y4slb986q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9y4slb986q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9y4slb986q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9y4slb986q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9y4slb986q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9y4slb986q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9y4slb986q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9y4slb986q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9y4slb986q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9y4slb986q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9y4slb986q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9y4slb986q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9y4slb986q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9y4slb986q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9y4slb986q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9y4slb986q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9y4slb986q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9y4slb986q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9y4slb986q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9y4slb986q] { display: block; }
.hide-on-cards[b-9y4slb986q] { display: none !important; }
.show-on-cards[b-9y4slb986q] { display: grid; }
.hide-on-grid[b-9y4slb986q] { display: none !important; }

/* Badges */
.badge[b-9y4slb986q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9y4slb986q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9y4slb986q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9y4slb986q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9y4slb986q] { text-align: center; }
.text-muted[b-9y4slb986q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9y4slb986q], .crud-empty-state[b-9y4slb986q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9y4slb986q] { font-size: 2rem; }
.crud-spinner[b-9y4slb986q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9y4slb986q 0.6s linear infinite; }
.crud-spinner-sm[b-9y4slb986q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9y4slb986q 0.6s linear infinite; }
@keyframes spin-b-9y4slb986q { to { transform: rotate(360deg); } }
.spin[b-9y4slb986q] { animation: spin-b-9y4slb986q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9y4slb986q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9y4slb986q 0.15s ease-out; }
.modal-container[b-9y4slb986q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9y4slb986q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9y4slb986q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9y4slb986q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9y4slb986q] { max-width: 420px; }
@keyframes fadeIn-b-9y4slb986q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9y4slb986q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9y4slb986q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9y4slb986q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9y4slb986q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9y4slb986q] { color: #dc2626; }
.modal-close[b-9y4slb986q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9y4slb986q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9y4slb986q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9y4slb986q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9y4slb986q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9y4slb986q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9y4slb986q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9y4slb986q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9y4slb986q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9y4slb986q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9y4slb986q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9y4slb986q] { flex: 2; }
.form-group label[b-9y4slb986q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9y4slb986q], .form-group select[b-9y4slb986q], .form-textarea[b-9y4slb986q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9y4slb986q], .form-group select:focus[b-9y4slb986q], .form-textarea:focus[b-9y4slb986q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9y4slb986q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9y4slb986q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9y4slb986q] { flex: 1; display: flex; align-items: center; }
.form-check[b-9y4slb986q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9y4slb986q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9y4slb986q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9y4slb986q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9y4slb986q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9y4slb986q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9y4slb986q] { font-size: 3rem; }
.photo-placeholder span[b-9y4slb986q] { font-size: 0.78rem; }
.photo-actions[b-9y4slb986q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9y4slb986q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9y4slb986q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9y4slb986q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9y4slb986q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9y4slb986q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9y4slb986q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9y4slb986q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9y4slb986q] { filter: brightness(1.15); transform: scale(1.05); }
[b-9y4slb986q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9y4slb986q] { padding: 0.75rem; }
    .crud-header[b-9y4slb986q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9y4slb986q] { font-size: 1.1rem; }
    .btn-text[b-9y4slb986q] { display: none; }
    .form-row[b-9y4slb986q] { flex-direction: column; }
    .form-row-4[b-9y4slb986q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9y4slb986q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9y4slb986q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9y4slb986q] { padding: 0.75rem; }
    .modal-tabs[b-9y4slb986q] { overflow-x: auto; }
    .modal-tab[b-9y4slb986q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9y4slb986q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9y4slb986q] { display: grid !important; }
    .crud-cards-wrapper[b-9y4slb986q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9y4slb986q] { grid-template-columns: 1fr; }
    .card-details[b-9y4slb986q] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9y4slb986q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9y4slb986q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9y4slb986q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9y4slb986q] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_actividades.razor.rz.scp.css */
/* CSS compartido para todas las pantallas EC — copiado del patrón canónico */
.crud-container[b-7hk2hepbzo] { padding: 1.25rem; animation: slideUp-b-7hk2hepbzo 0.3s ease-out; }
@keyframes slideUp-b-7hk2hepbzo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-7hk2hepbzo] { animation: slideUp-b-7hk2hepbzo 0.3s ease-out; }

.crud-header[b-7hk2hepbzo] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7hk2hepbzo] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7hk2hepbzo] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-7hk2hepbzo] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-7hk2hepbzo] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-7hk2hepbzo] { display: flex; gap: 0.5rem; }

.btn-crud[b-7hk2hepbzo] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-7hk2hepbzo] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7hk2hepbzo] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-7hk2hepbzo] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-7hk2hepbzo] { background: var(--rg-bg-hover); }
.btn-danger[b-7hk2hepbzo] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-7hk2hepbzo] { background: rgba(220,38,38,0.1); }
.btn-icon[b-7hk2hepbzo] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; background: transparent; }
.btn-edit[b-7hk2hepbzo] { color: var(--rg-accent); }
.btn-edit:hover[b-7hk2hepbzo] { background: rgba(99,102,241,0.1); }
.btn-delete[b-7hk2hepbzo] { color: #dc2626; }
.btn-delete:hover[b-7hk2hepbzo] { background: rgba(220,38,38,0.1); }
.btn-text[b-7hk2hepbzo] { display: inline; }
@media (max-width: 768px) { .btn-text[b-7hk2hepbzo] { display: none; } }

.crud-alert[b-7hk2hepbzo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-7hk2hepbzo] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-7hk2hepbzo]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-7hk2hepbzo]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-7hk2hepbzo] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-7hk2hepbzo] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-7hk2hepbzo]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-7hk2hepbzo]    { color: #93c5fd; }

.crud-search-bar[b-7hk2hepbzo] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-input); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.25rem 0.5rem; }
.crud-search-bar input[b-7hk2hepbzo] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.85rem; padding: 0.4rem 0.25rem; outline: none; }
.crud-search-btn[b-7hk2hepbzo] { background: transparent; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.35rem 0.5rem; border-radius: 0.25rem; }
.crud-search-btn:hover[b-7hk2hepbzo] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.crud-count[b-7hk2hepbzo] { font-size: 0.72rem; color: var(--rg-text-muted); margin-left: 0.5rem; }
.check-inline[b-7hk2hepbzo] { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.78rem; color: var(--rg-text-secondary); margin-left: 0.5rem; }

.crud-grid-wrapper[b-7hk2hepbzo] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-7hk2hepbzo] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-7hk2hepbzo] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7hk2hepbzo] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table th.text-right[b-7hk2hepbzo] { text-align: right; }
.crud-table td[b-7hk2hepbzo] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table td.text-right[b-7hk2hepbzo] { text-align: right; font-variant-numeric: tabular-nums; }
.crud-table tbody tr:hover[b-7hk2hepbzo] { background: var(--rg-bg-hover); }
.col-actions[b-7hk2hepbzo] { width: 80px; text-align: center; }

.font-mono[b-7hk2hepbzo] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-7hk2hepbzo] { text-align: right; }

.badge[b-7hk2hepbzo] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge-yes[b-7hk2hepbzo] { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-7hk2hepbzo]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
[data-mode="dark"] .badge-yes[b-7hk2hepbzo] { color: #86efac; }

.crud-loading[b-7hk2hepbzo], .crud-empty-state[b-7hk2hepbzo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-7hk2hepbzo] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: ec-spin-b-7hk2hepbzo 0.6s linear infinite; }
@keyframes ec-spin-b-7hk2hepbzo { to { transform: rotate(360deg); } }
.spin[b-7hk2hepbzo] { animation: ec-spin-b-7hk2hepbzo 0.8s linear infinite; display: inline-block; }

.modal-backdrop[b-7hk2hepbzo] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-7hk2hepbzo] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-7hk2hepbzo] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 92vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-7hk2hepbzo] { max-width: 480px; }
.modal-lg[b-7hk2hepbzo] { max-width: 800px; }
.modal-header[b-7hk2hepbzo] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-7hk2hepbzo] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7hk2hepbzo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-7hk2hepbzo] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-7hk2hepbzo] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-footer[b-7hk2hepbzo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }

.form-row[b-7hk2hepbzo] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-7hk2hepbzo] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-7hk2hepbzo] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-row.form-row-3[b-7hk2hepbzo] { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.75rem; }
.form-input[b-7hk2hepbzo], select.form-input[b-7hk2hepbzo] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-input:focus[b-7hk2hepbzo] { border-color: var(--rg-accent); }

.form-hint[b-7hk2hepbzo] { padding: 0.55rem 0.85rem; background: rgba(37,99,235,0.08); border: 1px solid rgba(37,99,235,0.3); border-radius: 0.4rem; font-size: 0.78rem; color: #1e40af; }
[data-mode="dark"] .form-hint[b-7hk2hepbzo] { color: #93c5fd; }

/* Selector de cuenta contable */
.cuenta-hint[b-7hk2hepbzo] { margin-left: 0.5rem; font-size: 0.62rem; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; font-weight: 500; }
.cuenta-picker[b-7hk2hepbzo] { display: flex; flex-direction: column; gap: 0.4rem; }
.cuenta-search[b-7hk2hepbzo] { font-size: 0.8rem; }
.cuenta-empty[b-7hk2hepbzo] { font-size: 0.72rem; color: var(--rg-text-muted); margin-top: 0.25rem; }

/* Celda de cuenta en grid */
.cuenta-cod[b-7hk2hepbzo] { font-weight: 600; color: var(--rg-text-primary); margin-right: 0.4rem; font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.74rem; }
.cuenta-desc[b-7hk2hepbzo] { font-size: 0.72rem; color: var(--rg-text-muted); }
.cuenta-sin[b-7hk2hepbzo] { font-size: 0.72rem; color: var(--rg-text-muted); font-style: italic; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_caja.razor.rz.scp.css */
.crud-container[b-vcvilft7kc] { padding: 1.25rem; animation: slideUp-b-vcvilft7kc 0.3s ease-out; }
@keyframes slideUp-b-vcvilft7kc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-vcvilft7kc] { animation: slideUp-b-vcvilft7kc 0.3s ease-out; }

.crud-header[b-vcvilft7kc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vcvilft7kc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vcvilft7kc] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-vcvilft7kc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-vcvilft7kc] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-vcvilft7kc] { display: flex; gap: 0.5rem; }

.btn-crud[b-vcvilft7kc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-vcvilft7kc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vcvilft7kc] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-vcvilft7kc] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-vcvilft7kc] { background: var(--rg-bg-hover); }
.btn-text[b-vcvilft7kc] { display: inline; }
@media (max-width: 768px) { .btn-text[b-vcvilft7kc] { display: none; } }

.crud-alert[b-vcvilft7kc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-vcvilft7kc] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-vcvilft7kc]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert.info[b-vcvilft7kc]    { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert-close[b-vcvilft7kc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-vcvilft7kc] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-vcvilft7kc]   { color: #fca5a5; }
[data-mode="dark"] .crud-alert.info[b-vcvilft7kc]    { color: #93c5fd; }

.crud-empty-state[b-vcvilft7kc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 1rem; gap: 1rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-vcvilft7kc] { font-size: 2.5rem; color: var(--rg-text-muted); }
.crud-empty-state h3[b-vcvilft7kc] { color: var(--rg-text-primary); font-size: 1.05rem; margin: 0; }
.crud-empty-state p[b-vcvilft7kc] { margin: 0; max-width: 24rem; font-size: 0.85rem; }

.caja-grid-2[b-vcvilft7kc] { display: grid; grid-template-columns: 1.1fr 1fr; gap: 1.25rem; margin-bottom: 1.5rem; }
@media (max-width: 992px) { .caja-grid-2[b-vcvilft7kc] { grid-template-columns: 1fr; } }

.caja-panel[b-vcvilft7kc] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: hidden; }
.caja-panel-head[b-vcvilft7kc] { padding: 0.75rem 1rem; border-bottom: 1px solid var(--rg-border); background: var(--rg-bg-subtle); }
.caja-panel-head h2[b-vcvilft7kc] { margin: 0; font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.caja-panel-body[b-vcvilft7kc] { padding: 1rem; }

.form-row[b-vcvilft7kc] { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.75rem; }
.form-row label[b-vcvilft7kc] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-row.form-row-h[b-vcvilft7kc] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.form-input[b-vcvilft7kc], select.form-input[b-vcvilft7kc] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-input:focus[b-vcvilft7kc] { border-color: var(--rg-accent); }

.caja-amount[b-vcvilft7kc] { font-size: 1.15rem; font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; padding: 0.65rem 0.85rem; }
.caja-max-hint[b-vcvilft7kc] { margin-left: 0.5rem; font-size: 0.62rem; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; font-weight: 500; }
.caja-max-hint strong[b-vcvilft7kc] { color: var(--rg-text-secondary); font-family: 'Cascadia Code','Fira Code',monospace; }
.caja-amount-row[b-vcvilft7kc] { display: flex; gap: 0.5rem; align-items: stretch; }
.caja-amount-row .caja-amount[b-vcvilft7kc] { flex: 1; }
.btn-pagar-todo[b-vcvilft7kc] { white-space: nowrap; padding: 0.5rem 0.85rem; font-size: 0.78rem; }
.caja-amount-error[b-vcvilft7kc] { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.4rem; padding: 0.45rem 0.65rem; background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); border-radius: 0.4rem; font-size: 0.78rem; }
[data-mode="dark"] .caja-amount-error[b-vcvilft7kc] { color: #fca5a5; }

.caja-buttons-row[b-vcvilft7kc] { display: flex; gap: 0.5rem; margin-top: 1rem; }

/* Cuotas */
.cuotas-table[b-vcvilft7kc] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.cuotas-table th[b-vcvilft7kc] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.55rem 0.75rem; border-bottom: 1px solid var(--rg-border); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.05em; }
.cuotas-table th.text-right[b-vcvilft7kc] { text-align: right; }
.cuotas-table td[b-vcvilft7kc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.cuotas-table td.text-right[b-vcvilft7kc] { text-align: right; font-variant-numeric: tabular-nums; }
.cuotas-table tr.row-tocada td[b-vcvilft7kc] { background: rgba(22,163,74,0.05); }

.aplicar-preview[b-vcvilft7kc] { color: #16a34a; font-weight: 700; }
[data-mode="dark"] .aplicar-preview[b-vcvilft7kc] { color: #86efac; }

.font-mono[b-vcvilft7kc] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-vcvilft7kc] { text-align: right; }

.badge[b-vcvilft7kc] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; border: 1px solid; }
.badge-vigente[b-vcvilft7kc]  { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-pagada[b-vcvilft7kc]   { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-atrasada[b-vcvilft7kc] { background: rgba(220,38,38,0.12); color: #991b1b; border-color: rgba(220,38,38,0.3); }
.badge-no[b-vcvilft7kc]       { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
[data-mode="dark"] .badge-vigente[b-vcvilft7kc]  { color: #93c5fd; }
[data-mode="dark"] .badge-pagada[b-vcvilft7kc]   { color: #86efac; }
[data-mode="dark"] .badge-atrasada[b-vcvilft7kc] { color: #fca5a5; }

/* EvidenciaPhoto */
.cobro-section[b-vcvilft7kc] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; margin: 1rem 0; }
.cobro-section-header[b-vcvilft7kc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.85rem; border-bottom: 1px solid var(--rg-border); }
.cobro-section-icon[b-vcvilft7kc] { color: var(--rg-accent); font-size: 1rem; }
.cobro-section-title[b-vcvilft7kc] { flex: 1; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-primary); text-transform: uppercase; letter-spacing: 0.05em; }
.cobro-evid-actions[b-vcvilft7kc] { display: flex; gap: 0.4rem; }
.cobro-qr-btn[b-vcvilft7kc] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.35rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.35rem; background: var(--rg-bg-card); color: var(--rg-text-secondary); font-size: 0.72rem; font-weight: 600; cursor: pointer; }
.cobro-qr-btn:hover[b-vcvilft7kc] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.cobro-qr-btn.uploading[b-vcvilft7kc] { opacity: 0.7; cursor: progress; }
.cobro-evid-hint[b-vcvilft7kc] { padding: 0.5rem 0.85rem; font-size: 0.72rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.4rem; }

/* Post-save nested */
.modal-backdrop-nested[b-vcvilft7kc] { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 2000; }
.modal-container-nested[b-vcvilft7kc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 2001; padding: 1rem; pointer-events: none; }
.modal-dialog-nested[b-vcvilft7kc] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
.ps-modal[b-vcvilft7kc] { max-width: 380px; }
.modal-header[b-vcvilft7kc] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-vcvilft7kc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-vcvilft7kc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-vcvilft7kc] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-vcvilft7kc] { padding: 1rem 1.25rem; }
.modal-footer[b-vcvilft7kc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); }

.ps-recibo-info[b-vcvilft7kc] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.6rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.6rem 0.8rem; margin-bottom: 0.5rem; }
.ps-label[b-vcvilft7kc] { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--rg-text-muted); }
.ps-value[b-vcvilft7kc] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-acciones[b-vcvilft7kc] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.75rem; }
.ps-acciones .btn-crud[b-vcvilft7kc] { width: 100%; justify-content: center; }

.spin[b-vcvilft7kc] { animation: ec-spin-b-vcvilft7kc 0.8s linear infinite; display: inline-block; }
@keyframes ec-spin-b-vcvilft7kc { to { transform: rotate(360deg); } }

/* ── Modales base (backdrop + container) ───────────────────── */
.modal-backdrop[b-vcvilft7kc] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1050;
}
.modal-container[b-vcvilft7kc] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1051; padding: 1rem; pointer-events: none;
}
.modal-dialog[b-vcvilft7kc] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.modal-sm[b-vcvilft7kc]  { max-width: 480px; }
.modal-lg[b-vcvilft7kc]  { max-width: 860px; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_cobros_realizados.razor.rz.scp.css */
.crud-container[b-7ua6h68o0e] { padding: 1.25rem; animation: slideUp-b-7ua6h68o0e 0.3s ease-out; }
@keyframes slideUp-b-7ua6h68o0e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-7ua6h68o0e] { animation: slideUp-b-7ua6h68o0e 0.3s ease-out; }

.crud-header[b-7ua6h68o0e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7ua6h68o0e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7ua6h68o0e] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-7ua6h68o0e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-7ua6h68o0e] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-7ua6h68o0e] { display: flex; gap: 0.5rem; }

.btn-crud[b-7ua6h68o0e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; background: transparent; color: var(--rg-text-secondary); }
.btn-primary[b-7ua6h68o0e] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-7ua6h68o0e] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-7ua6h68o0e] { background: var(--rg-bg-hover); }
.btn-icon[b-7ua6h68o0e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; background: transparent; }
.btn-view[b-7ua6h68o0e] { color: #dc2626; }
.btn-view:hover[b-7ua6h68o0e] { background: rgba(220,38,38,0.1); }
.btn-text[b-7ua6h68o0e] { display: inline; }
@media (max-width: 768px) { .btn-text[b-7ua6h68o0e] { display: none; } }

.crud-alert[b-7ua6h68o0e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.info[b-7ua6h68o0e] { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert.success[b-7ua6h68o0e] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-7ua6h68o0e] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-7ua6h68o0e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.info[b-7ua6h68o0e] { color: #93c5fd; }
[data-mode="dark"] .crud-alert.success[b-7ua6h68o0e] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-7ua6h68o0e] { color: #fca5a5; }

.filtros-bar[b-7ua6h68o0e] { display: flex; align-items: flex-end; gap: 0.6rem; padding: 0.75rem; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; flex-wrap: wrap; }
.filtro-item[b-7ua6h68o0e] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-7ua6h68o0e] { font-size: 0.65rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.filtros-count[b-7ua6h68o0e] { margin-left: auto; font-size: 0.78rem; color: var(--rg-text-muted); }
.form-input[b-7ua6h68o0e] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }

.crud-grid-wrapper[b-7ua6h68o0e] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 420px); }
.crud-table[b-7ua6h68o0e] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-7ua6h68o0e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7ua6h68o0e] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table th.text-right[b-7ua6h68o0e] { text-align: right; }
.crud-table td[b-7ua6h68o0e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table td.text-right[b-7ua6h68o0e] { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.crud-table tbody tr:hover[b-7ua6h68o0e] { background: var(--rg-bg-hover); }
.crud-table tbody tr.row-anulado td[b-7ua6h68o0e] { opacity: 0.6; text-decoration: line-through; }
.col-actions[b-7ua6h68o0e] { width: 60px; text-align: center; }

.font-mono[b-7ua6h68o0e] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-7ua6h68o0e] { text-align: right; }

.badge[b-7ua6h68o0e] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; border: 1px solid; }
.badge-metodo[b-7ua6h68o0e]  { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-pagada[b-7ua6h68o0e]  { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-atrasada[b-7ua6h68o0e] { background: rgba(220,38,38,0.12); color: #991b1b; border-color: rgba(220,38,38,0.3); }
[data-mode="dark"] .badge-metodo[b-7ua6h68o0e]  { color: #93c5fd; }
[data-mode="dark"] .badge-pagada[b-7ua6h68o0e]  { color: #86efac; }
[data-mode="dark"] .badge-atrasada[b-7ua6h68o0e] { color: #fca5a5; }

.crud-loading[b-7ua6h68o0e], .crud-empty-state[b-7ua6h68o0e] { display: flex; flex-direction: column; align-items: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-7ua6h68o0e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: cr-spin-b-7ua6h68o0e 0.6s linear infinite; }
@keyframes cr-spin-b-7ua6h68o0e { to { transform: rotate(360deg); } }
.spin[b-7ua6h68o0e] { animation: cr-spin-b-7ua6h68o0e 0.8s linear infinite; display: inline-block; }

/* ── Cuadres ─────────────────────────────────────────────── */
.cuadres-grid[b-7ua6h68o0e] {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1.2fr 1.1fr;
    gap: 1rem;
    margin-top: 1rem;
}
@media (max-width: 1500px) { .cuadres-grid[b-7ua6h68o0e] { grid-template-columns: 1fr 1fr; } }
@media (max-width: 900px)  { .cuadres-grid[b-7ua6h68o0e] { grid-template-columns: 1fr; } }

.cuadre-panel[b-7ua6h68o0e] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: clip;
}
.cuadre-head[b-7ua6h68o0e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}
.cuadre-head h3[b-7ua6h68o0e] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cuadre-hint[b-7ua6h68o0e] { font-size: 0.8rem; color: var(--rg-text-secondary); font-variant-numeric: tabular-nums; }
.cuadre-scroll[b-7ua6h68o0e] { overflow-x: auto; width: 100%; }
.cuadre-scroll .cuadre-table[b-7ua6h68o0e] { min-width: 100%; }
.cuadre-table[b-7ua6h68o0e] { border: none; white-space: nowrap; }
.cuadre-table th[b-7ua6h68o0e], .cuadre-table td[b-7ua6h68o0e] { border-bottom: 1px solid var(--rg-border); }
.cuadre-table tbody tr:last-child td[b-7ua6h68o0e] { border-bottom: none; background: var(--rg-bg-subtle); font-weight: 600; }
.cuadres-grid .cuadre-table th[b-7ua6h68o0e],
.cuadres-grid .cuadre-table td[b-7ua6h68o0e] { font-size: 0.78rem; padding: 0.35rem 0.5rem; }
.ncf-label-cell[b-7ua6h68o0e] { font-size: 0.75rem; color: var(--rg-text-secondary); }

.ncf-tipo-badge[b-7ua6h68o0e] {
    display: inline-flex; align-items: center;
    padding: 0.15rem 0.55rem;
    background: rgba(37,99,235,0.12); color: #1e40af;
    border: 1px solid rgba(37,99,235,0.3);
    border-radius: 1rem;
    font-size: 0.68rem; font-weight: 700;
    font-family: 'Cascadia Code','Fira Code',monospace;
}
[data-mode="dark"] .ncf-tipo-badge[b-7ua6h68o0e] { color: #93c5fd; }

.tipo-doc-badge[b-7ua6h68o0e] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 0.3rem;
    font-size: 0.7rem; font-weight: 700;
    font-family: 'Cascadia Code','Fira Code',monospace;
    border: 1px solid transparent;
}
.tipo-doc-badge.tipo-rc[b-7ua6h68o0e] { background: rgba(37,99,235,0.12); color: #1d4ed8; border-color: rgba(37,99,235,0.3); }
.tipo-doc-badge.tipo-nc[b-7ua6h68o0e] { background: rgba(22,163,74,0.12);  color: #15803d; border-color: rgba(22,163,74,0.3); }
[data-mode="dark"] .tipo-doc-badge.tipo-rc[b-7ua6h68o0e] { color: #93c5fd; }
[data-mode="dark"] .tipo-doc-badge.tipo-nc[b-7ua6h68o0e] { color: #86efac; }

.marca-badge[b-7ua6h68o0e] {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.15rem 0.55rem;
    border-radius: 0.3rem;
    font-size: 0.72rem; font-weight: 600;
    background: rgba(168,85,247,0.12); color: #7e22ce;
    border: 1px solid rgba(168,85,247,0.3);
}
[data-mode="dark"] .marca-badge[b-7ua6h68o0e] { color: #d8b4fe; }
.marca-badge i[b-7ua6h68o0e] { font-size: 0.85rem; }

.cuadre-empty[b-7ua6h68o0e] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 0.5rem; padding: 1.5rem 1rem;
    color: var(--rg-text-muted); font-size: 0.82rem;
}
.cuadre-empty i[b-7ua6h68o0e] { font-size: 1.6rem; opacity: 0.4; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_descuentos_bandeja.razor.rz.scp.css */
.crud-container[b-ztyj6rh1j3] { padding: 1.25rem; animation: slideUp-b-ztyj6rh1j3 0.3s ease-out; }
@keyframes slideUp-b-ztyj6rh1j3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-ztyj6rh1j3] { animation: slideUp-b-ztyj6rh1j3 0.3s ease-out; }

.crud-header[b-ztyj6rh1j3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ztyj6rh1j3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ztyj6rh1j3] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-ztyj6rh1j3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-ztyj6rh1j3] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-ztyj6rh1j3] { display: flex; gap: 0.5rem; }

.btn-crud[b-ztyj6rh1j3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-ztyj6rh1j3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ztyj6rh1j3] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-success[b-ztyj6rh1j3] { background: #16a34a; color: #fff; border-color: #16a34a; }
.btn-success:hover:not(:disabled)[b-ztyj6rh1j3] { filter: brightness(1.1); }
.btn-danger[b-ztyj6rh1j3] { background: transparent; color: #dc2626; border-color: #dc2626; }
.btn-danger:hover:not(:disabled)[b-ztyj6rh1j3] { background: rgba(220,38,38,0.1); }
.btn-outline:hover:not(:disabled)[b-ztyj6rh1j3] { background: var(--rg-bg-hover); }
.btn-icon[b-ztyj6rh1j3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; background: transparent; }
.btn-approve[b-ztyj6rh1j3] { color: #16a34a; }
.btn-approve:hover[b-ztyj6rh1j3] { background: rgba(22,163,74,0.1); }
.btn-delete[b-ztyj6rh1j3]  { color: #dc2626; }
.btn-delete:hover[b-ztyj6rh1j3]  { background: rgba(220,38,38,0.1); }
.btn-view[b-ztyj6rh1j3]    { color: var(--rg-text-secondary); }
.btn-view:hover[b-ztyj6rh1j3]    { background: var(--rg-bg-hover); }

.btn-text[b-ztyj6rh1j3] { display: inline; }
@media (max-width: 768px) { .btn-text[b-ztyj6rh1j3] { display: none; } }

.crud-alert[b-ztyj6rh1j3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-ztyj6rh1j3] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-ztyj6rh1j3]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-ztyj6rh1j3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-ztyj6rh1j3] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-ztyj6rh1j3]   { color: #fca5a5; }

.crud-grid-wrapper[b-ztyj6rh1j3] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-ztyj6rh1j3] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-ztyj6rh1j3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ztyj6rh1j3] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table th.text-right[b-ztyj6rh1j3] { text-align: right; }
.crud-table td[b-ztyj6rh1j3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table td.text-right[b-ztyj6rh1j3] { text-align: right; font-variant-numeric: tabular-nums; }
.col-actions[b-ztyj6rh1j3] { width: 110px; text-align: center; }

.font-mono[b-ztyj6rh1j3] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.crud-loading[b-ztyj6rh1j3], .crud-empty-state[b-ztyj6rh1j3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-ztyj6rh1j3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: db-spin-b-ztyj6rh1j3 0.6s linear infinite; }
@keyframes db-spin-b-ztyj6rh1j3 { to { transform: rotate(360deg); } }
.spin[b-ztyj6rh1j3] { animation: db-spin-b-ztyj6rh1j3 0.8s linear infinite; display: inline-block; }

.modal-backdrop[b-ztyj6rh1j3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 1000; }
.modal-container[b-ztyj6rh1j3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; padding: 1rem; pointer-events: none; }
.modal-dialog[b-ztyj6rh1j3] { pointer-events: auto; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; width: 100%; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-ztyj6rh1j3] { max-width: 480px; }
.modal-header[b-ztyj6rh1j3] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-ztyj6rh1j3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ztyj6rh1j3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem; }
.modal-close:hover[b-ztyj6rh1j3] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-ztyj6rh1j3] { padding: 1.25rem; overflow-y: auto; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-footer[b-ztyj6rh1j3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; background: var(--rg-bg-subtle); border-top: 1px solid var(--rg-border); }

.modal-info[b-ztyj6rh1j3] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.75rem; font-size: 0.82rem; display: flex; flex-direction: column; gap: 0.25rem; }
.modal-info strong[b-ztyj6rh1j3] { color: var(--rg-text-primary); }

.form-row[b-ztyj6rh1j3] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-ztyj6rh1j3] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-input[b-ztyj6rh1j3] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; font-family: inherit; }
.form-input:focus[b-ztyj6rh1j3] { border-color: var(--rg-accent); }
textarea.form-input[b-ztyj6rh1j3] { resize: vertical; min-height: 60px; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_inscripciones.razor.rz.scp.css */
/* Hereda base CRUD + filtros + badges */
.crud-container[b-ndbchutow4] { padding: 1.25rem; animation: slideUp-b-ndbchutow4 0.3s ease-out; }
@keyframes slideUp-b-ndbchutow4 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-ndbchutow4] { animation: slideUp-b-ndbchutow4 0.3s ease-out; }

.crud-header[b-ndbchutow4] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ndbchutow4] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ndbchutow4] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-ndbchutow4] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-ndbchutow4] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-ndbchutow4] { display: flex; gap: 0.5rem; }

.btn-crud[b-ndbchutow4] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-ndbchutow4] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ndbchutow4] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-ndbchutow4] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-ndbchutow4] { background: var(--rg-bg-hover); }
.btn-icon[b-ndbchutow4] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.4rem; cursor: pointer; background: transparent; }
.btn-edit[b-ndbchutow4] { color: var(--rg-accent); }
.btn-edit:hover[b-ndbchutow4] { background: rgba(99,102,241,0.1); }
.btn-cobrar[b-ndbchutow4] { color: #16a34a; }
.btn-cobrar:hover[b-ndbchutow4] { background: rgba(22,163,74,0.1); }

.btn-text[b-ndbchutow4] { display: inline; }
@media (max-width: 768px) { .btn-text[b-ndbchutow4] { display: none; } }

.crud-alert[b-ndbchutow4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.info[b-ndbchutow4] { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert.success[b-ndbchutow4] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-ndbchutow4] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-ndbchutow4] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.info[b-ndbchutow4] { color: #93c5fd; }
[data-mode="dark"] .crud-alert.success[b-ndbchutow4] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-ndbchutow4] { color: #fca5a5; }

.filtros-bar[b-ndbchutow4] { display: flex; align-items: flex-end; gap: 0.6rem; padding: 0.75rem; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; flex-wrap: wrap; }
.filtro-item[b-ndbchutow4] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-ndbchutow4] { font-size: 0.65rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.filtros-count[b-ndbchutow4] { margin-left: auto; font-size: 0.78rem; color: var(--rg-text-muted); }
.form-input[b-ndbchutow4] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }

.crud-grid-wrapper[b-ndbchutow4] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-ndbchutow4] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.crud-table thead[b-ndbchutow4] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ndbchutow4] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.6rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; }
.crud-table th.text-right[b-ndbchutow4] { text-align: right; }
.crud-table td[b-ndbchutow4] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table td.text-right[b-ndbchutow4] { text-align: right; font-variant-numeric: tabular-nums; }
.crud-table tbody tr.row-clickable[b-ndbchutow4] { cursor: pointer; }
.crud-table tbody tr.row-clickable:hover td[b-ndbchutow4] { background: var(--rg-bg-hover); }
.col-actions[b-ndbchutow4] { width: 90px; text-align: center; }

.font-mono[b-ndbchutow4] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.badge[b-ndbchutow4] { display: inline-flex; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.64rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; border: 1px solid; }
.badge[b-ndbchutow4]::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; align-self: center; }
.badge-yes[b-ndbchutow4]       { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-ndbchutow4]        { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-info[b-ndbchutow4]      { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-pendiente[b-ndbchutow4] { background: rgba(217,119,6,0.12); color: #92400e; border-color: rgba(217,119,6,0.3); }
.badge-aprobada[b-ndbchutow4]  { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-rechazada[b-ndbchutow4] { background: rgba(220,38,38,0.12); color: #991b1b; border-color: rgba(220,38,38,0.3); }
.badge-neutral[b-ndbchutow4]   { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
[data-mode="dark"] .badge-yes[b-ndbchutow4]       { color: #86efac; }
[data-mode="dark"] .badge-info[b-ndbchutow4]      { color: #93c5fd; }
[data-mode="dark"] .badge-pendiente[b-ndbchutow4] { color: #fcd34d; }
[data-mode="dark"] .badge-aprobada[b-ndbchutow4]  { color: #86efac; }
[data-mode="dark"] .badge-rechazada[b-ndbchutow4] { color: #fca5a5; }

.crud-loading[b-ndbchutow4], .crud-empty-state[b-ndbchutow4] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-ndbchutow4] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: ei-spin-b-ndbchutow4 0.6s linear infinite; }
@keyframes ei-spin-b-ndbchutow4 { to { transform: rotate(360deg); } }
.spin[b-ndbchutow4] { animation: ei-spin-b-ndbchutow4 0.8s linear infinite; display: inline-block; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_inscripcion_detalle.razor.rz.scp.css */
.crud-container[b-klhvopngya] { padding: 1.25rem; animation: slideUp-b-klhvopngya 0.3s ease-out; }
@keyframes slideUp-b-klhvopngya { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-klhvopngya] { animation: slideUp-b-klhvopngya 0.3s ease-out; }

.crud-header[b-klhvopngya] { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-klhvopngya] { display: flex; align-items: flex-start; gap: 0.75rem; }
.crud-header-icon[b-klhvopngya] { font-size: 1.75rem; color: var(--rg-accent); margin-top: 0.2rem; }
.crud-title[b-klhvopngya] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.meta-row[b-klhvopngya] { display: flex; gap: 1.25rem; margin-top: 0.4rem; font-size: 0.78rem; color: var(--rg-text-muted); flex-wrap: wrap; }
.meta-row b[b-klhvopngya] { color: var(--rg-text-primary); font-weight: 600; margin-right: 0.3rem; }
.crud-header-actions[b-klhvopngya] { display: flex; gap: 0.5rem; }

.btn-crud[b-klhvopngya] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-primary[b-klhvopngya] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-klhvopngya] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-klhvopngya] { background: var(--rg-bg-hover); }
.btn-text[b-klhvopngya] { display: inline; }
@media (max-width: 768px) { .btn-text[b-klhvopngya] { display: none; } }

.crud-alert[b-klhvopngya] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.info[b-klhvopngya] { background: rgba(37,99,235,0.1); color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }

.det-grid[b-klhvopngya] { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1.25rem; }
@media (max-width: 992px) { .det-grid[b-klhvopngya] { grid-template-columns: 1fr; } }

.det-panel[b-klhvopngya] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: hidden; }
.det-panel-head[b-klhvopngya] { padding: 0.7rem 1rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.det-panel-head h3[b-klhvopngya] { margin: 0; font-size: 0.9rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.det-panel-body[b-klhvopngya] { padding: 0; }

.det-table[b-klhvopngya] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.det-table th[b-klhvopngya] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.05em; }
.det-table th.text-right[b-klhvopngya] { text-align: right; }
.det-table td[b-klhvopngya] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.det-table td.text-right[b-klhvopngya] { text-align: right; font-variant-numeric: tabular-nums; }
.det-table tbody tr:hover[b-klhvopngya] { background: var(--rg-bg-hover); }
.det-table tbody tr.row-anulado td[b-klhvopngya] { opacity: 0.6; text-decoration: line-through; }

.det-empty[b-klhvopngya] { display: flex; flex-direction: column; align-items: center; padding: 2rem; gap: 0.5rem; color: var(--rg-text-muted); }
.det-empty i[b-klhvopngya] { font-size: 2rem; }

.crud-loading[b-klhvopngya], .crud-empty-state[b-klhvopngya] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); text-align: center; }
.crud-spinner[b-klhvopngya] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: dt-spin-b-klhvopngya 0.6s linear infinite; }
@keyframes dt-spin-b-klhvopngya { to { transform: rotate(360deg); } }

.font-mono[b-klhvopngya] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-right[b-klhvopngya] { text-align: right; }

.badge[b-klhvopngya] { display: inline-flex; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.62rem; font-weight: 700; text-transform: uppercase; border: 1px solid; }
.badge-yes[b-klhvopngya]      { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-no[b-klhvopngya]       { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border-color: var(--rg-border); }
.badge-info[b-klhvopngya]     { background: rgba(37,99,235,0.12); color: #1e40af; border-color: rgba(37,99,235,0.3); }
.badge-pagada[b-klhvopngya]   { background: rgba(22,163,74,0.12); color: #166534; border-color: rgba(22,163,74,0.3); }
.badge-atrasada[b-klhvopngya] { background: rgba(220,38,38,0.12); color: #991b1b; border-color: rgba(220,38,38,0.3); }
[data-mode="dark"] .badge-yes[b-klhvopngya]      { color: #86efac; }
[data-mode="dark"] .badge-info[b-klhvopngya]     { color: #93c5fd; }
[data-mode="dark"] .badge-pagada[b-klhvopngya]   { color: #86efac; }
[data-mode="dark"] .badge-atrasada[b-klhvopngya] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Extracurricular/Frmclg_ec_inscripcion_nueva.razor.rz.scp.css */
.crud-container[b-pd19494scb] { padding: 1.25rem; animation: slideUp-b-pd19494scb 0.3s ease-out; }
@keyframes slideUp-b-pd19494scb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-pd19494scb] { animation: slideUp-b-pd19494scb 0.3s ease-out; }

.crud-header[b-pd19494scb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pd19494scb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pd19494scb] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-pd19494scb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-pd19494scb] { font-size: 0.78rem; color: var(--rg-text-muted); }
.crud-header-actions[b-pd19494scb] { display: flex; gap: 0.5rem; }

.btn-crud[b-pd19494scb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-pd19494scb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pd19494scb] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-pd19494scb] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-pd19494scb] { background: var(--rg-bg-hover); }
.btn-text[b-pd19494scb] { display: inline; }
@media (max-width: 768px) { .btn-text[b-pd19494scb] { display: none; } }

.crud-alert[b-pd19494scb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; }
.crud-alert.success[b-pd19494scb] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-pd19494scb]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-pd19494scb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-pd19494scb] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-pd19494scb]   { color: #fca5a5; }

.ins-grid[b-pd19494scb] { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-bottom: 1rem; }
@media (max-width: 992px) { .ins-grid[b-pd19494scb] { grid-template-columns: 1fr; } }

.ins-panel[b-pd19494scb] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: hidden; }
.ins-panel-head[b-pd19494scb] { padding: 0.7rem 1rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.ins-panel-head h3[b-pd19494scb] { margin: 0; font-size: 0.9rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.ins-panel-body[b-pd19494scb] { padding: 1rem; display: flex; flex-direction: column; gap: 0.85rem; }

.form-row[b-pd19494scb] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-pd19494scb] { font-size: 0.7rem; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-input[b-pd19494scb], select.form-input[b-pd19494scb] { padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.85rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-input:focus[b-pd19494scb] { border-color: var(--rg-accent); }

.ins-familia-row[b-pd19494scb] { display: flex; gap: 0.5rem; align-items: stretch; }
.ins-familia-row .form-input[b-pd19494scb] { flex: 1; }
.ins-id[b-pd19494scb] { font-family: 'Cascadia Code','Fira Code',monospace; color: var(--rg-text-muted); font-size: 0.7rem; }

.ins-info[b-pd19494scb] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.85rem; display: flex; flex-direction: column; gap: 0.4rem; }
.ins-info-row[b-pd19494scb] { display: flex; justify-content: space-between; align-items: baseline; font-size: 0.85rem; }
.ins-info-lbl[b-pd19494scb] { color: var(--rg-text-muted); }
.ins-info-row strong[b-pd19494scb] { color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.ins-info-total[b-pd19494scb] { padding-top: 0.4rem; border-top: 1px solid var(--rg-border); font-size: 0.95rem; }
.ins-info-total strong[b-pd19494scb] { color: var(--rg-accent); font-size: 1rem; }

.ins-hint[b-pd19494scb] { font-size: 0.65rem; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; font-weight: 500; margin-left: 0.5rem; }

.ins-neto[b-pd19494scb] { display: flex; justify-content: space-between; align-items: baseline; padding: 0.7rem 0.85rem; background: rgba(22,163,74,0.08); border: 1px solid rgba(22,163,74,0.3); border-radius: 0.4rem; margin-top: 0.5rem; }
.ins-neto-lbl[b-pd19494scb] { font-size: 0.78rem; color: #166534; font-weight: 600; }
.ins-neto strong[b-pd19494scb] { font-size: 1rem; color: #166534; }
[data-mode="dark"] .ins-neto-lbl[b-pd19494scb], [data-mode="dark"] .ins-neto strong[b-pd19494scb] { color: #86efac; }

.ins-warn[b-pd19494scb] { margin-top: 0.6rem; padding: 0.55rem 0.85rem; background: rgba(217,119,6,0.08); border: 1px solid rgba(217,119,6,0.3); border-radius: 0.4rem; font-size: 0.78rem; color: #92400e; display: flex; gap: 0.4rem; align-items: flex-start; }
.ins-warn i[b-pd19494scb] { margin-top: 0.1rem; flex-shrink: 0; }
[data-mode="dark"] .ins-warn[b-pd19494scb] { color: #fcd34d; }

.ins-actions[b-pd19494scb] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.5rem; }

.spin[b-pd19494scb] { animation: in-spin-b-pd19494scb 0.8s linear infinite; display: inline-block; }
@keyframes in-spin-b-pd19494scb { to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmano_lectivo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-j7ph3kfwtj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-j7ph3kfwtj 0.3s ease-out; }
@keyframes slideUp-b-j7ph3kfwtj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-j7ph3kfwtj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-j7ph3kfwtj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-j7ph3kfwtj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-j7ph3kfwtj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-j7ph3kfwtj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-j7ph3kfwtj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-j7ph3kfwtj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-j7ph3kfwtj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-j7ph3kfwtj] { filter: brightness(1.1); }
.btn-outline[b-j7ph3kfwtj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-j7ph3kfwtj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-j7ph3kfwtj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-j7ph3kfwtj] { filter: brightness(1.1); }
.btn-icon[b-j7ph3kfwtj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-j7ph3kfwtj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-j7ph3kfwtj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-j7ph3kfwtj] { color: #ef4444; }
.btn-delete:hover[b-j7ph3kfwtj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-j7ph3kfwtj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-j7ph3kfwtj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-j7ph3kfwtj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-j7ph3kfwtj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-j7ph3kfwtj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-j7ph3kfwtj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-j7ph3kfwtj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-j7ph3kfwtj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-j7ph3kfwtj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-j7ph3kfwtj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-j7ph3kfwtj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-j7ph3kfwtj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-j7ph3kfwtj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-j7ph3kfwtj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-j7ph3kfwtj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-j7ph3kfwtj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-j7ph3kfwtj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-j7ph3kfwtj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-j7ph3kfwtj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-j7ph3kfwtj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-j7ph3kfwtj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-j7ph3kfwtj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-j7ph3kfwtj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-j7ph3kfwtj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-j7ph3kfwtj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-j7ph3kfwtj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-j7ph3kfwtj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-j7ph3kfwtj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-j7ph3kfwtj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-j7ph3kfwtj] { display: block; }
.hide-on-cards[b-j7ph3kfwtj] { display: none !important; }
.show-on-cards[b-j7ph3kfwtj] { display: grid; }
.hide-on-grid[b-j7ph3kfwtj] { display: none !important; }

/* Badges */
.badge[b-j7ph3kfwtj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-j7ph3kfwtj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-j7ph3kfwtj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-j7ph3kfwtj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-j7ph3kfwtj] { text-align: center; }
.text-muted[b-j7ph3kfwtj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-j7ph3kfwtj], .crud-empty-state[b-j7ph3kfwtj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-j7ph3kfwtj] { font-size: 2rem; }
.crud-spinner[b-j7ph3kfwtj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-j7ph3kfwtj 0.6s linear infinite; }
.crud-spinner-sm[b-j7ph3kfwtj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-j7ph3kfwtj 0.6s linear infinite; }
@keyframes spin-b-j7ph3kfwtj { to { transform: rotate(360deg); } }
.spin[b-j7ph3kfwtj] { animation: spin-b-j7ph3kfwtj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-j7ph3kfwtj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-j7ph3kfwtj 0.15s ease-out; }
.modal-container[b-j7ph3kfwtj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-j7ph3kfwtj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-j7ph3kfwtj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-j7ph3kfwtj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-j7ph3kfwtj] { max-width: 420px; }
@keyframes fadeIn-b-j7ph3kfwtj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-j7ph3kfwtj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-j7ph3kfwtj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-j7ph3kfwtj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-j7ph3kfwtj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-j7ph3kfwtj] { color: #dc2626; }
.modal-close[b-j7ph3kfwtj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-j7ph3kfwtj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-j7ph3kfwtj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-j7ph3kfwtj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-j7ph3kfwtj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-j7ph3kfwtj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-j7ph3kfwtj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-j7ph3kfwtj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-j7ph3kfwtj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-j7ph3kfwtj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-j7ph3kfwtj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-j7ph3kfwtj] { flex: 2; }
.form-group label[b-j7ph3kfwtj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-j7ph3kfwtj], .form-group select[b-j7ph3kfwtj], .form-textarea[b-j7ph3kfwtj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-j7ph3kfwtj], .form-group select:focus[b-j7ph3kfwtj], .form-textarea:focus[b-j7ph3kfwtj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-j7ph3kfwtj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-j7ph3kfwtj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-j7ph3kfwtj] { flex: 1; display: flex; align-items: center; }
.form-check[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-j7ph3kfwtj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-j7ph3kfwtj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-j7ph3kfwtj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-j7ph3kfwtj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-j7ph3kfwtj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-j7ph3kfwtj] { font-size: 3rem; }
.photo-placeholder span[b-j7ph3kfwtj] { font-size: 0.78rem; }
.photo-actions[b-j7ph3kfwtj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-j7ph3kfwtj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-j7ph3kfwtj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-j7ph3kfwtj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-j7ph3kfwtj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-j7ph3kfwtj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-j7ph3kfwtj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-j7ph3kfwtj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-j7ph3kfwtj] { filter: brightness(1.15); transform: scale(1.05); }
[b-j7ph3kfwtj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-j7ph3kfwtj] { padding: 0.75rem; }
    .crud-header[b-j7ph3kfwtj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-j7ph3kfwtj] { font-size: 1.1rem; }
    .btn-text[b-j7ph3kfwtj] { display: none; }
    .form-row[b-j7ph3kfwtj] { flex-direction: column; }
    .form-row-4[b-j7ph3kfwtj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-j7ph3kfwtj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-j7ph3kfwtj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-j7ph3kfwtj] { padding: 0.75rem; }
    .modal-tabs[b-j7ph3kfwtj] { overflow-x: auto; }
    .modal-tab[b-j7ph3kfwtj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-j7ph3kfwtj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-j7ph3kfwtj] { display: grid !important; }
    .crud-cards-wrapper[b-j7ph3kfwtj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-j7ph3kfwtj] { grid-template-columns: 1fr; }
    .card-details[b-j7ph3kfwtj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-j7ph3kfwtj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-j7ph3kfwtj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-j7ph3kfwtj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-j7ph3kfwtj] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-j7ph3kfwtj] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-j7ph3kfwtj] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-j7ph3kfwtj] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-j7ph3kfwtj] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-j7ph3kfwtj] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-j7ph3kfwtj] { min-width: 140px; }
.param-band-input[b-j7ph3kfwtj] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-j7ph3kfwtj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-j7ph3kfwtj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-j7ph3kfwtj] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-j7ph3kfwtj] { border-bottom: none; }
.param-section-title[b-j7ph3kfwtj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-j7ph3kfwtj] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-j7ph3kfwtj] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-j7ph3kfwtj] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-j7ph3kfwtj] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-j7ph3kfwtj] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-j7ph3kfwtj] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-j7ph3kfwtj] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-j7ph3kfwtj] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-j7ph3kfwtj] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-j7ph3kfwtj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-j7ph3kfwtj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-j7ph3kfwtj] { border-bottom: none; }
.help-section p[b-j7ph3kfwtj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-j7ph3kfwtj], .help-section ol[b-j7ph3kfwtj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-j7ph3kfwtj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-j7ph3kfwtj] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-j7ph3kfwtj] { color: var(--rg-accent,#2563eb); }
.help-tip[b-j7ph3kfwtj] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-j7ph3kfwtj] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-j7ph3kfwtj] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-j7ph3kfwtj], .form-row-3[b-j7ph3kfwtj], .form-row-4[b-j7ph3kfwtj] { grid-template-columns: 1fr; }
    .param-band[b-j7ph3kfwtj] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-j7ph3kfwtj] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-j7ph3kfwtj] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-j7ph3kfwtj] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-j7ph3kfwtj] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-j7ph3kfwtj] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-j7ph3kfwtj] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-j7ph3kfwtj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-j7ph3kfwtj] { color: var(--rg-accent, #2563eb); }

.form-hint[b-j7ph3kfwtj] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-j7ph3kfwtj] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-j7ph3kfwtj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-j7ph3kfwtj] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-j7ph3kfwtj] { filter: brightness(1.1); }

.text-muted[b-j7ph3kfwtj] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-j7ph3kfwtj] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-j7ph3kfwtj] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-j7ph3kfwtj] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-j7ph3kfwtj] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-j7ph3kfwtj]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-j7ph3kfwtj] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-j7ph3kfwtj]::before {
    transform: translateX(16px);
}
.switch-text[b-j7ph3kfwtj] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-j7ph3kfwtj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-j7ph3kfwtj] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-j7ph3kfwtj] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclgasignacionnotanivelinicial.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-x2ctxnjdzh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x2ctxnjdzh 0.3s ease-out; }
@keyframes slideUp-b-x2ctxnjdzh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x2ctxnjdzh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x2ctxnjdzh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x2ctxnjdzh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x2ctxnjdzh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x2ctxnjdzh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x2ctxnjdzh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x2ctxnjdzh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x2ctxnjdzh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x2ctxnjdzh] { filter: brightness(1.1); }
.btn-outline[b-x2ctxnjdzh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x2ctxnjdzh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x2ctxnjdzh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x2ctxnjdzh] { filter: brightness(1.1); }
.btn-icon[b-x2ctxnjdzh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x2ctxnjdzh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x2ctxnjdzh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-x2ctxnjdzh] { color: #ef4444; }
.btn-delete:hover[b-x2ctxnjdzh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-x2ctxnjdzh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x2ctxnjdzh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x2ctxnjdzh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x2ctxnjdzh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-x2ctxnjdzh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-x2ctxnjdzh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-x2ctxnjdzh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-x2ctxnjdzh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-x2ctxnjdzh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-x2ctxnjdzh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x2ctxnjdzh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x2ctxnjdzh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x2ctxnjdzh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x2ctxnjdzh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x2ctxnjdzh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-x2ctxnjdzh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-x2ctxnjdzh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-x2ctxnjdzh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-x2ctxnjdzh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-x2ctxnjdzh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-x2ctxnjdzh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-x2ctxnjdzh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-x2ctxnjdzh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-x2ctxnjdzh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-x2ctxnjdzh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-x2ctxnjdzh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-x2ctxnjdzh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-x2ctxnjdzh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-x2ctxnjdzh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-x2ctxnjdzh] { display: block; }
.hide-on-cards[b-x2ctxnjdzh] { display: none !important; }
.show-on-cards[b-x2ctxnjdzh] { display: grid; }
.hide-on-grid[b-x2ctxnjdzh] { display: none !important; }

/* Badges */
.badge[b-x2ctxnjdzh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-x2ctxnjdzh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-x2ctxnjdzh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-x2ctxnjdzh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x2ctxnjdzh] { text-align: center; }
.text-muted[b-x2ctxnjdzh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-x2ctxnjdzh], .crud-empty-state[b-x2ctxnjdzh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x2ctxnjdzh] { font-size: 2rem; }
.crud-spinner[b-x2ctxnjdzh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x2ctxnjdzh 0.6s linear infinite; }
.crud-spinner-sm[b-x2ctxnjdzh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x2ctxnjdzh 0.6s linear infinite; }
@keyframes spin-b-x2ctxnjdzh { to { transform: rotate(360deg); } }
.spin[b-x2ctxnjdzh] { animation: spin-b-x2ctxnjdzh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-x2ctxnjdzh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x2ctxnjdzh 0.15s ease-out; }
.modal-container[b-x2ctxnjdzh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x2ctxnjdzh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x2ctxnjdzh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-x2ctxnjdzh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-x2ctxnjdzh] { max-width: 420px; }
@keyframes fadeIn-b-x2ctxnjdzh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x2ctxnjdzh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x2ctxnjdzh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x2ctxnjdzh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-x2ctxnjdzh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-x2ctxnjdzh] { color: #dc2626; }
.modal-close[b-x2ctxnjdzh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x2ctxnjdzh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x2ctxnjdzh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x2ctxnjdzh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-x2ctxnjdzh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-x2ctxnjdzh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-x2ctxnjdzh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-x2ctxnjdzh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-x2ctxnjdzh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-x2ctxnjdzh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-x2ctxnjdzh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-x2ctxnjdzh] { flex: 2; }
.form-group label[b-x2ctxnjdzh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-x2ctxnjdzh], .form-group select[b-x2ctxnjdzh], .form-textarea[b-x2ctxnjdzh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-x2ctxnjdzh], .form-group select:focus[b-x2ctxnjdzh], .form-textarea:focus[b-x2ctxnjdzh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-x2ctxnjdzh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-x2ctxnjdzh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-x2ctxnjdzh] { flex: 1; display: flex; align-items: center; }
.form-check[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-x2ctxnjdzh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-x2ctxnjdzh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-x2ctxnjdzh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-x2ctxnjdzh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-x2ctxnjdzh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-x2ctxnjdzh] { font-size: 3rem; }
.photo-placeholder span[b-x2ctxnjdzh] { font-size: 0.78rem; }
.photo-actions[b-x2ctxnjdzh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-x2ctxnjdzh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-x2ctxnjdzh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-x2ctxnjdzh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-x2ctxnjdzh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-x2ctxnjdzh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-x2ctxnjdzh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-x2ctxnjdzh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-x2ctxnjdzh] { filter: brightness(1.15); transform: scale(1.05); }
[b-x2ctxnjdzh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-x2ctxnjdzh] { padding: 0.75rem; }
    .crud-header[b-x2ctxnjdzh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x2ctxnjdzh] { font-size: 1.1rem; }
    .btn-text[b-x2ctxnjdzh] { display: none; }
    .form-row[b-x2ctxnjdzh] { flex-direction: column; }
    .form-row-4[b-x2ctxnjdzh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-x2ctxnjdzh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x2ctxnjdzh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-x2ctxnjdzh] { padding: 0.75rem; }
    .modal-tabs[b-x2ctxnjdzh] { overflow-x: auto; }
    .modal-tab[b-x2ctxnjdzh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-x2ctxnjdzh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-x2ctxnjdzh] { display: grid !important; }
    .crud-cards-wrapper[b-x2ctxnjdzh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-x2ctxnjdzh] { grid-template-columns: 1fr; }
    .card-details[b-x2ctxnjdzh] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-x2ctxnjdzh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x2ctxnjdzh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x2ctxnjdzh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x2ctxnjdzh] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclgcobrorealizado.razor.rz.scp.css */
/* ============================================================
   Frmclgcobrorealizado.razor.css — Cobros Realizados (Colegio)
   ✅ Usa SOLO tokens --rg-* (dark mode automatico)
   ✅ Patron copiado de Frmclientes.razor.css
   ============================================================ */

/* ── Base CRUD (scoped) ─────────────────────────────── */
.crud-container[b-ye5ujl6j4x] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ye5ujl6j4x 0.3s ease-out; }
@keyframes slideUp-b-ye5ujl6j4x { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-ye5ujl6j4x] { animation: slideUp-b-ye5ujl6j4x 0.3s ease-out; }

.crud-header[b-ye5ujl6j4x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ye5ujl6j4x] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ye5ujl6j4x] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ye5ujl6j4x] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ye5ujl6j4x] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ye5ujl6j4x] { display: flex; gap: 0.5rem; }

/* ── Botones ────────────────────────────────────────── */
.btn-crud[b-ye5ujl6j4x] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ye5ujl6j4x] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ye5ujl6j4x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ye5ujl6j4x] { filter: brightness(1.1); }
.btn-outline[b-ye5ujl6j4x] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ye5ujl6j4x] { background: var(--rg-bg-hover, #f1f5f9); }

/* ── Barra de contexto (Empresa / Sucursal / BD) ──── */
.ctx-bar[b-ye5ujl6j4x] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}
.ctx-item[b-ye5ujl6j4x] { display: flex; align-items: center; gap: 0.4rem; }
.ctx-item i[b-ye5ujl6j4x] { color: var(--rg-accent, #4f46e5); font-size: 0.9rem; }
.ctx-label[b-ye5ujl6j4x] { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted, #94a3b8); }
.ctx-value[b-ye5ujl6j4x] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.ctx-sep[b-ye5ujl6j4x] { width: 1px; height: 1.25rem; background: var(--rg-border, #e2e8f0); }

/* ── Filtros de fecha ───────────────────────────────── */
.filter-bar[b-ye5ujl6j4x] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    padding: 0.75rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}
.filter-group[b-ye5ujl6j4x] { display: flex; flex-direction: column; gap: 0.25rem; }
.filter-group label[b-ye5ujl6j4x] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted, #94a3b8);
}
.filter-group input[type="date"][b-ye5ujl6j4x] {
    background: var(--rg-bg-input, #fff);
    color: var(--rg-text-primary, #1e293b);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    padding: 0.4rem 0.6rem;
    font-size: 0.8rem;
}
.filter-group input[type="date"]:focus[b-ye5ujl6j4x] {
    border-color: var(--rg-accent, #4f46e5);
    outline: none;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
}

/* ── Resumen rapido ─────────────────────────────────── */
.summary-strip[b-ye5ujl6j4x] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}
.summary-chip[b-ye5ujl6j4x] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}
.summary-chip.accent[b-ye5ujl6j4x] {
    background: rgba(79, 70, 229, 0.08);
    color: var(--rg-accent, #4f46e5);
    border-color: rgba(79, 70, 229, 0.2);
}
[data-mode="dark"] .summary-chip.accent[b-ye5ujl6j4x] {
    background: rgba(129, 120, 255, 0.12);
    color: #a5b4fc;
    border-color: rgba(129, 120, 255, 0.25);
}

/* ── Alerta ─────────────────────────────────────────── */
.crud-alert[b-ye5ujl6j4x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ye5ujl6j4x] { background: rgba(34, 197, 94, 0.1); color: #065f46; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-ye5ujl6j4x] { background: rgba(239, 68, 68, 0.1); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-ye5ujl6j4x] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-ye5ujl6j4x] { color: #fca5a5; }
.crud-alert-close[b-ye5ujl6j4x] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── Busqueda local ─────────────────────────────────── */
.crud-search-bar[b-ye5ujl6j4x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ye5ujl6j4x] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ye5ujl6j4x] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ye5ujl6j4x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ye5ujl6j4x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* ── Tabla ──────────────────────────────────────────── */
.crud-grid-wrapper[b-ye5ujl6j4x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 380px); }
.crud-table[b-ye5ujl6j4x] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ye5ujl6j4x] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ye5ujl6j4x] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    text-align: left;
    padding: 0.625rem 0.75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.crud-table td[b-ye5ujl6j4x] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
    white-space: nowrap;
}
.crud-table tbody tr:hover[b-ye5ujl6j4x] { background: var(--rg-bg-hover, #f8fafc); }
.col-row[b-ye5ujl6j4x] { width: 40px; text-align: center; color: var(--rg-text-muted, #94a3b8); }

/* ── Columnas especificas ──────────────────────────── */
.col-money[b-ye5ujl6j4x] { text-align: right; white-space: nowrap; }
.crud-table th.col-money[b-ye5ujl6j4x] { text-align: right; }
.col-cliente[b-ye5ujl6j4x] { font-weight: 600; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.col-concepto[b-ye5ujl6j4x] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-danger[b-ye5ujl6j4x] { color: var(--rg-danger, #dc2626); }
[data-mode="dark"] .text-danger[b-ye5ujl6j4x] { color: #fca5a5; }

/* ── Fila de totales ───────────────────────────────── */
.totals-row[b-ye5ujl6j4x] {
    background: var(--rg-bg-subtle, #f1f5f9);
    font-weight: 700;
    border-top: 2px solid var(--rg-border, #e2e8f0);
}
.totals-row td[b-ye5ujl6j4x] { padding: 0.625rem 0.75rem; color: var(--rg-text-primary, #1e293b); }
.totals-label[b-ye5ujl6j4x] { text-align: right; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.03em; color: var(--rg-text-secondary, #475569); }

/* ── Chip danger (mora) ────────────────────────────── */
.summary-chip.danger[b-ye5ujl6j4x] {
    background: rgba(239, 68, 68, 0.1);
    color: var(--rg-danger, #dc2626);
    border-color: rgba(239, 68, 68, 0.25);
}
[data-mode="dark"] .summary-chip.danger[b-ye5ujl6j4x] {
    background: rgba(239, 68, 68, 0.15);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.3);
}

/* ── Tabs ──────────────────────────────────────────── */
.crud-tabs[b-ye5ujl6j4x] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.crud-tab[b-ye5ujl6j4x] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.6rem 1.1rem;
    border: none;
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.15s;
}
.crud-tab:hover[b-ye5ujl6j4x] { color: var(--rg-accent, #4f46e5); background: var(--rg-bg-hover, #f8fafc); }
.crud-tab.active[b-ye5ujl6j4x] {
    color: var(--rg-accent, #4f46e5);
    border-bottom-color: var(--rg-accent, #4f46e5);
}
.crud-tab-badge[b-ye5ujl6j4x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4rem;
    height: 1.2rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 700;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
}
.crud-tab.active .crud-tab-badge[b-ye5ujl6j4x] {
    background: rgba(79, 70, 229, 0.1);
    color: var(--rg-accent, #4f46e5);
}
[data-mode="dark"] .crud-tab.active .crud-tab-badge[b-ye5ujl6j4x] {
    background: rgba(129, 120, 255, 0.15);
    color: #a5b4fc;
}

/* ── Resumen sections ──────────────────────────────── */
.resumen-section[b-ye5ujl6j4x] {
    margin-bottom: 1.5rem;
}
.resumen-title[b-ye5ujl6j4x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0 0 0.75rem 0;
}
.resumen-title i[b-ye5ujl6j4x] {
    color: var(--rg-accent, #4f46e5);
    font-size: 1rem;
}

/* ── Cards grid (tipo doc) ─────────────────────────── */
.resumen-cards-grid[b-ye5ujl6j4x] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.75rem;
}
.resumen-card[b-ye5ujl6j4x] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.85rem;
    transition: box-shadow 0.15s;
}
.resumen-card:hover[b-ye5ujl6j4x] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
[data-mode="dark"] .resumen-card:hover[b-ye5ujl6j4x] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}
.resumen-card-header[b-ye5ujl6j4x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}
.resumen-card-code[b-ye5ujl6j4x] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
}
.resumen-card-badge[b-ye5ujl6j4x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.25rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 700;
    background: rgba(79, 70, 229, 0.1);
    color: var(--rg-accent, #4f46e5);
}
[data-mode="dark"] .resumen-card-badge[b-ye5ujl6j4x] {
    background: rgba(129, 120, 255, 0.15);
    color: #a5b4fc;
}
.resumen-card-value[b-ye5ujl6j4x] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--rg-accent, #4f46e5);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}
[data-mode="dark"] .resumen-card-value[b-ye5ujl6j4x] {
    color: #a5b4fc;
}

/* ── NCF Badge ─────────────────────────────────────── */
.ncf-badge[b-ye5ujl6j4x] {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 700;
    background: rgba(79, 70, 229, 0.08);
    color: var(--rg-accent, #4f46e5);
    border: 1px solid rgba(79, 70, 229, 0.2);
}
[data-mode="dark"] .ncf-badge[b-ye5ujl6j4x] {
    background: rgba(129, 120, 255, 0.12);
    color: #a5b4fc;
    border-color: rgba(129, 120, 255, 0.25);
}

/* ── Chart bars (CSS-only horizontal) ──────────────── */
.chart-container[b-ye5ujl6j4x] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1rem;
}
.chart-bars[b-ye5ujl6j4x] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.chart-bar-row[b-ye5ujl6j4x] {
    display: grid;
    grid-template-columns: 180px 1fr auto auto;
    align-items: center;
    gap: 0.6rem;
}
.chart-bar-label[b-ye5ujl6j4x] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.chart-bar-track[b-ye5ujl6j4x] {
    height: 1.25rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border-radius: 0.25rem;
    overflow: hidden;
}
.chart-bar-fill[b-ye5ujl6j4x] {
    height: 100%;
    background: var(--rg-accent, #4f46e5);
    border-radius: 0.25rem;
    min-width: 2px;
    transition: width 0.4s ease;
}
.chart-bar-fill.ncf[b-ye5ujl6j4x] {
    background: #0ea5e9;
}
[data-mode="dark"] .chart-bar-fill.ncf[b-ye5ujl6j4x] {
    background: #38bdf8;
}
.chart-bar-fill.doc[b-ye5ujl6j4x] {
    background: #f59e0b;
}
[data-mode="dark"] .chart-bar-fill.doc[b-ye5ujl6j4x] {
    background: #fbbf24;
}
.chart-bar-value[b-ye5ujl6j4x] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    min-width: 80px;
    text-align: right;
}
.chart-bar-count[b-ye5ujl6j4x] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    min-width: 30px;
    text-align: center;
}

/* ── Utilidades ─────────────────────────────────────── */
.font-mono[b-ye5ujl6j4x] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ye5ujl6j4x] { text-align: center; }
.text-right[b-ye5ujl6j4x] { text-align: right; }
.text-muted[b-ye5ujl6j4x] { color: var(--rg-text-muted, #94a3b8); }

/* ── Loading / Empty ────────────────────────────────── */
.crud-loading[b-ye5ujl6j4x], .crud-empty-state[b-ye5ujl6j4x] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ye5ujl6j4x] { font-size: 2rem; }
.crud-spinner[b-ye5ujl6j4x] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ye5ujl6j4x 0.6s linear infinite; }
@keyframes spin-b-ye5ujl6j4x { to { transform: rotate(360deg); } }
.spin[b-ye5ujl6j4x] { animation: spin-b-ye5ujl6j4x 0.8s linear infinite; }

/* ── Responsive ─────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-ye5ujl6j4x] { padding: 0.75rem; }
    .crud-header[b-ye5ujl6j4x] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-ye5ujl6j4x] { display: none; }
    .filter-bar[b-ye5ujl6j4x] { flex-direction: column; }
    .ctx-bar[b-ye5ujl6j4x] { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
    .ctx-sep[b-ye5ujl6j4x] { display: none; }
    .crud-tabs[b-ye5ujl6j4x] { overflow-x: auto; }
    .crud-tab[b-ye5ujl6j4x] { padding: 0.5rem 0.75rem; font-size: 0.75rem; white-space: nowrap; }
    .resumen-cards-grid[b-ye5ujl6j4x] { grid-template-columns: 1fr 1fr; }
    .chart-bar-row[b-ye5ujl6j4x] { grid-template-columns: 100px 1fr auto auto; gap: 0.35rem; }
    .chart-bar-label[b-ye5ujl6j4x] { font-size: 0.7rem; }
}
@media (max-width: 480px) {
    .resumen-cards-grid[b-ye5ujl6j4x] { grid-template-columns: 1fr; }
    .chart-bar-row[b-ye5ujl6j4x] { grid-template-columns: 80px 1fr auto; }
    .chart-bar-count[b-ye5ujl6j4x] { display: none; }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclgejecucionesperiodo.razor.rz.scp.css */
/* ============================================================
   Frmclgejecucionesperiodo — Pivot de Ejecuciones por Período Académico
   Tema claro + oscuro obligatorio mediante tokens --rg-*
   ============================================================ */

@keyframes slideUp-b-1ctgcwhseu {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.ep-container[b-1ctgcwhseu] {
    padding: 1.25rem;
    animation: slideUp-b-1ctgcwhseu 0.3s ease-out;
}

/* ── Header ─────────────────────────────────────────────────── */
.ep-header[b-1ctgcwhseu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.ep-header-left[b-1ctgcwhseu]   { display: flex; align-items: center; gap: 0.75rem; }
.ep-header-icon[b-1ctgcwhseu]   { font-size: 1.75rem; color: var(--rg-accent); }
.ep-title[b-1ctgcwhseu]         { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: 0.5rem; }
.ep-subtitle[b-1ctgcwhseu]      { font-size: 0.78rem; color: var(--rg-text-muted); }
.ep-header-actions[b-1ctgcwhseu] { display: flex; gap: 0.5rem; }

/* ── Botones ────────────────────────────────────────────────── */
.btn-ep[b-1ctgcwhseu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-ep:disabled[b-1ctgcwhseu] { opacity: 0.6; cursor: not-allowed; }
.btn-ep-primary[b-1ctgcwhseu]  { background: var(--rg-accent); color: #fff; }
.btn-ep-primary:hover:not(:disabled)[b-1ctgcwhseu] { filter: brightness(1.1); }
.btn-ep-outline[b-1ctgcwhseu]  { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-ep-outline:hover:not(:disabled)[b-1ctgcwhseu]  { background: var(--rg-bg-hover); }
.btn-ep-excel[b-1ctgcwhseu]    { background: rgba(21,128,61,0.1); color: #15803d; border: 1px solid rgba(21,128,61,0.3); }
.btn-ep-excel:hover:not(:disabled)[b-1ctgcwhseu]    { background: rgba(21,128,61,0.18); }
[data-mode="dark"] .btn-ep-excel[b-1ctgcwhseu]  { background: rgba(21,128,61,0.15); color: #86efac; border-color: rgba(21,128,61,0.4); }

/* Botón ayuda */
.btn-help[b-1ctgcwhseu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    border: 1px solid rgba(37,99,235,0.3);
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-help:hover[b-1ctgcwhseu] { background: rgba(37,99,235,0.18); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-1ctgcwhseu] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.4); }

.btn-text[b-1ctgcwhseu] { display: inline; }
@media (max-width: 768px) { .btn-text[b-1ctgcwhseu] { display: none; } }

/* ── Filtros ─────────────────────────────────────────────────── */
.ep-filtros[b-1ctgcwhseu] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    flex-wrap: wrap;
}
.ep-fg[b-1ctgcwhseu] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}
.ep-fg label[b-1ctgcwhseu] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.ep-input[b-1ctgcwhseu] {
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    transition: border-color 0.15s;
    min-width: 110px;
}
.ep-input:focus[b-1ctgcwhseu] { border-color: var(--rg-accent); }
.ep-filtros-info[b-1ctgcwhseu] {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    font-variant-numeric: tabular-nums;
    align-self: center;
}

/* ── Alerta ──────────────────────────────────────────────────── */
.ep-alert[b-1ctgcwhseu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.82rem;
    font-weight: 500;
}
.ep-alert.success[b-1ctgcwhseu] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.ep-alert.error[b-1ctgcwhseu]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.ep-alert button[b-1ctgcwhseu]  { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .ep-alert.success[b-1ctgcwhseu] { color: #86efac; }
[data-mode="dark"] .ep-alert.error[b-1ctgcwhseu]   { color: #fca5a5; }

/* ── KPIs ────────────────────────────────────────────────────── */
.ep-kpis[b-1ctgcwhseu] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}
@media (max-width: 1100px) { .ep-kpis[b-1ctgcwhseu] { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px)  { .ep-kpis[b-1ctgcwhseu] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 400px)  { .ep-kpis[b-1ctgcwhseu] { grid-template-columns: 1fr; } }

.ep-kpi[b-1ctgcwhseu] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.6rem;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}
.ep-kpi-label[b-1ctgcwhseu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.35rem; }
.ep-kpi-value[b-1ctgcwhseu] { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.ep-kpi-value-warn[b-1ctgcwhseu] { color: #d97706 !important; }
[data-mode="dark"] .ep-kpi-value-warn[b-1ctgcwhseu] { color: #fcd34d !important; }

.ep-kpi-proyectado .ep-kpi-label i[b-1ctgcwhseu] { color: #2563eb; }
.ep-kpi-rc         .ep-kpi-label i[b-1ctgcwhseu] { color: #16a34a; }
.ep-kpi-nc         .ep-kpi-label i[b-1ctgcwhseu] { color: #0891b2; }
.ep-kpi-nd         .ep-kpi-label i[b-1ctgcwhseu] { color: #dc2626; }
.ep-kpi-pendiente  .ep-kpi-label i[b-1ctgcwhseu] { color: #d97706; }

/* ── Loading / vacío ─────────────────────────────────────────── */
.ep-loading[b-1ctgcwhseu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
}
.ep-spinner[b-1ctgcwhseu] {
    width: 2.5rem;
    height: 2.5rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: spin-b-1ctgcwhseu 0.8s linear infinite;
}
@keyframes spin-b-1ctgcwhseu { to { transform: rotate(360deg); } }

.ep-empty[b-1ctgcwhseu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-muted);
    font-size: 0.88rem;
    text-align: center;
}

/* ── Tabla Pivot ─────────────────────────────────────────────── */
.ep-table-wrap[b-1ctgcwhseu] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow-x: auto;
    background: var(--rg-bg-card);
    margin-bottom: 0.75rem;
    max-height: calc(100vh - 380px);
}

.ep-table[b-1ctgcwhseu] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.75rem;
    min-width: 1000px;
}

/* Cabecera */
.ep-table thead[b-1ctgcwhseu] {
    position: sticky;
    top: 0;
    z-index: 2;
}
.ep-thead-mes th[b-1ctgcwhseu] {
    background: var(--rg-primary, #1a3a5c);
    color: #fff;
    font-weight: 700;
    text-align: center;
    padding: 0.5rem 0.4rem;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-right: 1px solid rgba(255,255,255,0.15);
    white-space: nowrap;
}
.ep-th-periodo[b-1ctgcwhseu] { text-align: left; padding-left: 0.75rem; min-width: 120px; }
.ep-th-tipo[b-1ctgcwhseu]    { min-width: 60px; }
.ep-th-mes[b-1ctgcwhseu]     { min-width: 52px; }
.ep-th-total[b-1ctgcwhseu]   { background: rgba(255,255,255,0.12); min-width: 72px; }

/* Celdas comunes */
.ep-table td[b-1ctgcwhseu] {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid var(--rg-border);
    vertical-align: middle;
    color: var(--rg-text-primary);
}
.ep-td-periodo[b-1ctgcwhseu] {
    font-weight: 700;
    color: var(--rg-text-primary);
    font-size: 0.78rem;
    background: var(--rg-bg-subtle);
    border-right: 1px solid var(--rg-border);
    padding-left: 0.75rem;
    vertical-align: top;
    padding-top: 0.7rem;
}
.ep-td-tipo[b-1ctgcwhseu] { text-align: center; }
.ep-td-num[b-1ctgcwhseu]  { text-align: right; font-variant-numeric: tabular-nums; }
.ep-td-total[b-1ctgcwhseu] {
    text-align: right;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    background: var(--rg-bg-subtle);
    border-left: 2px solid var(--rg-border);
}
.ep-zero[b-1ctgcwhseu] { color: var(--rg-text-muted); font-size: 0.72rem; }

/* Número negativo */
.ep-neg[b-1ctgcwhseu] { color: #dc2626 !important; font-weight: 600; }
[data-mode="dark"] .ep-neg[b-1ctgcwhseu] { color: #fca5a5 !important; }

/* Filas por tipo */
.ep-row-proyectado td[b-1ctgcwhseu] { background: rgba(37,99,235,0.04); }
.ep-row-rc         td[b-1ctgcwhseu] { background: rgba(22,163,74,0.04); }
.ep-row-nc         td[b-1ctgcwhseu] { background: rgba(8,145,178,0.04); }
.ep-row-nd         td[b-1ctgcwhseu] { background: rgba(220,38,38,0.04); }
.ep-row-pendiente  td[b-1ctgcwhseu] { background: rgba(217,119,6,0.06); font-weight: 600; }

[data-mode="dark"] .ep-row-proyectado td[b-1ctgcwhseu] { background: rgba(37,99,235,0.07); }
[data-mode="dark"] .ep-row-rc         td[b-1ctgcwhseu] { background: rgba(22,163,74,0.06); }
[data-mode="dark"] .ep-row-nc         td[b-1ctgcwhseu] { background: rgba(8,145,178,0.06); }
[data-mode="dark"] .ep-row-nd         td[b-1ctgcwhseu] { background: rgba(220,38,38,0.06); }
[data-mode="dark"] .ep-row-pendiente  td[b-1ctgcwhseu] { background: rgba(217,119,6,0.10); }

/* Fila subtotal */
.ep-row-sub td[b-1ctgcwhseu] {
    background: var(--rg-bg-subtle);
    font-weight: 600;
    border-top: 2px solid var(--rg-border);
    border-bottom: 3px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.ep-td-sub-label[b-1ctgcwhseu] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; }
.ep-td-sub[b-1ctgcwhseu] { font-weight: 700; }

/* Fila total general */
.ep-row-total td[b-1ctgcwhseu] {
    background: var(--rg-primary, #1a3a5c);
    color: #fff;
    font-weight: 700;
    font-size: 0.78rem;
    border-top: 3px solid var(--rg-border);
}
.ep-td-gran-total[b-1ctgcwhseu] { padding-left: 0.75rem; }
.ep-td-gran-num[b-1ctgcwhseu]   { text-align: right; font-variant-numeric: tabular-nums; }
.ep-row-total .ep-zero[b-1ctgcwhseu] { color: rgba(255,255,255,0.45); }

/* Badges de tipo de documento */
.ep-badge[b-1ctgcwhseu] {
    display: inline-block;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}
.ep-badge-proyectado[b-1ctgcwhseu] { background: rgba(37,99,235,0.12);  color: #1d4ed8; border: 1px solid rgba(37,99,235,0.3); }
.ep-badge-rc[b-1ctgcwhseu]         { background: rgba(22,163,74,0.12);  color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.ep-badge-nc[b-1ctgcwhseu]         { background: rgba(8,145,178,0.12);  color: #0e7490; border: 1px solid rgba(8,145,178,0.3); }
.ep-badge-nd[b-1ctgcwhseu]         { background: rgba(220,38,38,0.12);  color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
.ep-badge-pendiente[b-1ctgcwhseu]  { background: rgba(217,119,6,0.12);  color: #92400e; border: 1px solid rgba(217,119,6,0.3); }
[data-mode="dark"] .ep-badge-proyectado[b-1ctgcwhseu] { color: #93c5fd; }
[data-mode="dark"] .ep-badge-rc[b-1ctgcwhseu]         { color: #86efac; }
[data-mode="dark"] .ep-badge-nc[b-1ctgcwhseu]         { color: #67e8f9; }
[data-mode="dark"] .ep-badge-nd[b-1ctgcwhseu]         { color: #fca5a5; }
[data-mode="dark"] .ep-badge-pendiente[b-1ctgcwhseu]  { color: #fcd34d; }

/* ── INS-* (Inscripción / Matrícula / Otros) ───────────────────── */
.ep-row-otros td[b-1ctgcwhseu]                { background: rgba(139,92,246,0.04); }
.ep-row-otros-proyectado td[b-1ctgcwhseu]     { border-top: 2px dashed rgba(139,92,246,0.35); }
[data-mode="dark"] .ep-row-otros td[b-1ctgcwhseu] { background: rgba(139,92,246,0.08); }
.ep-badge-otros-proyectado[b-1ctgcwhseu]      { background: rgba(139,92,246,0.12); color: #6d28d9; border: 1px solid rgba(139,92,246,0.3); }
.ep-badge-otros-rc[b-1ctgcwhseu]              { background: rgba(139,92,246,0.10); color: #5b21b6; border: 1px solid rgba(139,92,246,0.25); }
.ep-badge-otros-nc[b-1ctgcwhseu]              { background: rgba(139,92,246,0.10); color: #5b21b6; border: 1px solid rgba(139,92,246,0.25); }
.ep-badge-otros-nd[b-1ctgcwhseu]              { background: rgba(139,92,246,0.10); color: #5b21b6; border: 1px solid rgba(139,92,246,0.25); }
.ep-badge-otros-pendiente[b-1ctgcwhseu]       { background: rgba(139,92,246,0.12); color: #6d28d9; border: 1px solid rgba(139,92,246,0.3); }
[data-mode="dark"] .ep-badge-otros-proyectado[b-1ctgcwhseu],
[data-mode="dark"] .ep-badge-otros-rc[b-1ctgcwhseu],
[data-mode="dark"] .ep-badge-otros-nc[b-1ctgcwhseu],
[data-mode="dark"] .ep-badge-otros-nd[b-1ctgcwhseu],
[data-mode="dark"] .ep-badge-otros-pendiente[b-1ctgcwhseu] { color: #c4b5fd; }

/* ── Separador visual de cambio de año calendario (DIC → ENE) ─── */
/* Marca la columna ENE con un borde izquierdo grueso para que se
   vea claramente que ahí termina el año calendario anterior
   y empieza el siguiente dentro del mismo ciclo académico. */
.ep-year-boundary[b-1ctgcwhseu] {
    border-left: 3px double var(--rg-accent, #2563eb) !important;
    position: relative;
}
/* Etiqueta sutil "Año siguiente" en el header */
.ep-thead-mes .ep-year-boundary[b-1ctgcwhseu]::before {
    content: "›";
    position: absolute;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rg-accent, #2563eb);
    font-size: 1rem;
    font-weight: 800;
    background: var(--rg-bg-card, #fff);
    padding: 0 2px;
    border-radius: 3px;
    line-height: 1;
}
[data-mode="dark"] .ep-year-boundary[b-1ctgcwhseu] {
    border-left-color: #93c5fd !important;
}
[data-mode="dark"] .ep-thead-mes .ep-year-boundary[b-1ctgcwhseu]::before {
    background: var(--rg-bg-card);
    color: #93c5fd;
}

/* ── Leyenda ─────────────────────────────────────────────────── */
.ep-leyenda[b-1ctgcwhseu] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    padding: 0.4rem 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

/* ── Spinner inline ──────────────────────────────────────────── */
.spin[b-1ctgcwhseu] { animation: spin-b-1ctgcwhseu 0.8s linear infinite; display: inline-block; }

/* ── Modal ────────────────────────────────────────────────────── */
.ep-modal-backdrop[b-1ctgcwhseu] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    z-index: 1000;
}
.ep-modal-container[b-1ctgcwhseu] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.ep-modal[b-1ctgcwhseu] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border-radius: 0.75rem;
    width: 95%;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.ep-modal-lg[b-1ctgcwhseu]  { max-width: 680px; }
.ep-modal-header[b-1ctgcwhseu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.ep-modal-header h2[b-1ctgcwhseu] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.ep-modal-close[b-1ctgcwhseu] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.ep-modal-close:hover[b-1ctgcwhseu] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.ep-modal-body[b-1ctgcwhseu] { padding: 0; overflow-y: auto; flex: 1; }
.ep-modal-footer[b-1ctgcwhseu] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
}

/* ── Contenido de ayuda ──────────────────────────────────────── */
.help-icon[b-1ctgcwhseu] { color: var(--rg-accent); }
.help-body[b-1ctgcwhseu]  { display: flex; flex-direction: column; }
.help-section[b-1ctgcwhseu] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-1ctgcwhseu] { border-bottom: none; }
.help-section p[b-1ctgcwhseu] { font-size: 0.85rem; color: var(--rg-text-secondary); margin-bottom: 0.4rem; }
.help-section ul[b-1ctgcwhseu] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-1ctgcwhseu] { font-size: 0.85rem; color: var(--rg-text-secondary); margin-bottom: 0.2rem; }
.help-section-title[b-1ctgcwhseu] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.65rem; }
.help-section-title i[b-1ctgcwhseu] { color: var(--rg-accent); }
.help-tip[b-1ctgcwhseu] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-1ctgcwhseu] { color: var(--rg-accent); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-1ctgcwhseu] { background: rgba(37,99,235,0.12); }
.help-steps[b-1ctgcwhseu] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-1ctgcwhseu] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-1ctgcwhseu] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-1ctgcwhseu] { font-size: 0.85rem; color: var(--rg-text-secondary); padding-top: 0.1rem; }
.help-table[b-1ctgcwhseu] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-1ctgcwhseu] { background: var(--rg-bg-subtle); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted); }
.help-table td[b-1ctgcwhseu] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-secondary); vertical-align: middle; }
[data-mode="dark"] .help-table th[b-1ctgcwhseu] { background: rgba(255,255,255,0.04); }

/* ── Pestañas ────────────────────────────────────────────────── */
.ep-tabs[b-1ctgcwhseu] {
    display: flex;
    gap: 0.25rem;
    border-bottom: 2px solid var(--rg-border);
    margin-bottom: 1rem;
}
.ep-tab[b-1ctgcwhseu] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 1rem;
    border: none;
    background: none;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--rg-text-muted);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    border-radius: 0.4rem 0.4rem 0 0;
    transition: all 0.15s;
}
.ep-tab:hover[b-1ctgcwhseu] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.ep-tab-active[b-1ctgcwhseu] {
    color: var(--rg-accent);
    border-bottom-color: var(--rg-accent);
    background: rgba(37,99,235,0.06);
}
.ep-tab-warn[b-1ctgcwhseu] { color: var(--rg-warning, #d97706); }
.ep-tab-warn.ep-tab-active[b-1ctgcwhseu] { border-bottom-color: var(--rg-warning, #d97706); background: rgba(217,119,6,0.07); }
.ep-tab-badge[b-1ctgcwhseu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    background: var(--rg-danger, #dc2626);
    color: #fff;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0 0.3rem;
}
[data-mode="dark"] .ep-tab-active[b-1ctgcwhseu]  { background: rgba(37,99,235,0.14); }
[data-mode="dark"] .ep-tab-warn.ep-tab-active[b-1ctgcwhseu] { background: rgba(217,119,6,0.14); }

/* ── Sobre-Aplicación ────────────────────────────────────────── */
.sa-resumen[b-1ctgcwhseu] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    background: rgba(220,38,38,0.05);
    border: 1px solid rgba(220,38,38,0.2);
    border-radius: 0.65rem;
    padding: 0.85rem 1.1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}
[data-mode="dark"] .sa-resumen[b-1ctgcwhseu] { background: rgba(220,38,38,0.09); border-color: rgba(220,38,38,0.3); }
.sa-resumen-item[b-1ctgcwhseu] { display: flex; align-items: baseline; gap: 0.45rem; }
.sa-resumen-count i[b-1ctgcwhseu] { color: var(--rg-warning, #d97706); font-size: 1rem; }
.sa-resumen-exceso i[b-1ctgcwhseu] { color: var(--rg-danger, #dc2626); font-size: 1rem; }
.sa-resumen-num[b-1ctgcwhseu] { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); }
.sa-resumen-count .sa-resumen-num[b-1ctgcwhseu] { color: var(--rg-warning, #d97706); }
.sa-resumen-exceso .sa-resumen-num[b-1ctgcwhseu] { color: var(--rg-danger, #dc2626); }
.sa-resumen-lbl[b-1ctgcwhseu] { font-size: 0.75rem; color: var(--rg-text-muted); }
.sa-resumen-note[b-1ctgcwhseu] {
    flex: 1;
    min-width: 200px;
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    border-left: 1px solid var(--rg-border);
    padding-left: 1rem;
}
.sa-resumen-note i[b-1ctgcwhseu] { color: var(--rg-accent); flex-shrink: 0; }

.sa-table th[b-1ctgcwhseu]  { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.sa-th-num[b-1ctgcwhseu]    { text-align: right; }
.sa-th-exceso[b-1ctgcwhseu] { color: var(--rg-danger, #dc2626) !important; }
.sa-row:hover td[b-1ctgcwhseu] { background: var(--rg-bg-hover); }
.sa-td-num[b-1ctgcwhseu]    { text-align: right; font-size: 0.82rem; padding: 0.4rem 0.65rem; }
.sa-exceso-cell[b-1ctgcwhseu] { font-weight: 700; color: var(--rg-danger, #dc2626); }
.sa-cuota-id[b-1ctgcwhseu]  { font-size: 0.75rem; opacity: 0.8; }
.sa-periodo-badge[b-1ctgcwhseu] { font-size: 0.68rem; }
.sa-tfoot[b-1ctgcwhseu]     { background: var(--rg-bg-subtle); }
.sa-tfoot td[b-1ctgcwhseu]  { padding: 0.4rem 0.65rem; }
.sa-tfoot-label[b-1ctgcwhseu] { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; color: var(--rg-text-muted); text-align: right; }
[data-mode="dark"] .sa-exceso-cell[b-1ctgcwhseu] { color: #fca5a5; }
[data-mode="dark"] .sa-resumen-count .sa-resumen-num[b-1ctgcwhseu] { color: #fcd34d; }
[data-mode="dark"] .sa-resumen-exceso .sa-resumen-num[b-1ctgcwhseu] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclggestiones.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-e77ppr7rg8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-e77ppr7rg8 0.3s ease-out; }
@keyframes slideUp-b-e77ppr7rg8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-e77ppr7rg8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-e77ppr7rg8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-e77ppr7rg8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-e77ppr7rg8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-e77ppr7rg8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-e77ppr7rg8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-e77ppr7rg8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-e77ppr7rg8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-e77ppr7rg8] { filter: brightness(1.1); }
.btn-outline[b-e77ppr7rg8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-e77ppr7rg8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-e77ppr7rg8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-e77ppr7rg8] { filter: brightness(1.1); }
.btn-icon[b-e77ppr7rg8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-e77ppr7rg8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-e77ppr7rg8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-e77ppr7rg8] { color: #ef4444; }
.btn-delete:hover[b-e77ppr7rg8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-e77ppr7rg8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-e77ppr7rg8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-e77ppr7rg8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-e77ppr7rg8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-e77ppr7rg8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-e77ppr7rg8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-e77ppr7rg8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-e77ppr7rg8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-e77ppr7rg8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-e77ppr7rg8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-e77ppr7rg8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-e77ppr7rg8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-e77ppr7rg8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-e77ppr7rg8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-e77ppr7rg8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-e77ppr7rg8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-e77ppr7rg8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-e77ppr7rg8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-e77ppr7rg8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-e77ppr7rg8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-e77ppr7rg8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-e77ppr7rg8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-e77ppr7rg8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-e77ppr7rg8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-e77ppr7rg8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-e77ppr7rg8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-e77ppr7rg8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-e77ppr7rg8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-e77ppr7rg8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-e77ppr7rg8] { display: block; }
.hide-on-cards[b-e77ppr7rg8] { display: none !important; }
.show-on-cards[b-e77ppr7rg8] { display: grid; }
.hide-on-grid[b-e77ppr7rg8] { display: none !important; }

/* Badges */
.badge[b-e77ppr7rg8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-e77ppr7rg8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-e77ppr7rg8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-e77ppr7rg8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-e77ppr7rg8] { text-align: center; }
.text-muted[b-e77ppr7rg8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-e77ppr7rg8], .crud-empty-state[b-e77ppr7rg8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-e77ppr7rg8] { font-size: 2rem; }
.crud-spinner[b-e77ppr7rg8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-e77ppr7rg8 0.6s linear infinite; }
.crud-spinner-sm[b-e77ppr7rg8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-e77ppr7rg8 0.6s linear infinite; }
@keyframes spin-b-e77ppr7rg8 { to { transform: rotate(360deg); } }
.spin[b-e77ppr7rg8] { animation: spin-b-e77ppr7rg8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-e77ppr7rg8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-e77ppr7rg8 0.15s ease-out; }
.modal-container[b-e77ppr7rg8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-e77ppr7rg8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-e77ppr7rg8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-e77ppr7rg8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-e77ppr7rg8] { max-width: 420px; }
@keyframes fadeIn-b-e77ppr7rg8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-e77ppr7rg8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-e77ppr7rg8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-e77ppr7rg8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-e77ppr7rg8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-e77ppr7rg8] { color: #dc2626; }
.modal-close[b-e77ppr7rg8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-e77ppr7rg8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-e77ppr7rg8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-e77ppr7rg8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-e77ppr7rg8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-e77ppr7rg8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-e77ppr7rg8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-e77ppr7rg8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-e77ppr7rg8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-e77ppr7rg8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-e77ppr7rg8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-e77ppr7rg8] { flex: 2; }
.form-group label[b-e77ppr7rg8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-e77ppr7rg8], .form-group select[b-e77ppr7rg8], .form-textarea[b-e77ppr7rg8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-e77ppr7rg8], .form-group select:focus[b-e77ppr7rg8], .form-textarea:focus[b-e77ppr7rg8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-e77ppr7rg8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-e77ppr7rg8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-e77ppr7rg8] { flex: 1; display: flex; align-items: center; }
.form-check[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-e77ppr7rg8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-e77ppr7rg8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-e77ppr7rg8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-e77ppr7rg8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-e77ppr7rg8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-e77ppr7rg8] { font-size: 3rem; }
.photo-placeholder span[b-e77ppr7rg8] { font-size: 0.78rem; }
.photo-actions[b-e77ppr7rg8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-e77ppr7rg8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-e77ppr7rg8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-e77ppr7rg8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-e77ppr7rg8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-e77ppr7rg8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-e77ppr7rg8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-e77ppr7rg8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-e77ppr7rg8] { filter: brightness(1.15); transform: scale(1.05); }
[b-e77ppr7rg8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-e77ppr7rg8] { padding: 0.75rem; }
    .crud-header[b-e77ppr7rg8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-e77ppr7rg8] { font-size: 1.1rem; }
    .btn-text[b-e77ppr7rg8] { display: none; }
    .form-row[b-e77ppr7rg8] { flex-direction: column; }
    .form-row-4[b-e77ppr7rg8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-e77ppr7rg8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-e77ppr7rg8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-e77ppr7rg8] { padding: 0.75rem; }
    .modal-tabs[b-e77ppr7rg8] { overflow-x: auto; }
    .modal-tab[b-e77ppr7rg8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-e77ppr7rg8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-e77ppr7rg8] { display: grid !important; }
    .crud-cards-wrapper[b-e77ppr7rg8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-e77ppr7rg8] { grid-template-columns: 1fr; }
    .card-details[b-e77ppr7rg8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-e77ppr7rg8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-e77ppr7rg8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-e77ppr7rg8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-e77ppr7rg8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclglistadoestudianteretencionnotas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-pnwwj3ncjz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pnwwj3ncjz 0.3s ease-out; }
@keyframes slideUp-b-pnwwj3ncjz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pnwwj3ncjz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pnwwj3ncjz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pnwwj3ncjz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pnwwj3ncjz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pnwwj3ncjz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pnwwj3ncjz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pnwwj3ncjz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pnwwj3ncjz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pnwwj3ncjz] { filter: brightness(1.1); }
.btn-outline[b-pnwwj3ncjz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pnwwj3ncjz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pnwwj3ncjz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pnwwj3ncjz] { filter: brightness(1.1); }
.btn-icon[b-pnwwj3ncjz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pnwwj3ncjz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pnwwj3ncjz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pnwwj3ncjz] { color: #ef4444; }
.btn-delete:hover[b-pnwwj3ncjz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-pnwwj3ncjz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pnwwj3ncjz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pnwwj3ncjz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pnwwj3ncjz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pnwwj3ncjz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pnwwj3ncjz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-pnwwj3ncjz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pnwwj3ncjz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-pnwwj3ncjz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pnwwj3ncjz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pnwwj3ncjz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pnwwj3ncjz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pnwwj3ncjz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pnwwj3ncjz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pnwwj3ncjz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-pnwwj3ncjz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-pnwwj3ncjz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-pnwwj3ncjz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-pnwwj3ncjz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-pnwwj3ncjz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-pnwwj3ncjz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-pnwwj3ncjz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-pnwwj3ncjz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-pnwwj3ncjz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-pnwwj3ncjz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-pnwwj3ncjz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-pnwwj3ncjz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-pnwwj3ncjz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-pnwwj3ncjz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-pnwwj3ncjz] { display: block; }
.hide-on-cards[b-pnwwj3ncjz] { display: none !important; }
.show-on-cards[b-pnwwj3ncjz] { display: grid; }
.hide-on-grid[b-pnwwj3ncjz] { display: none !important; }

/* Badges */
.badge[b-pnwwj3ncjz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pnwwj3ncjz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pnwwj3ncjz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-pnwwj3ncjz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pnwwj3ncjz] { text-align: center; }
.text-muted[b-pnwwj3ncjz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pnwwj3ncjz], .crud-empty-state[b-pnwwj3ncjz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pnwwj3ncjz] { font-size: 2rem; }
.crud-spinner[b-pnwwj3ncjz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pnwwj3ncjz 0.6s linear infinite; }
.crud-spinner-sm[b-pnwwj3ncjz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pnwwj3ncjz 0.6s linear infinite; }
@keyframes spin-b-pnwwj3ncjz { to { transform: rotate(360deg); } }
.spin[b-pnwwj3ncjz] { animation: spin-b-pnwwj3ncjz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-pnwwj3ncjz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pnwwj3ncjz 0.15s ease-out; }
.modal-container[b-pnwwj3ncjz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pnwwj3ncjz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pnwwj3ncjz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-pnwwj3ncjz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-pnwwj3ncjz] { max-width: 420px; }
@keyframes fadeIn-b-pnwwj3ncjz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pnwwj3ncjz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pnwwj3ncjz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pnwwj3ncjz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-pnwwj3ncjz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-pnwwj3ncjz] { color: #dc2626; }
.modal-close[b-pnwwj3ncjz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pnwwj3ncjz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pnwwj3ncjz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pnwwj3ncjz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pnwwj3ncjz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-pnwwj3ncjz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pnwwj3ncjz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pnwwj3ncjz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pnwwj3ncjz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pnwwj3ncjz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pnwwj3ncjz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pnwwj3ncjz] { flex: 2; }
.form-group label[b-pnwwj3ncjz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pnwwj3ncjz], .form-group select[b-pnwwj3ncjz], .form-textarea[b-pnwwj3ncjz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pnwwj3ncjz], .form-group select:focus[b-pnwwj3ncjz], .form-textarea:focus[b-pnwwj3ncjz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pnwwj3ncjz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pnwwj3ncjz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pnwwj3ncjz] { flex: 1; display: flex; align-items: center; }
.form-check[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pnwwj3ncjz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-pnwwj3ncjz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-pnwwj3ncjz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-pnwwj3ncjz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-pnwwj3ncjz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-pnwwj3ncjz] { font-size: 3rem; }
.photo-placeholder span[b-pnwwj3ncjz] { font-size: 0.78rem; }
.photo-actions[b-pnwwj3ncjz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-pnwwj3ncjz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-pnwwj3ncjz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-pnwwj3ncjz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-pnwwj3ncjz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-pnwwj3ncjz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-pnwwj3ncjz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-pnwwj3ncjz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-pnwwj3ncjz] { filter: brightness(1.15); transform: scale(1.05); }
[b-pnwwj3ncjz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pnwwj3ncjz] { padding: 0.75rem; }
    .crud-header[b-pnwwj3ncjz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pnwwj3ncjz] { font-size: 1.1rem; }
    .btn-text[b-pnwwj3ncjz] { display: none; }
    .form-row[b-pnwwj3ncjz] { flex-direction: column; }
    .form-row-4[b-pnwwj3ncjz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pnwwj3ncjz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pnwwj3ncjz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-pnwwj3ncjz] { padding: 0.75rem; }
    .modal-tabs[b-pnwwj3ncjz] { overflow-x: auto; }
    .modal-tab[b-pnwwj3ncjz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-pnwwj3ncjz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-pnwwj3ncjz] { display: grid !important; }
    .crud-cards-wrapper[b-pnwwj3ncjz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-pnwwj3ncjz] { grid-template-columns: 1fr; }
    .card-details[b-pnwwj3ncjz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-pnwwj3ncjz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pnwwj3ncjz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pnwwj3ncjz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pnwwj3ncjz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclgregistracargofamilia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xdvwxhit51] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xdvwxhit51 0.3s ease-out; }
@keyframes slideUp-b-xdvwxhit51 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xdvwxhit51] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xdvwxhit51] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xdvwxhit51] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xdvwxhit51] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xdvwxhit51] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xdvwxhit51] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xdvwxhit51] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xdvwxhit51] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xdvwxhit51] { filter: brightness(1.1); }
.btn-outline[b-xdvwxhit51] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xdvwxhit51] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xdvwxhit51] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xdvwxhit51] { filter: brightness(1.1); }
.btn-icon[b-xdvwxhit51] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xdvwxhit51] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xdvwxhit51] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xdvwxhit51] { color: #ef4444; }
.btn-delete:hover[b-xdvwxhit51] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xdvwxhit51] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xdvwxhit51] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xdvwxhit51] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xdvwxhit51] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xdvwxhit51] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xdvwxhit51] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xdvwxhit51] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xdvwxhit51] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xdvwxhit51] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xdvwxhit51] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xdvwxhit51] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xdvwxhit51] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xdvwxhit51] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xdvwxhit51] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xdvwxhit51] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xdvwxhit51] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xdvwxhit51] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xdvwxhit51] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xdvwxhit51] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xdvwxhit51] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xdvwxhit51] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xdvwxhit51] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xdvwxhit51] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xdvwxhit51] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xdvwxhit51] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xdvwxhit51] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xdvwxhit51] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xdvwxhit51] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xdvwxhit51] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xdvwxhit51] { display: block; }
.hide-on-cards[b-xdvwxhit51] { display: none !important; }
.show-on-cards[b-xdvwxhit51] { display: grid; }
.hide-on-grid[b-xdvwxhit51] { display: none !important; }

/* Badges */
.badge[b-xdvwxhit51] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xdvwxhit51] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xdvwxhit51] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xdvwxhit51] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xdvwxhit51] { text-align: center; }
.text-muted[b-xdvwxhit51] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xdvwxhit51], .crud-empty-state[b-xdvwxhit51] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xdvwxhit51] { font-size: 2rem; }
.crud-spinner[b-xdvwxhit51] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xdvwxhit51 0.6s linear infinite; }
.crud-spinner-sm[b-xdvwxhit51] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xdvwxhit51 0.6s linear infinite; }
@keyframes spin-b-xdvwxhit51 { to { transform: rotate(360deg); } }
.spin[b-xdvwxhit51] { animation: spin-b-xdvwxhit51 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xdvwxhit51] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xdvwxhit51 0.15s ease-out; }
.modal-container[b-xdvwxhit51] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xdvwxhit51] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xdvwxhit51 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xdvwxhit51] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xdvwxhit51] { max-width: 420px; }
@keyframes fadeIn-b-xdvwxhit51 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xdvwxhit51 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xdvwxhit51] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xdvwxhit51] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xdvwxhit51] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xdvwxhit51] { color: #dc2626; }
.modal-close[b-xdvwxhit51] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xdvwxhit51] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xdvwxhit51] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xdvwxhit51] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xdvwxhit51] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xdvwxhit51] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xdvwxhit51] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xdvwxhit51] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xdvwxhit51] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xdvwxhit51] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xdvwxhit51] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xdvwxhit51] { flex: 2; }
.form-group label[b-xdvwxhit51] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xdvwxhit51], .form-group select[b-xdvwxhit51], .form-textarea[b-xdvwxhit51] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xdvwxhit51], .form-group select:focus[b-xdvwxhit51], .form-textarea:focus[b-xdvwxhit51] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xdvwxhit51] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xdvwxhit51] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xdvwxhit51] { flex: 1; display: flex; align-items: center; }
.form-check[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xdvwxhit51] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xdvwxhit51] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xdvwxhit51] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xdvwxhit51] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xdvwxhit51] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xdvwxhit51] { font-size: 3rem; }
.photo-placeholder span[b-xdvwxhit51] { font-size: 0.78rem; }
.photo-actions[b-xdvwxhit51] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xdvwxhit51] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xdvwxhit51] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xdvwxhit51] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xdvwxhit51] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xdvwxhit51] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xdvwxhit51] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xdvwxhit51] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xdvwxhit51] { filter: brightness(1.15); transform: scale(1.05); }
[b-xdvwxhit51] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xdvwxhit51] { padding: 0.75rem; }
    .crud-header[b-xdvwxhit51] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xdvwxhit51] { font-size: 1.1rem; }
    .btn-text[b-xdvwxhit51] { display: none; }
    .form-row[b-xdvwxhit51] { flex-direction: column; }
    .form-row-4[b-xdvwxhit51] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xdvwxhit51] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xdvwxhit51] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xdvwxhit51] { padding: 0.75rem; }
    .modal-tabs[b-xdvwxhit51] { overflow-x: auto; }
    .modal-tab[b-xdvwxhit51] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xdvwxhit51] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xdvwxhit51] { display: grid !important; }
    .crud-cards-wrapper[b-xdvwxhit51] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xdvwxhit51] { grid-template-columns: 1fr; }
    .card-details[b-xdvwxhit51] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xdvwxhit51] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xdvwxhit51] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xdvwxhit51] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xdvwxhit51] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-xdvwxhit51] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-xdvwxhit51] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-xdvwxhit51] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-xdvwxhit51] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-xdvwxhit51] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-xdvwxhit51] { min-width: 140px; }
.param-band-input[b-xdvwxhit51] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-xdvwxhit51] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-xdvwxhit51] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-xdvwxhit51] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-xdvwxhit51] { border-bottom: none; }
.param-section-title[b-xdvwxhit51] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-xdvwxhit51] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-xdvwxhit51] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-xdvwxhit51] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-xdvwxhit51] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-xdvwxhit51] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-xdvwxhit51] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-xdvwxhit51] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-xdvwxhit51] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-xdvwxhit51] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-xdvwxhit51] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-xdvwxhit51] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-xdvwxhit51] { border-bottom: none; }
.help-section p[b-xdvwxhit51] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-xdvwxhit51], .help-section ol[b-xdvwxhit51] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-xdvwxhit51] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-xdvwxhit51] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-xdvwxhit51] { color: var(--rg-accent,#2563eb); }
.help-tip[b-xdvwxhit51] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-xdvwxhit51] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-xdvwxhit51] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-xdvwxhit51], .form-row-3[b-xdvwxhit51], .form-row-4[b-xdvwxhit51] { grid-template-columns: 1fr; }
    .param-band[b-xdvwxhit51] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-xdvwxhit51] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-xdvwxhit51] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-xdvwxhit51] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-xdvwxhit51] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-xdvwxhit51] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-xdvwxhit51] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-xdvwxhit51] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-xdvwxhit51] { color: var(--rg-accent, #2563eb); }

.form-hint[b-xdvwxhit51] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-xdvwxhit51] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-xdvwxhit51] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-xdvwxhit51] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-xdvwxhit51] { filter: brightness(1.1); }

.text-muted[b-xdvwxhit51] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-xdvwxhit51] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-xdvwxhit51] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-xdvwxhit51] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-xdvwxhit51] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-xdvwxhit51]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-xdvwxhit51] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-xdvwxhit51]::before {
    transform: translateX(16px);
}
.switch-text[b-xdvwxhit51] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-xdvwxhit51] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-xdvwxhit51] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-xdvwxhit51] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclgrenglonesatrasados.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qwtj1juucz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qwtj1juucz 0.3s ease-out; }
@keyframes slideUp-b-qwtj1juucz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qwtj1juucz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qwtj1juucz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qwtj1juucz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qwtj1juucz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qwtj1juucz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qwtj1juucz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qwtj1juucz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qwtj1juucz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qwtj1juucz] { filter: brightness(1.1); }
.btn-outline[b-qwtj1juucz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qwtj1juucz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qwtj1juucz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qwtj1juucz] { filter: brightness(1.1); }
.btn-icon[b-qwtj1juucz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qwtj1juucz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qwtj1juucz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qwtj1juucz] { color: #ef4444; }
.btn-delete:hover[b-qwtj1juucz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qwtj1juucz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qwtj1juucz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qwtj1juucz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qwtj1juucz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qwtj1juucz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qwtj1juucz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qwtj1juucz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qwtj1juucz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qwtj1juucz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qwtj1juucz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qwtj1juucz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qwtj1juucz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qwtj1juucz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qwtj1juucz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qwtj1juucz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qwtj1juucz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qwtj1juucz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qwtj1juucz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qwtj1juucz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qwtj1juucz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qwtj1juucz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qwtj1juucz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qwtj1juucz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qwtj1juucz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qwtj1juucz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qwtj1juucz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qwtj1juucz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qwtj1juucz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qwtj1juucz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qwtj1juucz] { display: block; }
.hide-on-cards[b-qwtj1juucz] { display: none !important; }
.show-on-cards[b-qwtj1juucz] { display: grid; }
.hide-on-grid[b-qwtj1juucz] { display: none !important; }

/* Badges */
.badge[b-qwtj1juucz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qwtj1juucz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qwtj1juucz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qwtj1juucz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qwtj1juucz] { text-align: center; }
.text-muted[b-qwtj1juucz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qwtj1juucz], .crud-empty-state[b-qwtj1juucz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qwtj1juucz] { font-size: 2rem; }
.crud-spinner[b-qwtj1juucz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qwtj1juucz 0.6s linear infinite; }
.crud-spinner-sm[b-qwtj1juucz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qwtj1juucz 0.6s linear infinite; }
@keyframes spin-b-qwtj1juucz { to { transform: rotate(360deg); } }
.spin[b-qwtj1juucz] { animation: spin-b-qwtj1juucz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qwtj1juucz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qwtj1juucz 0.15s ease-out; }
.modal-container[b-qwtj1juucz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qwtj1juucz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qwtj1juucz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qwtj1juucz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qwtj1juucz] { max-width: 420px; }
@keyframes fadeIn-b-qwtj1juucz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qwtj1juucz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qwtj1juucz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qwtj1juucz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qwtj1juucz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qwtj1juucz] { color: #dc2626; }
.modal-close[b-qwtj1juucz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qwtj1juucz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qwtj1juucz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qwtj1juucz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qwtj1juucz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qwtj1juucz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qwtj1juucz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qwtj1juucz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qwtj1juucz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qwtj1juucz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qwtj1juucz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qwtj1juucz] { flex: 2; }
.form-group label[b-qwtj1juucz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qwtj1juucz], .form-group select[b-qwtj1juucz], .form-textarea[b-qwtj1juucz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qwtj1juucz], .form-group select:focus[b-qwtj1juucz], .form-textarea:focus[b-qwtj1juucz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qwtj1juucz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qwtj1juucz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qwtj1juucz] { flex: 1; display: flex; align-items: center; }
.form-check[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qwtj1juucz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qwtj1juucz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qwtj1juucz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qwtj1juucz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qwtj1juucz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qwtj1juucz] { font-size: 3rem; }
.photo-placeholder span[b-qwtj1juucz] { font-size: 0.78rem; }
.photo-actions[b-qwtj1juucz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qwtj1juucz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qwtj1juucz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qwtj1juucz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qwtj1juucz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qwtj1juucz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qwtj1juucz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qwtj1juucz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qwtj1juucz] { filter: brightness(1.15); transform: scale(1.05); }
[b-qwtj1juucz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qwtj1juucz] { padding: 0.75rem; }
    .crud-header[b-qwtj1juucz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qwtj1juucz] { font-size: 1.1rem; }
    .btn-text[b-qwtj1juucz] { display: none; }
    .form-row[b-qwtj1juucz] { flex-direction: column; }
    .form-row-4[b-qwtj1juucz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qwtj1juucz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qwtj1juucz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qwtj1juucz] { padding: 0.75rem; }
    .modal-tabs[b-qwtj1juucz] { overflow-x: auto; }
    .modal-tab[b-qwtj1juucz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qwtj1juucz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qwtj1juucz] { display: grid !important; }
    .crud-cards-wrapper[b-qwtj1juucz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qwtj1juucz] { grid-template-columns: 1fr; }
    .card-details[b-qwtj1juucz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qwtj1juucz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qwtj1juucz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qwtj1juucz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qwtj1juucz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_actas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lra950slvj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lra950slvj 0.3s ease-out; }
@keyframes slideUp-b-lra950slvj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lra950slvj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lra950slvj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lra950slvj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lra950slvj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lra950slvj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lra950slvj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lra950slvj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lra950slvj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lra950slvj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lra950slvj] { filter: brightness(1.1); }
.btn-outline[b-lra950slvj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lra950slvj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lra950slvj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lra950slvj] { filter: brightness(1.1); }
.btn-icon[b-lra950slvj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lra950slvj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lra950slvj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lra950slvj] { color: #ef4444; }
.btn-delete:hover[b-lra950slvj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lra950slvj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lra950slvj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lra950slvj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lra950slvj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lra950slvj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lra950slvj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lra950slvj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lra950slvj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lra950slvj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lra950slvj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lra950slvj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lra950slvj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lra950slvj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lra950slvj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lra950slvj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lra950slvj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lra950slvj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lra950slvj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lra950slvj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lra950slvj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lra950slvj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lra950slvj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lra950slvj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lra950slvj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lra950slvj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lra950slvj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lra950slvj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lra950slvj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lra950slvj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lra950slvj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lra950slvj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lra950slvj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lra950slvj] { display: block; }
.hide-on-cards[b-lra950slvj] { display: none !important; }
.show-on-cards[b-lra950slvj] { display: grid; }
.hide-on-grid[b-lra950slvj] { display: none !important; }

/* Badges */
.badge[b-lra950slvj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lra950slvj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lra950slvj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lra950slvj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lra950slvj] { text-align: center; }
.text-muted[b-lra950slvj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lra950slvj], .crud-empty-state[b-lra950slvj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lra950slvj] { font-size: 2rem; }
.crud-spinner[b-lra950slvj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lra950slvj 0.6s linear infinite; }
.crud-spinner-sm[b-lra950slvj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lra950slvj 0.6s linear infinite; }
@keyframes spin-b-lra950slvj { to { transform: rotate(360deg); } }
.spin[b-lra950slvj] { animation: spin-b-lra950slvj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lra950slvj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lra950slvj 0.15s ease-out; }
.modal-container[b-lra950slvj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lra950slvj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lra950slvj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lra950slvj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lra950slvj] { max-width: 420px; }
@keyframes fadeIn-b-lra950slvj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lra950slvj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lra950slvj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lra950slvj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lra950slvj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lra950slvj] { color: #dc2626; }
.modal-close[b-lra950slvj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lra950slvj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lra950slvj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lra950slvj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lra950slvj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lra950slvj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lra950slvj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lra950slvj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lra950slvj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lra950slvj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lra950slvj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lra950slvj] { flex: 2; }
.form-group label[b-lra950slvj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lra950slvj], .form-group select[b-lra950slvj], .form-textarea[b-lra950slvj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lra950slvj], .form-group select:focus[b-lra950slvj], .form-textarea:focus[b-lra950slvj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lra950slvj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lra950slvj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lra950slvj] { flex: 1; display: flex; align-items: center; }
.form-check[b-lra950slvj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lra950slvj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lra950slvj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lra950slvj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lra950slvj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lra950slvj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lra950slvj] { font-size: 3rem; }
.photo-placeholder span[b-lra950slvj] { font-size: 0.78rem; }
.photo-actions[b-lra950slvj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lra950slvj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lra950slvj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lra950slvj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lra950slvj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lra950slvj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lra950slvj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lra950slvj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lra950slvj] { filter: brightness(1.15); transform: scale(1.05); }
[b-lra950slvj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lra950slvj] { padding: 0.75rem; }
    .crud-header[b-lra950slvj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lra950slvj] { font-size: 1.1rem; }
    .btn-text[b-lra950slvj] { display: none; }
    .form-row[b-lra950slvj] { flex-direction: column; }
    .form-row-4[b-lra950slvj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lra950slvj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lra950slvj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lra950slvj] { padding: 0.75rem; }
    .modal-tabs[b-lra950slvj] { overflow-x: auto; }
    .modal-tab[b-lra950slvj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lra950slvj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lra950slvj] { display: grid !important; }
    .crud-cards-wrapper[b-lra950slvj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lra950slvj] { grid-template-columns: 1fr; }
    .card-details[b-lra950slvj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lra950slvj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lra950slvj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lra950slvj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lra950slvj] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_asigna_materia_a_curso.razor.rz.scp.css */
/* ===================================================================
   Frmclg_asigna_materia_a_curso — Plantilla de materias por curso
   Auto-contenido (CSS isolation). Tokens --rg-* (claro + oscuro).
   =================================================================== */

.crud-container[b-xou7v4xd0k] { padding: 1.25rem 1.5rem; }

/* ── Header ── */
.crud-header[b-xou7v4xd0k] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; gap: 1rem; flex-wrap: wrap; }
.crud-header-left[b-xou7v4xd0k] { display: flex; align-items: center; gap: 0.85rem; }
.crud-header-icon[b-xou7v4xd0k] { font-size: 1.75rem; color: var(--rg-primary); }
.crud-title[b-xou7v4xd0k] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-xou7v4xd0k] { font-size: 0.8rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-xou7v4xd0k] { display: flex; gap: 0.5rem; align-items: center; }

/* ── Botones ── */
.btn-crud[b-xou7v4xd0k] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.85rem; border-radius: 0.5rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: all 0.15s; }
.btn-crud:disabled[b-xou7v4xd0k] { opacity: 0.55; cursor: not-allowed; }
.btn-primary[b-xou7v4xd0k] { background: var(--rg-primary); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xou7v4xd0k] { filter: brightness(1.08); }
.btn-outline[b-xou7v4xd0k] { background: var(--rg-bg-card); color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-xou7v4xd0k] { background: var(--rg-bg-hover); }
.btn-danger[b-xou7v4xd0k] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-xou7v4xd0k] { filter: brightness(1.08); }
.btn-help[b-xou7v4xd0k] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; }
.btn-help:hover[b-xou7v4xd0k] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-xou7v4xd0k] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
.spin[b-xou7v4xd0k] { animation: spin-b-xou7v4xd0k 0.8s linear infinite; }
@keyframes spin-b-xou7v4xd0k { to { transform: rotate(360deg); } }

/* ── Alert ── */
.crud-alert[b-xou7v4xd0k] { display: flex; align-items: center; gap: 0.5rem; padding: 0.65rem 0.9rem; border-radius: 0.5rem; font-size: 0.85rem; margin-bottom: 1rem; }
.crud-alert.success[b-xou7v4xd0k] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-xou7v4xd0k] { background: rgba(220,38,38,0.1); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-xou7v4xd0k] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-xou7v4xd0k] { color: #fca5a5; }
.crud-alert-close[b-xou7v4xd0k] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.7; }

/* ── Filtros / encabezado ── */
.am-filtros[b-xou7v4xd0k], .am-addbar[b-xou7v4xd0k] { display: flex; gap: 0.75rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.85rem; }
.am-field[b-xou7v4xd0k] { display: flex; flex-direction: column; gap: 0.25rem; min-width: 160px; }
.am-field-grow[b-xou7v4xd0k] { flex: 1; min-width: 240px; }
.am-field-sm[b-xou7v4xd0k] { min-width: 90px; max-width: 110px; }
.am-field label[b-xou7v4xd0k] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); }
.am-field select[b-xou7v4xd0k], .am-field input[b-xou7v4xd0k], .am-autocomplete input[b-xou7v4xd0k] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; font-size: 0.85rem; width: 100%; }
.am-field select:focus[b-xou7v4xd0k], .am-field input:focus[b-xou7v4xd0k], .am-autocomplete input:focus[b-xou7v4xd0k] { outline: none; border-color: var(--rg-primary); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* ── Autocomplete ── */
.am-autocomplete[b-xou7v4xd0k] { position: relative; width: 100%; }
.am-clear[b-xou7v4xd0k] { position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 0.75rem; }
.am-dropdown[b-xou7v4xd0k] { position: absolute; top: calc(100% + 2px); left: 0; right: 0; z-index: 50; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; box-shadow: 0 12px 30px rgba(0,0,0,0.15); max-height: 260px; overflow-y: auto; }
.am-dropdown-item[b-xou7v4xd0k] { display: flex; align-items: center; gap: 0.55rem; padding: 0.5rem 0.7rem; cursor: pointer; font-size: 0.84rem; color: var(--rg-text-primary); border-bottom: 1px solid var(--rg-border); }
.am-dropdown-item:last-child[b-xou7v4xd0k] { border-bottom: none; }
.am-dropdown-item:hover[b-xou7v4xd0k] { background: var(--rg-bg-hover); }
.am-code[b-xou7v4xd0k] { font-family: 'Cascadia Code', monospace; font-size: 0.74rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); padding: 0.05rem 0.35rem; border-radius: 0.3rem; }

/* ── Grid ── */
.crud-grid-wrapper[b-xou7v4xd0k] { border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: auto; max-height: calc(100vh - 360px); }
.crud-table[b-xou7v4xd0k] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead th[b-xou7v4xd0k] { position: sticky; top: 0; background: var(--rg-bg-subtle); color: var(--rg-text-muted); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; text-align: left; padding: 0.6rem 0.7rem; border-bottom: 2px solid var(--rg-border); }
.crud-table tbody td[b-xou7v4xd0k] { padding: 0.5rem 0.7rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-secondary); background: var(--rg-bg-card); }
.crud-table tbody tr:hover td[b-xou7v4xd0k] { background: var(--rg-bg-hover); }
.text-center[b-xou7v4xd0k] { text-align: center; }
.col-actions[b-xou7v4xd0k] { text-align: right; white-space: nowrap; width: 90px; }
.font-mono[b-xou7v4xd0k] { font-family: 'Cascadia Code', monospace; font-size: 0.8rem; }
.am-icon[b-xou7v4xd0k] { width: 28px; height: 28px; border-radius: 0.4rem; display: flex; align-items: center; justify-content: center; background: rgba(37,99,235,0.12); color: var(--rg-accent,#2563eb); }
.am-count[b-xou7v4xd0k] { font-size: 0.78rem; color: var(--rg-text-muted); margin-top: 0.5rem; }

.btn-icon[b-xou7v4xd0k] { background: none; border: none; cursor: pointer; padding: 0.3rem 0.4rem; border-radius: 0.4rem; font-size: 0.95rem; }
.btn-delete[b-xou7v4xd0k] { color: var(--rg-danger); }
.btn-delete:hover[b-xou7v4xd0k] { background: rgba(220,38,38,0.12); }

/* ── Estados ── */
.crud-loading[b-xou7v4xd0k], .crud-empty-state[b-xou7v4xd0k] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.65rem; padding: 2.5rem; color: var(--rg-text-muted); text-align: center; }
.crud-empty-state i[b-xou7v4xd0k] { font-size: 2.25rem; opacity: 0.5; }
.crud-spinner[b-xou7v4xd0k] { width: 26px; height: 26px; border: 3px solid var(--rg-border); border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-b-xou7v4xd0k 0.8s linear infinite; }

/* ── Modal ── */
.modal-backdrop[b-xou7v4xd0k] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-xou7v4xd0k] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xou7v4xd0k] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-xou7v4xd0k] { max-width: 440px; }
.modal-lg[b-xou7v4xd0k] { max-width: 680px; }
.modal-header[b-xou7v4xd0k] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xou7v4xd0k] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-xou7v4xd0k] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xou7v4xd0k] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-xou7v4xd0k] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-body .am-field[b-xou7v4xd0k] { margin-bottom: 0.75rem; min-width: 0; }
.modal-footer[b-xou7v4xd0k] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.am-help-text[b-xou7v4xd0k] { font-size: 0.82rem; color: var(--rg-text-secondary); margin-bottom: 0.85rem; }

/* ── Help modal ── */
.help-icon-header[b-xou7v4xd0k] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-xou7v4xd0k] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-xou7v4xd0k] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-xou7v4xd0k] { border-bottom: none; }
.help-section p[b-xou7v4xd0k] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-xou7v4xd0k] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-xou7v4xd0k] { color: var(--rg-accent,#2563eb); }
.help-tip[b-xou7v4xd0k] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-xou7v4xd0k] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-xou7v4xd0k] { background: rgba(37,99,235,0.12); }
.help-steps[b-xou7v4xd0k] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-xou7v4xd0k] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-xou7v4xd0k] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-xou7v4xd0k] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* ── Selector de vista (Grid · Tarjetas) ── */
.view-toggle[b-xou7v4xd0k] { display: inline-flex; gap: 0.25rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.55rem; padding: 0.2rem; margin-bottom: 0.85rem; }
.vt-btn[b-xou7v4xd0k] { display: inline-flex; align-items: center; gap: 0.4rem; background: transparent; border: none; cursor: pointer; color: var(--rg-text-secondary); font-size: 0.82rem; font-weight: 600; padding: 0.4rem 0.8rem; border-radius: 0.4rem; transition: all 0.15s; }
.vt-btn:hover[b-xou7v4xd0k] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.vt-btn.active[b-xou7v4xd0k] { background: var(--rg-primary); color: #fff; box-shadow: 0 2px 6px rgba(26,58,92,0.25); }
.vt-btn i[b-xou7v4xd0k] { font-size: 0.95rem; }

/* ── Vista TARJETAS — cada campo en su propia línea ── */
.am-cards[b-xou7v4xd0k] { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.75rem; }
.am-card[b-xou7v4xd0k] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-left: 4px solid var(--rg-primary); border-radius: 0.6rem; padding: 0.75rem 0.85rem; display: flex; flex-direction: column; gap: 0.3rem; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.am-card-head[b-xou7v4xd0k] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.3rem; }
.am-card-title[b-xou7v4xd0k] { font-size: 0.92rem; font-weight: 700; color: var(--rg-text-primary); }
.am-card-row[b-xou7v4xd0k] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.6rem; padding: 0.22rem 0; border-bottom: 1px dashed var(--rg-border); font-size: 0.82rem; }
.am-card-row:last-of-type[b-xou7v4xd0k] { border-bottom: none; }
.am-card-label[b-xou7v4xd0k] { color: var(--rg-text-muted); font-weight: 600; text-transform: uppercase; font-size: 0.68rem; letter-spacing: 0.03em; }
.am-card-val[b-xou7v4xd0k] { color: var(--rg-text-primary); text-align: right; }
.am-card-actions[b-xou7v4xd0k] { display: flex; justify-content: flex-end; margin-top: 0.4rem; }
.am-card-actions .btn-icon[b-xou7v4xd0k] { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.82rem; padding: 0.35rem 0.6rem; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_asigna_materia_a_profesor_por_curso.razor.rz.scp.css */
/* ===================================================================
   Frmclg_asigna_materia_a_curso — Plantilla de materias por curso
   Auto-contenido (CSS isolation). Tokens --rg-* (claro + oscuro).
   =================================================================== */

.crud-container[b-o1en85bllf] { padding: 1.25rem 1.5rem; }

/* ── Header ── */
.crud-header[b-o1en85bllf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; gap: 1rem; flex-wrap: wrap; }
.crud-header-left[b-o1en85bllf] { display: flex; align-items: center; gap: 0.85rem; }
.crud-header-icon[b-o1en85bllf] { font-size: 1.75rem; color: var(--rg-primary); }
.crud-title[b-o1en85bllf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-o1en85bllf] { font-size: 0.8rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-o1en85bllf] { display: flex; gap: 0.5rem; align-items: center; }

/* ── Botones ── */
.btn-crud[b-o1en85bllf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 0.85rem; border-radius: 0.5rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: all 0.15s; }
.btn-crud:disabled[b-o1en85bllf] { opacity: 0.55; cursor: not-allowed; }
.btn-primary[b-o1en85bllf] { background: var(--rg-primary); color: #fff; }
.btn-primary:hover:not(:disabled)[b-o1en85bllf] { filter: brightness(1.08); }
.btn-outline[b-o1en85bllf] { background: var(--rg-bg-card); color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-o1en85bllf] { background: var(--rg-bg-hover); }
.btn-danger[b-o1en85bllf] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-o1en85bllf] { filter: brightness(1.08); }
.btn-help[b-o1en85bllf] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; }
.btn-help:hover[b-o1en85bllf] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-o1en85bllf] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
.spin[b-o1en85bllf] { animation: spin-b-o1en85bllf 0.8s linear infinite; }
@keyframes spin-b-o1en85bllf { to { transform: rotate(360deg); } }

/* ── Alert ── */
.crud-alert[b-o1en85bllf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.65rem 0.9rem; border-radius: 0.5rem; font-size: 0.85rem; margin-bottom: 1rem; }
.crud-alert.success[b-o1en85bllf] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-o1en85bllf] { background: rgba(220,38,38,0.1); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-o1en85bllf] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-o1en85bllf] { color: #fca5a5; }
.crud-alert-close[b-o1en85bllf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.7; }

/* ── Filtros / encabezado ── */
.am-filtros[b-o1en85bllf], .am-addbar[b-o1en85bllf] { display: flex; gap: 0.75rem; align-items: flex-end; flex-wrap: wrap; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.85rem; }
.am-field[b-o1en85bllf] { display: flex; flex-direction: column; gap: 0.25rem; min-width: 160px; }
.am-field-grow[b-o1en85bllf] { flex: 1; min-width: 240px; }
.am-field-sm[b-o1en85bllf] { min-width: 90px; max-width: 110px; }
.am-field label[b-o1en85bllf] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); }
.am-field select[b-o1en85bllf], .am-field input[b-o1en85bllf], .am-autocomplete input[b-o1en85bllf] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.45rem 0.6rem; font-size: 0.85rem; width: 100%; }
.am-field select:focus[b-o1en85bllf], .am-field input:focus[b-o1en85bllf], .am-autocomplete input:focus[b-o1en85bllf] { outline: none; border-color: var(--rg-primary); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* ── Autocomplete ── */
.am-autocomplete[b-o1en85bllf] { position: relative; width: 100%; }
.am-clear[b-o1en85bllf] { position: absolute; right: 0.4rem; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 0.75rem; }
.am-dropdown[b-o1en85bllf] { position: absolute; top: calc(100% + 2px); left: 0; right: 0; z-index: 50; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; box-shadow: 0 12px 30px rgba(0,0,0,0.15); max-height: 260px; overflow-y: auto; }
.am-dropdown-item[b-o1en85bllf] { display: flex; align-items: center; gap: 0.55rem; padding: 0.5rem 0.7rem; cursor: pointer; font-size: 0.84rem; color: var(--rg-text-primary); border-bottom: 1px solid var(--rg-border); }
.am-dropdown-item:last-child[b-o1en85bllf] { border-bottom: none; }
.am-dropdown-item:hover[b-o1en85bllf] { background: var(--rg-bg-hover); }
.am-code[b-o1en85bllf] { font-family: 'Cascadia Code', monospace; font-size: 0.74rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); padding: 0.05rem 0.35rem; border-radius: 0.3rem; }

/* ── Grid ── */
.crud-grid-wrapper[b-o1en85bllf] { border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: auto; max-height: calc(100vh - 360px); }
.crud-table[b-o1en85bllf] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead th[b-o1en85bllf] { position: sticky; top: 0; background: var(--rg-bg-subtle); color: var(--rg-text-muted); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; text-align: left; padding: 0.6rem 0.7rem; border-bottom: 2px solid var(--rg-border); }
.crud-table tbody td[b-o1en85bllf] { padding: 0.5rem 0.7rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-secondary); background: var(--rg-bg-card); }
.crud-table tbody tr:hover td[b-o1en85bllf] { background: var(--rg-bg-hover); }
.text-center[b-o1en85bllf] { text-align: center; }
.col-actions[b-o1en85bllf] { text-align: right; white-space: nowrap; width: 90px; }
.font-mono[b-o1en85bllf] { font-family: 'Cascadia Code', monospace; font-size: 0.8rem; }
.am-icon[b-o1en85bllf] { width: 28px; height: 28px; border-radius: 0.4rem; display: flex; align-items: center; justify-content: center; background: rgba(22,163,74,0.14); color: var(--rg-success,#16a34a); }
.am-icon-empty[b-o1en85bllf] { background: rgba(148,163,184,0.18); color: var(--rg-text-muted,#94a3b8); }

/* ── Celda de asignación de profesor ── */
.am-prof-cell[b-o1en85bllf] { display: flex; flex-direction: column; gap: 0.3rem; }
.am-noresult[b-o1en85bllf] { padding: 0.55rem 0.7rem; font-size: 0.8rem; color: var(--rg-danger,#dc2626); display: flex; align-items: center; gap: 0.4rem; }
.am-prof-ok[b-o1en85bllf] { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.8rem; font-weight: 600; color: #16a34a; background: rgba(22,163,74,0.1); border: 1px solid rgba(22,163,74,0.25); border-radius: 0.4rem; padding: 0.2rem 0.5rem; width: fit-content; }
.am-prof-ok i[b-o1en85bllf] { font-size: 0.85rem; }
[data-mode="dark"] .am-prof-ok[b-o1en85bllf] { color: #86efac; background: rgba(22,163,74,0.16); border-color: rgba(22,163,74,0.35); }
.am-prof-empty[b-o1en85bllf] { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.76rem; color: var(--rg-text-muted,#94a3b8); padding: 0.1rem 0.2rem; }
.am-count[b-o1en85bllf] { font-size: 0.78rem; color: var(--rg-text-muted); margin-top: 0.5rem; }

.btn-icon[b-o1en85bllf] { background: none; border: none; cursor: pointer; padding: 0.3rem 0.4rem; border-radius: 0.4rem; font-size: 0.95rem; }
.btn-delete[b-o1en85bllf] { color: var(--rg-danger); }
.btn-delete:hover[b-o1en85bllf] { background: rgba(220,38,38,0.12); }

/* ── Estados ── */
.crud-loading[b-o1en85bllf], .crud-empty-state[b-o1en85bllf] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.65rem; padding: 2.5rem; color: var(--rg-text-muted); text-align: center; }
.crud-empty-state i[b-o1en85bllf] { font-size: 2.25rem; opacity: 0.5; }
.crud-spinner[b-o1en85bllf] { width: 26px; height: 26px; border: 3px solid var(--rg-border); border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-b-o1en85bllf 0.8s linear infinite; }

/* ── Modal ── */
.modal-backdrop[b-o1en85bllf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-o1en85bllf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-o1en85bllf] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-o1en85bllf] { max-width: 440px; }
.modal-lg[b-o1en85bllf] { max-width: 680px; }
.modal-header[b-o1en85bllf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-o1en85bllf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-o1en85bllf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-o1en85bllf] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-o1en85bllf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-body .am-field[b-o1en85bllf] { margin-bottom: 0.75rem; min-width: 0; }
.modal-footer[b-o1en85bllf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.am-help-text[b-o1en85bllf] { font-size: 0.82rem; color: var(--rg-text-secondary); margin-bottom: 0.85rem; }

/* ── Help modal ── */
.help-icon-header[b-o1en85bllf] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-o1en85bllf] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-o1en85bllf] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-o1en85bllf] { border-bottom: none; }
.help-section p[b-o1en85bllf] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-o1en85bllf] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-o1en85bllf] { color: var(--rg-accent,#2563eb); }
.help-tip[b-o1en85bllf] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-o1en85bllf] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-o1en85bllf] { background: rgba(37,99,235,0.12); }
.help-steps[b-o1en85bllf] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-o1en85bllf] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-o1en85bllf] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-o1en85bllf] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* ── Selector de vista (Grid · Tarjetas) ── */
.view-toggle[b-o1en85bllf] { display: inline-flex; gap: 0.25rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.55rem; padding: 0.2rem; margin-bottom: 0.85rem; }
.vt-btn[b-o1en85bllf] { display: inline-flex; align-items: center; gap: 0.4rem; background: transparent; border: none; cursor: pointer; color: var(--rg-text-secondary); font-size: 0.82rem; font-weight: 600; padding: 0.4rem 0.8rem; border-radius: 0.4rem; transition: all 0.15s; }
.vt-btn:hover[b-o1en85bllf] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.vt-btn.active[b-o1en85bllf] { background: var(--rg-primary); color: #fff; box-shadow: 0 2px 6px rgba(26,58,92,0.25); }
.vt-btn i[b-o1en85bllf] { font-size: 0.95rem; }

/* ── Vista TARJETAS — cada campo en su propia línea ── */
.am-cards[b-o1en85bllf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.75rem; }
.am-card[b-o1en85bllf] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-left: 4px solid var(--rg-primary); border-radius: 0.6rem; padding: 0.75rem 0.85rem; display: flex; flex-direction: column; gap: 0.3rem; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.am-card-head[b-o1en85bllf] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.3rem; }
.am-card-title[b-o1en85bllf] { font-size: 0.92rem; font-weight: 700; color: var(--rg-text-primary); }
.am-card-row[b-o1en85bllf] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.6rem; padding: 0.22rem 0; border-bottom: 1px dashed var(--rg-border); font-size: 0.82rem; }
.am-card-label[b-o1en85bllf] { color: var(--rg-text-muted); font-weight: 600; text-transform: uppercase; font-size: 0.68rem; letter-spacing: 0.03em; }
.am-card-val[b-o1en85bllf] { color: var(--rg-text-primary); text-align: right; }
/* Campo a ancho completo (control de profesor) — etiqueta arriba, control debajo */
.am-card-field[b-o1en85bllf] { display: flex; flex-direction: column; gap: 0.35rem; padding-top: 0.4rem; border-top: 1px dashed var(--rg-border); margin-top: 0.15rem; }
.am-card-field .am-card-label[b-o1en85bllf] { margin-bottom: 0.1rem; }
.am-card-field .am-prof-cell[b-o1en85bllf] { width: 100%; }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_asigna_numero_orde_alumno.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-jwzdoniyzh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jwzdoniyzh 0.3s ease-out; }
@keyframes slideUp-b-jwzdoniyzh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jwzdoniyzh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jwzdoniyzh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jwzdoniyzh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jwzdoniyzh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jwzdoniyzh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jwzdoniyzh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jwzdoniyzh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jwzdoniyzh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jwzdoniyzh] { filter: brightness(1.1); }
.btn-outline[b-jwzdoniyzh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jwzdoniyzh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jwzdoniyzh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jwzdoniyzh] { filter: brightness(1.1); }
.btn-icon[b-jwzdoniyzh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jwzdoniyzh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jwzdoniyzh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jwzdoniyzh] { color: #ef4444; }
.btn-delete:hover[b-jwzdoniyzh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-jwzdoniyzh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jwzdoniyzh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jwzdoniyzh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jwzdoniyzh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jwzdoniyzh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jwzdoniyzh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-jwzdoniyzh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jwzdoniyzh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-jwzdoniyzh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jwzdoniyzh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jwzdoniyzh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jwzdoniyzh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jwzdoniyzh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jwzdoniyzh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jwzdoniyzh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-jwzdoniyzh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-jwzdoniyzh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-jwzdoniyzh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-jwzdoniyzh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-jwzdoniyzh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-jwzdoniyzh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-jwzdoniyzh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-jwzdoniyzh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-jwzdoniyzh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-jwzdoniyzh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-jwzdoniyzh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-jwzdoniyzh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-jwzdoniyzh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-jwzdoniyzh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-jwzdoniyzh] { display: block; }
.hide-on-cards[b-jwzdoniyzh] { display: none !important; }
.show-on-cards[b-jwzdoniyzh] { display: grid; }
.hide-on-grid[b-jwzdoniyzh] { display: none !important; }

/* Badges */
.badge[b-jwzdoniyzh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jwzdoniyzh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jwzdoniyzh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-jwzdoniyzh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jwzdoniyzh] { text-align: center; }
.text-muted[b-jwzdoniyzh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jwzdoniyzh], .crud-empty-state[b-jwzdoniyzh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jwzdoniyzh] { font-size: 2rem; }
.crud-spinner[b-jwzdoniyzh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jwzdoniyzh 0.6s linear infinite; }
.crud-spinner-sm[b-jwzdoniyzh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jwzdoniyzh 0.6s linear infinite; }
@keyframes spin-b-jwzdoniyzh { to { transform: rotate(360deg); } }
.spin[b-jwzdoniyzh] { animation: spin-b-jwzdoniyzh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-jwzdoniyzh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jwzdoniyzh 0.15s ease-out; }
.modal-container[b-jwzdoniyzh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jwzdoniyzh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jwzdoniyzh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-jwzdoniyzh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-jwzdoniyzh] { max-width: 420px; }
@keyframes fadeIn-b-jwzdoniyzh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jwzdoniyzh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jwzdoniyzh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jwzdoniyzh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-jwzdoniyzh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-jwzdoniyzh] { color: #dc2626; }
.modal-close[b-jwzdoniyzh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jwzdoniyzh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jwzdoniyzh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jwzdoniyzh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jwzdoniyzh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-jwzdoniyzh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jwzdoniyzh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jwzdoniyzh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jwzdoniyzh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jwzdoniyzh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jwzdoniyzh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jwzdoniyzh] { flex: 2; }
.form-group label[b-jwzdoniyzh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jwzdoniyzh], .form-group select[b-jwzdoniyzh], .form-textarea[b-jwzdoniyzh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jwzdoniyzh], .form-group select:focus[b-jwzdoniyzh], .form-textarea:focus[b-jwzdoniyzh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jwzdoniyzh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jwzdoniyzh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jwzdoniyzh] { flex: 1; display: flex; align-items: center; }
.form-check[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jwzdoniyzh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-jwzdoniyzh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-jwzdoniyzh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-jwzdoniyzh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-jwzdoniyzh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-jwzdoniyzh] { font-size: 3rem; }
.photo-placeholder span[b-jwzdoniyzh] { font-size: 0.78rem; }
.photo-actions[b-jwzdoniyzh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-jwzdoniyzh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-jwzdoniyzh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-jwzdoniyzh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-jwzdoniyzh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-jwzdoniyzh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-jwzdoniyzh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-jwzdoniyzh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-jwzdoniyzh] { filter: brightness(1.15); transform: scale(1.05); }
[b-jwzdoniyzh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jwzdoniyzh] { padding: 0.75rem; }
    .crud-header[b-jwzdoniyzh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jwzdoniyzh] { font-size: 1.1rem; }
    .btn-text[b-jwzdoniyzh] { display: none; }
    .form-row[b-jwzdoniyzh] { flex-direction: column; }
    .form-row-4[b-jwzdoniyzh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jwzdoniyzh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jwzdoniyzh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-jwzdoniyzh] { padding: 0.75rem; }
    .modal-tabs[b-jwzdoniyzh] { overflow-x: auto; }
    .modal-tab[b-jwzdoniyzh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-jwzdoniyzh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-jwzdoniyzh] { display: grid !important; }
    .crud-cards-wrapper[b-jwzdoniyzh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-jwzdoniyzh] { grid-template-columns: 1fr; }
    .card-details[b-jwzdoniyzh] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-jwzdoniyzh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jwzdoniyzh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jwzdoniyzh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jwzdoniyzh] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_bloqueoalumnoimpresionnota.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zs7hkbo0jy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zs7hkbo0jy 0.3s ease-out; }
@keyframes slideUp-b-zs7hkbo0jy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zs7hkbo0jy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zs7hkbo0jy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zs7hkbo0jy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zs7hkbo0jy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zs7hkbo0jy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zs7hkbo0jy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zs7hkbo0jy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zs7hkbo0jy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zs7hkbo0jy] { filter: brightness(1.1); }
.btn-outline[b-zs7hkbo0jy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zs7hkbo0jy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zs7hkbo0jy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zs7hkbo0jy] { filter: brightness(1.1); }
.btn-icon[b-zs7hkbo0jy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zs7hkbo0jy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zs7hkbo0jy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zs7hkbo0jy] { color: #ef4444; }
.btn-delete:hover[b-zs7hkbo0jy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zs7hkbo0jy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zs7hkbo0jy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zs7hkbo0jy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zs7hkbo0jy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zs7hkbo0jy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zs7hkbo0jy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zs7hkbo0jy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zs7hkbo0jy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zs7hkbo0jy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zs7hkbo0jy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zs7hkbo0jy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zs7hkbo0jy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zs7hkbo0jy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zs7hkbo0jy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zs7hkbo0jy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zs7hkbo0jy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zs7hkbo0jy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zs7hkbo0jy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zs7hkbo0jy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zs7hkbo0jy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zs7hkbo0jy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zs7hkbo0jy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zs7hkbo0jy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zs7hkbo0jy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zs7hkbo0jy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zs7hkbo0jy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zs7hkbo0jy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zs7hkbo0jy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zs7hkbo0jy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zs7hkbo0jy] { display: block; }
.hide-on-cards[b-zs7hkbo0jy] { display: none !important; }
.show-on-cards[b-zs7hkbo0jy] { display: grid; }
.hide-on-grid[b-zs7hkbo0jy] { display: none !important; }

/* Badges */
.badge[b-zs7hkbo0jy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zs7hkbo0jy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zs7hkbo0jy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zs7hkbo0jy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zs7hkbo0jy] { text-align: center; }
.text-muted[b-zs7hkbo0jy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zs7hkbo0jy], .crud-empty-state[b-zs7hkbo0jy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zs7hkbo0jy] { font-size: 2rem; }
.crud-spinner[b-zs7hkbo0jy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zs7hkbo0jy 0.6s linear infinite; }
.crud-spinner-sm[b-zs7hkbo0jy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zs7hkbo0jy 0.6s linear infinite; }
@keyframes spin-b-zs7hkbo0jy { to { transform: rotate(360deg); } }
.spin[b-zs7hkbo0jy] { animation: spin-b-zs7hkbo0jy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zs7hkbo0jy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zs7hkbo0jy 0.15s ease-out; }
.modal-container[b-zs7hkbo0jy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zs7hkbo0jy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zs7hkbo0jy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zs7hkbo0jy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zs7hkbo0jy] { max-width: 420px; }
@keyframes fadeIn-b-zs7hkbo0jy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zs7hkbo0jy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zs7hkbo0jy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zs7hkbo0jy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zs7hkbo0jy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zs7hkbo0jy] { color: #dc2626; }
.modal-close[b-zs7hkbo0jy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zs7hkbo0jy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zs7hkbo0jy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zs7hkbo0jy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zs7hkbo0jy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zs7hkbo0jy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zs7hkbo0jy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zs7hkbo0jy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zs7hkbo0jy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zs7hkbo0jy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zs7hkbo0jy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zs7hkbo0jy] { flex: 2; }
.form-group label[b-zs7hkbo0jy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zs7hkbo0jy], .form-group select[b-zs7hkbo0jy], .form-textarea[b-zs7hkbo0jy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zs7hkbo0jy], .form-group select:focus[b-zs7hkbo0jy], .form-textarea:focus[b-zs7hkbo0jy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zs7hkbo0jy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zs7hkbo0jy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zs7hkbo0jy] { flex: 1; display: flex; align-items: center; }
.form-check[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zs7hkbo0jy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zs7hkbo0jy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zs7hkbo0jy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zs7hkbo0jy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zs7hkbo0jy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zs7hkbo0jy] { font-size: 3rem; }
.photo-placeholder span[b-zs7hkbo0jy] { font-size: 0.78rem; }
.photo-actions[b-zs7hkbo0jy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zs7hkbo0jy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zs7hkbo0jy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zs7hkbo0jy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zs7hkbo0jy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zs7hkbo0jy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zs7hkbo0jy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zs7hkbo0jy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zs7hkbo0jy] { filter: brightness(1.15); transform: scale(1.05); }
[b-zs7hkbo0jy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zs7hkbo0jy] { padding: 0.75rem; }
    .crud-header[b-zs7hkbo0jy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zs7hkbo0jy] { font-size: 1.1rem; }
    .btn-text[b-zs7hkbo0jy] { display: none; }
    .form-row[b-zs7hkbo0jy] { flex-direction: column; }
    .form-row-4[b-zs7hkbo0jy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zs7hkbo0jy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zs7hkbo0jy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zs7hkbo0jy] { padding: 0.75rem; }
    .modal-tabs[b-zs7hkbo0jy] { overflow-x: auto; }
    .modal-tab[b-zs7hkbo0jy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zs7hkbo0jy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zs7hkbo0jy] { display: grid !important; }
    .crud-cards-wrapper[b-zs7hkbo0jy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zs7hkbo0jy] { grid-template-columns: 1fr; }
    .card-details[b-zs7hkbo0jy] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zs7hkbo0jy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zs7hkbo0jy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zs7hkbo0jy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zs7hkbo0jy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_costo_curso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-szllmgmf30] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-szllmgmf30 0.3s ease-out; }
@keyframes slideUp-b-szllmgmf30 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-szllmgmf30] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-szllmgmf30] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-szllmgmf30] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-szllmgmf30] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-szllmgmf30] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-szllmgmf30] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-szllmgmf30] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-szllmgmf30] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-szllmgmf30] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-szllmgmf30] { filter: brightness(1.1); }
.btn-outline[b-szllmgmf30] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-szllmgmf30] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-szllmgmf30] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-szllmgmf30] { filter: brightness(1.1); }
.btn-icon[b-szllmgmf30] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-szllmgmf30] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-szllmgmf30] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-szllmgmf30] { color: #ef4444; }
.btn-delete:hover[b-szllmgmf30] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-szllmgmf30] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-szllmgmf30] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-szllmgmf30] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-szllmgmf30] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-szllmgmf30] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-szllmgmf30] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-szllmgmf30] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-szllmgmf30] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-szllmgmf30] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-szllmgmf30] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-szllmgmf30] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-szllmgmf30] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-szllmgmf30] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-szllmgmf30] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-szllmgmf30] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-szllmgmf30] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-szllmgmf30] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-szllmgmf30] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-szllmgmf30] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-szllmgmf30] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-szllmgmf30] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-szllmgmf30] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-szllmgmf30] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-szllmgmf30] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-szllmgmf30] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-szllmgmf30] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-szllmgmf30] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-szllmgmf30] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-szllmgmf30] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-szllmgmf30] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-szllmgmf30] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-szllmgmf30] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-szllmgmf30] { display: block; }
.hide-on-cards[b-szllmgmf30] { display: none !important; }
.show-on-cards[b-szllmgmf30] { display: grid; }
.hide-on-grid[b-szllmgmf30] { display: none !important; }

/* Badges */
.badge[b-szllmgmf30] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-szllmgmf30] { background: #ecfdf5; color: #065f46; }
.badge-no[b-szllmgmf30] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-szllmgmf30] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-szllmgmf30] { text-align: center; }
.text-muted[b-szllmgmf30] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-szllmgmf30], .crud-empty-state[b-szllmgmf30] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-szllmgmf30] { font-size: 2rem; }
.crud-spinner[b-szllmgmf30] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-szllmgmf30 0.6s linear infinite; }
.crud-spinner-sm[b-szllmgmf30] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-szllmgmf30 0.6s linear infinite; }
@keyframes spin-b-szllmgmf30 { to { transform: rotate(360deg); } }
.spin[b-szllmgmf30] { animation: spin-b-szllmgmf30 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-szllmgmf30] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-szllmgmf30 0.15s ease-out; }
.modal-container[b-szllmgmf30] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-szllmgmf30] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-szllmgmf30 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-szllmgmf30] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-szllmgmf30] { max-width: 420px; }
@keyframes fadeIn-b-szllmgmf30 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-szllmgmf30 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-szllmgmf30] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-szllmgmf30] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-szllmgmf30] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-szllmgmf30] { color: #dc2626; }
.modal-close[b-szllmgmf30] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-szllmgmf30] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-szllmgmf30] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-szllmgmf30] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-szllmgmf30] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-szllmgmf30] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-szllmgmf30] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-szllmgmf30] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-szllmgmf30] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-szllmgmf30] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-szllmgmf30] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-szllmgmf30] { flex: 2; }
.form-group label[b-szllmgmf30] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-szllmgmf30], .form-group select[b-szllmgmf30], .form-textarea[b-szllmgmf30] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-szllmgmf30], .form-group select:focus[b-szllmgmf30], .form-textarea:focus[b-szllmgmf30] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-szllmgmf30] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-szllmgmf30] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-szllmgmf30] { flex: 1; display: flex; align-items: center; }
.form-check[b-szllmgmf30] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-szllmgmf30] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-szllmgmf30] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-szllmgmf30] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-szllmgmf30] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-szllmgmf30] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-szllmgmf30] { font-size: 3rem; }
.photo-placeholder span[b-szllmgmf30] { font-size: 0.78rem; }
.photo-actions[b-szllmgmf30] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-szllmgmf30] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-szllmgmf30] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-szllmgmf30] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-szllmgmf30] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-szllmgmf30] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-szllmgmf30] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-szllmgmf30] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-szllmgmf30] { filter: brightness(1.15); transform: scale(1.05); }
[b-szllmgmf30] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-szllmgmf30] { padding: 0.75rem; }
    .crud-header[b-szllmgmf30] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-szllmgmf30] { font-size: 1.1rem; }
    .btn-text[b-szllmgmf30] { display: none; }
    .form-row[b-szllmgmf30] { flex-direction: column; }
    .form-row-4[b-szllmgmf30] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-szllmgmf30] { width: 98%; max-height: 95vh; }
    .modal-lg[b-szllmgmf30] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-szllmgmf30] { padding: 0.75rem; }
    .modal-tabs[b-szllmgmf30] { overflow-x: auto; }
    .modal-tab[b-szllmgmf30] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-szllmgmf30] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-szllmgmf30] { display: grid !important; }
    .crud-cards-wrapper[b-szllmgmf30] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-szllmgmf30] { grid-template-columns: 1fr; }
    .card-details[b-szllmgmf30] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-szllmgmf30] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-szllmgmf30] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-szllmgmf30] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-szllmgmf30] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_cursos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h9iar4l0ly] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h9iar4l0ly 0.3s ease-out; }
@keyframes slideUp-b-h9iar4l0ly { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h9iar4l0ly] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h9iar4l0ly] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h9iar4l0ly] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h9iar4l0ly] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h9iar4l0ly] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h9iar4l0ly] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h9iar4l0ly] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h9iar4l0ly] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h9iar4l0ly] { filter: brightness(1.1); }
.btn-outline[b-h9iar4l0ly] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h9iar4l0ly] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h9iar4l0ly] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h9iar4l0ly] { filter: brightness(1.1); }
.btn-icon[b-h9iar4l0ly] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h9iar4l0ly] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h9iar4l0ly] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h9iar4l0ly] { color: #ef4444; }
.btn-delete:hover[b-h9iar4l0ly] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h9iar4l0ly] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h9iar4l0ly] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h9iar4l0ly] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h9iar4l0ly] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h9iar4l0ly] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h9iar4l0ly] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h9iar4l0ly] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h9iar4l0ly] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h9iar4l0ly] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h9iar4l0ly] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h9iar4l0ly] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h9iar4l0ly] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h9iar4l0ly] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h9iar4l0ly] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h9iar4l0ly] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h9iar4l0ly] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h9iar4l0ly] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h9iar4l0ly] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h9iar4l0ly] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h9iar4l0ly] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h9iar4l0ly] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h9iar4l0ly] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h9iar4l0ly] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h9iar4l0ly] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h9iar4l0ly] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h9iar4l0ly] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h9iar4l0ly] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h9iar4l0ly] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h9iar4l0ly] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h9iar4l0ly] { display: block; }
.hide-on-cards[b-h9iar4l0ly] { display: none !important; }
.show-on-cards[b-h9iar4l0ly] { display: grid; }
.hide-on-grid[b-h9iar4l0ly] { display: none !important; }

/* Badges */
.badge[b-h9iar4l0ly] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h9iar4l0ly] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h9iar4l0ly] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h9iar4l0ly] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h9iar4l0ly] { text-align: center; }
.text-muted[b-h9iar4l0ly] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h9iar4l0ly], .crud-empty-state[b-h9iar4l0ly] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h9iar4l0ly] { font-size: 2rem; }
.crud-spinner[b-h9iar4l0ly] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h9iar4l0ly 0.6s linear infinite; }
.crud-spinner-sm[b-h9iar4l0ly] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h9iar4l0ly 0.6s linear infinite; }
@keyframes spin-b-h9iar4l0ly { to { transform: rotate(360deg); } }
.spin[b-h9iar4l0ly] { animation: spin-b-h9iar4l0ly 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h9iar4l0ly] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h9iar4l0ly 0.15s ease-out; }
.modal-container[b-h9iar4l0ly] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h9iar4l0ly] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h9iar4l0ly 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h9iar4l0ly] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h9iar4l0ly] { max-width: 420px; }
@keyframes fadeIn-b-h9iar4l0ly { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h9iar4l0ly { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h9iar4l0ly] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h9iar4l0ly] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h9iar4l0ly] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h9iar4l0ly] { color: #dc2626; }
.modal-close[b-h9iar4l0ly] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h9iar4l0ly] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h9iar4l0ly] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h9iar4l0ly] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h9iar4l0ly] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h9iar4l0ly] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h9iar4l0ly] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h9iar4l0ly] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h9iar4l0ly] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h9iar4l0ly] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h9iar4l0ly] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h9iar4l0ly] { flex: 2; }
.form-group label[b-h9iar4l0ly] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h9iar4l0ly], .form-group select[b-h9iar4l0ly], .form-textarea[b-h9iar4l0ly] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h9iar4l0ly], .form-group select:focus[b-h9iar4l0ly], .form-textarea:focus[b-h9iar4l0ly] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h9iar4l0ly] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h9iar4l0ly] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h9iar4l0ly] { flex: 1; display: flex; align-items: center; }
.form-check[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h9iar4l0ly] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h9iar4l0ly] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h9iar4l0ly] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h9iar4l0ly] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h9iar4l0ly] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h9iar4l0ly] { font-size: 3rem; }
.photo-placeholder span[b-h9iar4l0ly] { font-size: 0.78rem; }
.photo-actions[b-h9iar4l0ly] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h9iar4l0ly] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h9iar4l0ly] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h9iar4l0ly] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h9iar4l0ly] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h9iar4l0ly] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h9iar4l0ly] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h9iar4l0ly] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h9iar4l0ly] { filter: brightness(1.15); transform: scale(1.05); }
[b-h9iar4l0ly] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h9iar4l0ly] { padding: 0.75rem; }
    .crud-header[b-h9iar4l0ly] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h9iar4l0ly] { font-size: 1.1rem; }
    .btn-text[b-h9iar4l0ly] { display: none; }
    .form-row[b-h9iar4l0ly] { flex-direction: column; }
    .form-row-4[b-h9iar4l0ly] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h9iar4l0ly] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h9iar4l0ly] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h9iar4l0ly] { padding: 0.75rem; }
    .modal-tabs[b-h9iar4l0ly] { overflow-x: auto; }
    .modal-tab[b-h9iar4l0ly] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h9iar4l0ly] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h9iar4l0ly] { display: grid !important; }
    .crud-cards-wrapper[b-h9iar4l0ly] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h9iar4l0ly] { grid-template-columns: 1fr; }
    .card-details[b-h9iar4l0ly] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h9iar4l0ly] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h9iar4l0ly] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h9iar4l0ly] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h9iar4l0ly] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-h9iar4l0ly] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-h9iar4l0ly] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-h9iar4l0ly] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-h9iar4l0ly] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-h9iar4l0ly] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-h9iar4l0ly] { min-width: 140px; }
.param-band-input[b-h9iar4l0ly] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-h9iar4l0ly] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-h9iar4l0ly] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-h9iar4l0ly] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-h9iar4l0ly] { border-bottom: none; }
.param-section-title[b-h9iar4l0ly] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-h9iar4l0ly] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-h9iar4l0ly] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-h9iar4l0ly] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-h9iar4l0ly] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-h9iar4l0ly] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-h9iar4l0ly] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-h9iar4l0ly] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-h9iar4l0ly] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-h9iar4l0ly] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-h9iar4l0ly] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-h9iar4l0ly] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-h9iar4l0ly] { border-bottom: none; }
.help-section p[b-h9iar4l0ly] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-h9iar4l0ly], .help-section ol[b-h9iar4l0ly] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-h9iar4l0ly] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-h9iar4l0ly] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-h9iar4l0ly] { color: var(--rg-accent,#2563eb); }
.help-tip[b-h9iar4l0ly] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-h9iar4l0ly] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-h9iar4l0ly] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-h9iar4l0ly], .form-row-3[b-h9iar4l0ly], .form-row-4[b-h9iar4l0ly] { grid-template-columns: 1fr; }
    .param-band[b-h9iar4l0ly] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-h9iar4l0ly] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-h9iar4l0ly] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-h9iar4l0ly] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-h9iar4l0ly] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-h9iar4l0ly] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-h9iar4l0ly] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-h9iar4l0ly] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-h9iar4l0ly] { color: var(--rg-accent, #2563eb); }

.form-hint[b-h9iar4l0ly] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-h9iar4l0ly] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-h9iar4l0ly] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-h9iar4l0ly] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-h9iar4l0ly] { filter: brightness(1.1); }

.text-muted[b-h9iar4l0ly] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-h9iar4l0ly] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-h9iar4l0ly] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-h9iar4l0ly] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-h9iar4l0ly] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-h9iar4l0ly]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-h9iar4l0ly] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-h9iar4l0ly]::before {
    transform: translateX(16px);
}
.switch-text[b-h9iar4l0ly] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-h9iar4l0ly] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-h9iar4l0ly] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-h9iar4l0ly] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_encargado_curso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yr98r7051q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yr98r7051q 0.3s ease-out; }
@keyframes slideUp-b-yr98r7051q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yr98r7051q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yr98r7051q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yr98r7051q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yr98r7051q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yr98r7051q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yr98r7051q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yr98r7051q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yr98r7051q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yr98r7051q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yr98r7051q] { filter: brightness(1.1); }
.btn-outline[b-yr98r7051q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yr98r7051q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yr98r7051q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yr98r7051q] { filter: brightness(1.1); }
.btn-icon[b-yr98r7051q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yr98r7051q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yr98r7051q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yr98r7051q] { color: #ef4444; }
.btn-delete:hover[b-yr98r7051q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yr98r7051q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yr98r7051q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yr98r7051q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yr98r7051q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yr98r7051q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yr98r7051q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yr98r7051q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yr98r7051q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yr98r7051q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yr98r7051q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yr98r7051q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yr98r7051q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yr98r7051q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yr98r7051q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yr98r7051q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yr98r7051q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yr98r7051q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yr98r7051q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yr98r7051q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yr98r7051q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yr98r7051q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yr98r7051q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yr98r7051q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yr98r7051q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yr98r7051q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yr98r7051q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yr98r7051q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yr98r7051q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yr98r7051q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yr98r7051q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yr98r7051q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yr98r7051q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yr98r7051q] { display: block; }
.hide-on-cards[b-yr98r7051q] { display: none !important; }
.show-on-cards[b-yr98r7051q] { display: grid; }
.hide-on-grid[b-yr98r7051q] { display: none !important; }

/* Badges */
.badge[b-yr98r7051q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yr98r7051q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yr98r7051q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yr98r7051q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yr98r7051q] { text-align: center; }
.text-muted[b-yr98r7051q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yr98r7051q], .crud-empty-state[b-yr98r7051q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yr98r7051q] { font-size: 2rem; }
.crud-spinner[b-yr98r7051q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yr98r7051q 0.6s linear infinite; }
.crud-spinner-sm[b-yr98r7051q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yr98r7051q 0.6s linear infinite; }
@keyframes spin-b-yr98r7051q { to { transform: rotate(360deg); } }
.spin[b-yr98r7051q] { animation: spin-b-yr98r7051q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yr98r7051q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yr98r7051q 0.15s ease-out; }
.modal-container[b-yr98r7051q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yr98r7051q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yr98r7051q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yr98r7051q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yr98r7051q] { max-width: 420px; }
@keyframes fadeIn-b-yr98r7051q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yr98r7051q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yr98r7051q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yr98r7051q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yr98r7051q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yr98r7051q] { color: #dc2626; }
.modal-close[b-yr98r7051q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yr98r7051q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yr98r7051q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yr98r7051q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yr98r7051q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yr98r7051q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yr98r7051q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yr98r7051q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yr98r7051q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yr98r7051q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yr98r7051q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yr98r7051q] { flex: 2; }
.form-group label[b-yr98r7051q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yr98r7051q], .form-group select[b-yr98r7051q], .form-textarea[b-yr98r7051q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yr98r7051q], .form-group select:focus[b-yr98r7051q], .form-textarea:focus[b-yr98r7051q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yr98r7051q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yr98r7051q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yr98r7051q] { flex: 1; display: flex; align-items: center; }
.form-check[b-yr98r7051q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yr98r7051q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yr98r7051q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yr98r7051q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yr98r7051q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yr98r7051q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yr98r7051q] { font-size: 3rem; }
.photo-placeholder span[b-yr98r7051q] { font-size: 0.78rem; }
.photo-actions[b-yr98r7051q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yr98r7051q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yr98r7051q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yr98r7051q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yr98r7051q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yr98r7051q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yr98r7051q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yr98r7051q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yr98r7051q] { filter: brightness(1.15); transform: scale(1.05); }
[b-yr98r7051q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yr98r7051q] { padding: 0.75rem; }
    .crud-header[b-yr98r7051q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yr98r7051q] { font-size: 1.1rem; }
    .btn-text[b-yr98r7051q] { display: none; }
    .form-row[b-yr98r7051q] { flex-direction: column; }
    .form-row-4[b-yr98r7051q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yr98r7051q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yr98r7051q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yr98r7051q] { padding: 0.75rem; }
    .modal-tabs[b-yr98r7051q] { overflow-x: auto; }
    .modal-tab[b-yr98r7051q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yr98r7051q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yr98r7051q] { display: grid !important; }
    .crud-cards-wrapper[b-yr98r7051q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yr98r7051q] { grid-template-columns: 1fr; }
    .card-details[b-yr98r7051q] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yr98r7051q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yr98r7051q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yr98r7051q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yr98r7051q] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-yr98r7051q] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-yr98r7051q] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-yr98r7051q] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-yr98r7051q] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-yr98r7051q] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-yr98r7051q] { min-width: 140px; }
.param-band-input[b-yr98r7051q] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-yr98r7051q] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-yr98r7051q] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-yr98r7051q] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-yr98r7051q] { border-bottom: none; }
.param-section-title[b-yr98r7051q] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-yr98r7051q] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-yr98r7051q] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-yr98r7051q] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-yr98r7051q] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-yr98r7051q] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-yr98r7051q] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-yr98r7051q] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-yr98r7051q] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-yr98r7051q] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-yr98r7051q] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-yr98r7051q] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-yr98r7051q] { border-bottom: none; }
.help-section p[b-yr98r7051q] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-yr98r7051q], .help-section ol[b-yr98r7051q] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-yr98r7051q] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-yr98r7051q] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-yr98r7051q] { color: var(--rg-accent,#2563eb); }
.help-tip[b-yr98r7051q] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-yr98r7051q] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-yr98r7051q] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-yr98r7051q], .form-row-3[b-yr98r7051q], .form-row-4[b-yr98r7051q] { grid-template-columns: 1fr; }
    .param-band[b-yr98r7051q] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-yr98r7051q] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-yr98r7051q] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-yr98r7051q] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-yr98r7051q] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-yr98r7051q] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-yr98r7051q] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-yr98r7051q] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-yr98r7051q] { color: var(--rg-accent, #2563eb); }

.form-hint[b-yr98r7051q] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-yr98r7051q] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-yr98r7051q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-yr98r7051q] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-yr98r7051q] { filter: brightness(1.1); }

.text-muted[b-yr98r7051q] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-yr98r7051q] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-yr98r7051q] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-yr98r7051q] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-yr98r7051q] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-yr98r7051q]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-yr98r7051q] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-yr98r7051q]::before {
    transform: translateX(16px);
}
.switch-text[b-yr98r7051q] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-yr98r7051q] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-yr98r7051q] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-yr98r7051q] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_enlaza_profesor_a_login.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4whekauiaj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4whekauiaj 0.3s ease-out; }
@keyframes slideUp-b-4whekauiaj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4whekauiaj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4whekauiaj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4whekauiaj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4whekauiaj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4whekauiaj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4whekauiaj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4whekauiaj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4whekauiaj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4whekauiaj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4whekauiaj] { filter: brightness(1.1); }
.btn-outline[b-4whekauiaj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4whekauiaj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4whekauiaj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4whekauiaj] { filter: brightness(1.1); }
.btn-icon[b-4whekauiaj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4whekauiaj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4whekauiaj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4whekauiaj] { color: #ef4444; }
.btn-delete:hover[b-4whekauiaj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4whekauiaj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4whekauiaj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4whekauiaj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4whekauiaj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4whekauiaj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4whekauiaj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4whekauiaj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4whekauiaj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4whekauiaj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4whekauiaj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4whekauiaj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4whekauiaj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4whekauiaj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4whekauiaj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4whekauiaj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4whekauiaj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4whekauiaj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4whekauiaj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4whekauiaj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4whekauiaj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4whekauiaj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4whekauiaj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4whekauiaj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4whekauiaj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4whekauiaj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4whekauiaj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4whekauiaj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4whekauiaj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4whekauiaj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4whekauiaj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4whekauiaj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4whekauiaj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4whekauiaj] { display: block; }
.hide-on-cards[b-4whekauiaj] { display: none !important; }
.show-on-cards[b-4whekauiaj] { display: grid; }
.hide-on-grid[b-4whekauiaj] { display: none !important; }

/* Badges */
.badge[b-4whekauiaj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4whekauiaj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4whekauiaj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4whekauiaj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4whekauiaj] { text-align: center; }
.text-muted[b-4whekauiaj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4whekauiaj], .crud-empty-state[b-4whekauiaj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4whekauiaj] { font-size: 2rem; }
.crud-spinner[b-4whekauiaj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4whekauiaj 0.6s linear infinite; }
.crud-spinner-sm[b-4whekauiaj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4whekauiaj 0.6s linear infinite; }
@keyframes spin-b-4whekauiaj { to { transform: rotate(360deg); } }
.spin[b-4whekauiaj] { animation: spin-b-4whekauiaj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4whekauiaj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4whekauiaj 0.15s ease-out; }
.modal-container[b-4whekauiaj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4whekauiaj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4whekauiaj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4whekauiaj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4whekauiaj] { max-width: 420px; }
@keyframes fadeIn-b-4whekauiaj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4whekauiaj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4whekauiaj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4whekauiaj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4whekauiaj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4whekauiaj] { color: #dc2626; }
.modal-close[b-4whekauiaj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4whekauiaj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4whekauiaj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4whekauiaj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4whekauiaj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4whekauiaj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4whekauiaj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4whekauiaj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4whekauiaj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4whekauiaj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4whekauiaj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4whekauiaj] { flex: 2; }
.form-group label[b-4whekauiaj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4whekauiaj], .form-group select[b-4whekauiaj], .form-textarea[b-4whekauiaj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4whekauiaj], .form-group select:focus[b-4whekauiaj], .form-textarea:focus[b-4whekauiaj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4whekauiaj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4whekauiaj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4whekauiaj] { flex: 1; display: flex; align-items: center; }
.form-check[b-4whekauiaj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4whekauiaj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4whekauiaj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4whekauiaj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4whekauiaj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4whekauiaj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4whekauiaj] { font-size: 3rem; }
.photo-placeholder span[b-4whekauiaj] { font-size: 0.78rem; }
.photo-actions[b-4whekauiaj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4whekauiaj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4whekauiaj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4whekauiaj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4whekauiaj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4whekauiaj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4whekauiaj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4whekauiaj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4whekauiaj] { filter: brightness(1.15); transform: scale(1.05); }
[b-4whekauiaj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4whekauiaj] { padding: 0.75rem; }
    .crud-header[b-4whekauiaj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4whekauiaj] { font-size: 1.1rem; }
    .btn-text[b-4whekauiaj] { display: none; }
    .form-row[b-4whekauiaj] { flex-direction: column; }
    .form-row-4[b-4whekauiaj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4whekauiaj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4whekauiaj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4whekauiaj] { padding: 0.75rem; }
    .modal-tabs[b-4whekauiaj] { overflow-x: auto; }
    .modal-tab[b-4whekauiaj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4whekauiaj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4whekauiaj] { display: grid !important; }
    .crud-cards-wrapper[b-4whekauiaj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4whekauiaj] { grid-template-columns: 1fr; }
    .card-details[b-4whekauiaj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4whekauiaj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4whekauiaj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4whekauiaj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4whekauiaj] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-4whekauiaj] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-4whekauiaj] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-4whekauiaj] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-4whekauiaj] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-4whekauiaj] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-4whekauiaj] { min-width: 140px; }
.param-band-input[b-4whekauiaj] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-4whekauiaj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-4whekauiaj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-4whekauiaj] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-4whekauiaj] { border-bottom: none; }
.param-section-title[b-4whekauiaj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-4whekauiaj] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-4whekauiaj] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-4whekauiaj] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-4whekauiaj] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-4whekauiaj] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-4whekauiaj] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-4whekauiaj] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-4whekauiaj] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-4whekauiaj] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-4whekauiaj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-4whekauiaj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-4whekauiaj] { border-bottom: none; }
.help-section p[b-4whekauiaj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-4whekauiaj], .help-section ol[b-4whekauiaj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-4whekauiaj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-4whekauiaj] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-4whekauiaj] { color: var(--rg-accent,#2563eb); }
.help-tip[b-4whekauiaj] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-4whekauiaj] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-4whekauiaj] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-4whekauiaj], .form-row-3[b-4whekauiaj], .form-row-4[b-4whekauiaj] { grid-template-columns: 1fr; }
    .param-band[b-4whekauiaj] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-4whekauiaj] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-4whekauiaj] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-4whekauiaj] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-4whekauiaj] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-4whekauiaj] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-4whekauiaj] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-4whekauiaj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-4whekauiaj] { color: var(--rg-accent, #2563eb); }

.form-hint[b-4whekauiaj] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-4whekauiaj] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-4whekauiaj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-4whekauiaj] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-4whekauiaj] { filter: brightness(1.1); }

.text-muted[b-4whekauiaj] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-4whekauiaj] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-4whekauiaj] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-4whekauiaj] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-4whekauiaj] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-4whekauiaj]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-4whekauiaj] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-4whekauiaj]::before {
    transform: translateX(16px);
}
.switch-text[b-4whekauiaj] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-4whekauiaj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-4whekauiaj] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-4whekauiaj] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_familias.razor.rz.scp.css */
/* ============================================================
   👨‍👩‍👧 Frmclg_familias — Gestión de Familias
   Estilo base: Frmclientes (grid + modal) + Frmsolicitudpr (tabs)
   100% tokens --rg-* · Dark mode compliant · Responsive iPhone
   NOTA: Duplicamos los estilos base porque Blazor usa CSS scoped
         por componente (no se heredan entre .razor.css).
   ============================================================ */

/* ============================================================
   CONTAINER + HEADER (estándar Clientes)
   ============================================================ */
.crud-container[b-itywdjkwc8] { padding: 1.25rem; max-width: 100%; animation: fam-slideUp-b-itywdjkwc8 0.3s ease-out; }
@keyframes fam-slideUp-b-itywdjkwc8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-itywdjkwc8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-itywdjkwc8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-itywdjkwc8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-itywdjkwc8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-itywdjkwc8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-itywdjkwc8] { display: flex; gap: 0.5rem; }

/* ============================================================
   BOTONES — estándar Clientes (morado/violeta + outline)
   ============================================================ */
.btn-crud[b-itywdjkwc8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-itywdjkwc8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-itywdjkwc8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-itywdjkwc8] { filter: brightness(1.1); }
.btn-outline[b-itywdjkwc8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-itywdjkwc8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-itywdjkwc8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-itywdjkwc8] { filter: brightness(1.1); }

.btn-icon[b-itywdjkwc8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-itywdjkwc8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-itywdjkwc8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-itywdjkwc8] { color: #ef4444; }
.btn-delete:hover[b-itywdjkwc8] { background: rgba(239, 68, 68, 0.1); }

.btn-sm[b-itywdjkwc8] { padding: 0.3rem 0.75rem; font-size: 0.72rem; }

/* ============================================================
   BARRA DE BÚSQUEDA
   ============================================================ */
.crud-search-bar[b-itywdjkwc8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-itywdjkwc8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-itywdjkwc8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-itywdjkwc8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-itywdjkwc8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* ============================================================
   GRID — tabla estándar Clientes
   ============================================================ */
.crud-grid-wrapper[b-itywdjkwc8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-itywdjkwc8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-itywdjkwc8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-itywdjkwc8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-itywdjkwc8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-itywdjkwc8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-itywdjkwc8] { width: 90px; text-align: center; white-space: nowrap; }
.text-center[b-itywdjkwc8] { text-align: center; }
.font-mono[b-itywdjkwc8] { font-family: 'Cascadia Code', 'Fira Code', ui-monospace, monospace; font-size: 0.76rem; }

/* Avatar circular para cada familia */
.fam-photo-sm[b-itywdjkwc8] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--rg-bg-sidebar, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rg-accent, #4f46e5);
    font-size: 1rem;
}

[data-mode="dark"] .fam-photo-sm[b-itywdjkwc8] {
    background: rgba(99, 102, 241, 0.15);
    color: #a5b4fc;
}

/* ============================================================
   BADGES — Activa / Inactiva (estándar Clientes)
   ============================================================ */
.badge[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
}
.badge-yes[b-itywdjkwc8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-itywdjkwc8]  { background: #f1f5f9; color: #64748b; }

[data-mode="dark"] .badge-yes[b-itywdjkwc8] { background: rgba(34, 197, 94, 0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-itywdjkwc8]  { background: rgba(148, 163, 184, 0.2); color: #cbd5e1; }

/* ============================================================
   LOADING / EMPTY / SPINNER / ALERT
   ============================================================ */
.crud-loading[b-itywdjkwc8], .crud-empty-state[b-itywdjkwc8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-itywdjkwc8] { font-size: 2rem; }
.crud-spinner[b-itywdjkwc8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: fam-spin-b-itywdjkwc8 0.6s linear infinite; }
.crud-spinner-sm[b-itywdjkwc8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: fam-spin-b-itywdjkwc8 0.6s linear infinite; }
@keyframes fam-spin-b-itywdjkwc8 { to { transform: rotate(360deg); } }
.spin[b-itywdjkwc8] { animation: fam-spin-b-itywdjkwc8 0.8s linear infinite; }

.modal-sm[b-itywdjkwc8] { max-width: 480px; }

/* ============================================================
   VISTA TARJETAS (Cards) — alternativa al grid
   ============================================================ */

.view-toggle[b-itywdjkwc8] { padding: 0.5rem 0.65rem; }

.crud-cards-wrapper[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 0.75rem;
    padding: 0.25rem;
    max-height: calc(100vh - 280px);
    overflow-y: auto;
}

.crud-card[b-itywdjkwc8] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.875rem;
    transition: all 0.15s;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    cursor: pointer;
}

.crud-card:hover[b-itywdjkwc8] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.fam-card-canceled[b-itywdjkwc8] {
    opacity: 0.55;
    background: var(--rg-bg-subtle);
}

.card-header-row[b-itywdjkwc8] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--rg-border);
}

.card-header-info[b-itywdjkwc8] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.card-title[b-itywdjkwc8] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-id[b-itywdjkwc8] {
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    letter-spacing: 0.02em;
}

.card-badges[b-itywdjkwc8] {
    flex-shrink: 0;
}

.card-details[b-itywdjkwc8] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.card-detail[b-itywdjkwc8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.76rem;
}

.card-label[b-itywdjkwc8] {
    font-weight: 600;
    color: var(--rg-text-muted);
    flex-shrink: 0;
}

.card-value[b-itywdjkwc8] {
    color: var(--rg-text-primary);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-actions[b-itywdjkwc8] {
    display: flex;
    justify-content: flex-end;
    gap: 0.3rem;
    padding-top: 0.55rem;
    border-top: 1px solid var(--rg-border);
}

/* ============================================================
   CHECKBOX "Mostrar canceladas"
   ============================================================ */

.fam-show-canceled[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    cursor: pointer;
    margin: 0 0.5rem;
    white-space: nowrap;
}

.fam-show-canceled input[type="checkbox"][b-itywdjkwc8] {
    accent-color: var(--rg-accent, #4f46e5);
    cursor: pointer;
}

/* Modal anidado (confirmación dentro de otro modal) — flota por encima */
.modal-backdrop-nested[b-itywdjkwc8] {
    z-index: 2000 !important;
    background: rgba(0, 0, 0, 0.5) !important;
}
.modal-container-nested[b-itywdjkwc8] {
    z-index: 2001 !important;
}
.modal-header-danger[b-itywdjkwc8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-itywdjkwc8] { color: #dc2626; }
[data-mode="dark"] .modal-header-danger[b-itywdjkwc8] { border-bottom-color: rgba(220, 38, 38, 0.4); }
[data-mode="dark"] .modal-header-danger h2[b-itywdjkwc8] { color: #fca5a5; }

.modal-sm .modal-body[b-itywdjkwc8] { padding: 1rem 1.25rem; }
.modal-sm .modal-body p[b-itywdjkwc8] { margin: 0.5rem 0; font-size: 0.85rem; color: var(--rg-text-primary); }

.crud-alert[b-itywdjkwc8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-itywdjkwc8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-itywdjkwc8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-itywdjkwc8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ============================================================
   MODAL — Estándar CRUD (clave: sin esto sale pantalla negra)
   ============================================================ */
.modal-backdrop[b-itywdjkwc8] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: fam-fadeIn-b-itywdjkwc8 0.15s ease-out;
}
.modal-container[b-itywdjkwc8] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.modal-dialog[b-itywdjkwc8] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 640px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    animation: fam-scaleIn-b-itywdjkwc8 0.2s ease-out;
}
.modal-lg[b-itywdjkwc8] {
    max-width: none;
    width: calc(100% - 2rem);
    height: calc(100vh - 60px);
    max-height: calc(100vh - 60px);
    border-radius: 0.5rem;
}

@keyframes fam-fadeIn-b-itywdjkwc8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes fam-scaleIn-b-itywdjkwc8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-itywdjkwc8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
    background: var(--rg-bg-card);
}
.modal-header h2[b-itywdjkwc8] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-close[b-itywdjkwc8] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-itywdjkwc8] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-hover, #f1f5f9);
}
.modal-body[b-itywdjkwc8] {
    padding: 0;
    overflow-y: auto;
    flex: 1;
    background: var(--rg-bg-page);
}
.modal-footer[b-itywdjkwc8] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
    background: var(--rg-bg-card);
}

/* ============================================================
   TABS dentro del Modal (estándar Solicitud)
   ============================================================ */
.sf-tabs-main[b-itywdjkwc8] {
    display: flex;
    gap: 0;
    overflow-x: auto;
    scrollbar-width: thin;
    border-bottom: 2px solid var(--rg-border, #eef0f4);
}

.sf-tabs-modal[b-itywdjkwc8] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--rg-bg-card, #ffffff);
    padding: 0 0.5rem;
}

.sf-tab-main[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.7rem 0.85rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    color: var(--rg-text-muted, #64748b);
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.sf-tab-main:hover[b-itywdjkwc8] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-hover, #f8fafc);
}

.sf-tab-main.active[b-itywdjkwc8] {
    color: var(--rg-primary, #4f46e5);
    border-bottom-color: var(--rg-primary, #4f46e5);
    font-weight: 600;
}

.sf-tab-main i[b-itywdjkwc8] { font-size: 0.85rem; }
.sf-tab-body[b-itywdjkwc8] { min-height: 400px; }

.sf-modal-subtitle[b-itywdjkwc8] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #64748b);
    font-weight: 400;
}

/* ============================================================
   SF-FIELD-ROW — Campos internos del formulario (3 columnas)
   ============================================================ */
.sf-field-row[b-itywdjkwc8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.sf-field-row > label[b-itywdjkwc8] {
    flex: 0 0 105px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    white-space: nowrap;
    text-align: right;
}

.sf-field-input[b-itywdjkwc8] {
    flex: 1;
    min-width: 0;
}

.sf-field-input input[b-itywdjkwc8],
.sf-field-input select[b-itywdjkwc8],
.sf-field-input textarea[b-itywdjkwc8] {
    width: 100%;
    padding: 0.35rem 0.55rem;
    border: 1px solid var(--rg-border, #eef0f4);
    border-radius: 5px;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.78rem;
    font-family: inherit;
    transition: border-color 0.15s ease;
}

.sf-field-input input:focus[b-itywdjkwc8],
.sf-field-input select:focus[b-itywdjkwc8],
.sf-field-input textarea:focus[b-itywdjkwc8] {
    outline: none;
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}

.sf-field-input textarea[b-itywdjkwc8] {
    resize: vertical;
    min-height: 44px;
}


/* ============================================================
   CHIP contador de dependientes en el grid
   ============================================================ */

.fam-count-chip[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.85rem;
    padding: 0.15rem 0.55rem;
    background: rgba(26, 58, 92, 0.08);
    color: var(--rg-primary);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

[data-mode="dark"] .fam-count-chip[b-itywdjkwc8] {
    background: rgba(147, 180, 212, 0.18);
    color: #93b4d4;
}

/* Variante cuando el modal está adentro, la cabecera cambia fondo */
.fam-header-modal[b-itywdjkwc8] {
    margin-bottom: 0;
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-top: none;
}

/* ============================================================
   CABECERA — Id Familia, Fecha Ingreso, Mensualidad
   ============================================================ */

.fam-header-card[b-itywdjkwc8] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
}

.fam-header-row[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: 240px 180px 1fr auto;
    gap: 1rem;
    align-items: end;
}

.fam-header-field[b-itywdjkwc8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fam-header-field-wide[b-itywdjkwc8] {
    max-width: 260px;
}

.fam-header-field label[b-itywdjkwc8] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.fam-input[b-itywdjkwc8] {
    padding: 0.4rem 0.6rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.82rem;
    width: 100%;
    transition: border-color 0.15s;
}

.fam-input:focus[b-itywdjkwc8] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.fam-input:disabled[b-itywdjkwc8] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    cursor: not-allowed;
}

/* Placeholder visual cuando el Id se asigna al guardar */
.fam-input-pending[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.4rem 0.7rem;
    background: repeating-linear-gradient(
        45deg,
        var(--rg-bg-subtle),
        var(--rg-bg-subtle) 6px,
        var(--rg-bg-input) 6px,
        var(--rg-bg-input) 12px
    );
    color: var(--rg-text-muted);
    border: 1px dashed var(--rg-border);
    border-radius: 6px;
    font-size: 0.78rem;
    font-style: italic;
    cursor: help;
}

.fam-input-pending i[b-itywdjkwc8] {
    color: var(--rg-primary);
    font-size: 0.95rem;
}

.fam-input-date[b-itywdjkwc8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 0.02em;
}

.fam-input-money[b-itywdjkwc8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-variant-numeric: tabular-nums;
}

.font-mono[b-itywdjkwc8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.fam-input-group[b-itywdjkwc8] {
    position: relative;
    display: flex;
}

.fam-input-group .fam-input[b-itywdjkwc8] {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: none;
}

.fam-input-btn[b-itywdjkwc8] {
    padding: 0 0.75rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-left: none;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    color: var(--rg-text-secondary);
    cursor: pointer;
    transition: background 0.15s;
}

.fam-input-btn:hover[b-itywdjkwc8] {
    background: var(--rg-bg-hover);
    color: var(--rg-primary);
}

.fam-header-status[b-itywdjkwc8] {
    align-self: end;
    padding-bottom: 0.25rem;
}

.fam-badge-pill[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.75rem;
    background: rgba(34, 197, 94, 0.1);
    color: #166534;
    border: 1px solid rgba(34, 197, 94, 0.25);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

[data-mode="dark"] .fam-badge-pill[b-itywdjkwc8] {
    color: #86efac;
    background: rgba(34, 197, 94, 0.15);
    border-color: rgba(34, 197, 94, 0.3);
}

/* ============================================================
   TABS WRAPPER
   ============================================================ */

.fam-tabs-wrapper[b-itywdjkwc8] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.fam-tab-body[b-itywdjkwc8] {
    padding: 1rem;
    min-height: 450px;
    background: var(--rg-bg-page);
}

.fam-tab-badge[b-itywdjkwc8] {
    font-size: 0.68rem;
    padding: 0.1rem 0.45rem;
    background: rgba(26, 58, 92, 0.12);
    color: var(--rg-primary);
    border-radius: 999px;
    font-weight: 700;
    min-width: 20px;
    text-align: center;
}

[data-mode="dark"] .fam-tab-badge[b-itywdjkwc8] {
    background: rgba(147, 180, 212, 0.18);
    color: #93b4d4;
}

/* ============================================================
   SECCIÓN — Tarjeta con encabezado de color
   ============================================================ */

.fam-section[b-itywdjkwc8] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 0.85rem;
}

.fam-section:last-child[b-itywdjkwc8] {
    margin-bottom: 0;
}

.fam-section-header[b-itywdjkwc8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.6rem 0.9rem;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.85rem;
}

.fam-section-title[b-itywdjkwc8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fam-section-title i[b-itywdjkwc8] {
    font-size: 1rem;
}

/* Headers de sección con colores semánticos */
.fam-header-dad[b-itywdjkwc8]    { background: linear-gradient(135deg, #0369a1, #0284c7); }  /* azul padre */
.fam-header-mom[b-itywdjkwc8]    { background: linear-gradient(135deg, #be185d, #db2777); }  /* rosa madre */
.fam-header-tutor[b-itywdjkwc8]  { background: linear-gradient(135deg, #6d28d9, #7c3aed); }  /* morado tutor */
.fam-header-ref[b-itywdjkwc8]    { background: linear-gradient(135deg, #b45309, #d97706); }  /* ámbar referencia */
.fam-header-student[b-itywdjkwc8]{ background: linear-gradient(135deg, #059669, #10b981); }  /* verde alumno */
.fam-header-grid[b-itywdjkwc8]   { background: linear-gradient(135deg, #475569, #64748b); }  /* gris grid */
.fam-header-assign[b-itywdjkwc8] { background: linear-gradient(135deg, #7c2d12, #c2410c); }  /* terracota asignación */

/* ============================================================
   TOGGLE — "El Padre / La Madre es el tutor"
   ============================================================ */

.fam-tutor-toggle[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.25rem 0.6rem;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 500;
    color: #ffffff;
    cursor: pointer;
    transition: background 0.15s;
}

.fam-tutor-toggle:hover[b-itywdjkwc8] {
    background: rgba(255, 255, 255, 0.3);
}

.fam-tutor-toggle input[type="checkbox"][b-itywdjkwc8] {
    margin: 0;
    accent-color: #ffffff;
    cursor: pointer;
}

/* ============================================================
   HINT BADGE — Texto informativo en header
   ============================================================ */

.fam-hint-badge[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.55rem;
    background: rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 500;
}

.fam-count-badge[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
}

/* ============================================================
   GRID DE 3 COLUMNAS — Datos de la persona (padre/madre/tutor)
   ============================================================ */

/* Grid plano: 3 columnas × N filas. Cada sf-field-row ocupa UNA celda.
   Ventaja clave: el orden del DOM coincide con el orden visual de filas,
   por lo que TAB navega de izquierda-a-derecha naturalmente. */
.fam-person-grid[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    gap: 0.55rem 1.25rem;
    padding: 0.9rem 1rem;
    align-items: start;
}

.fam-person-grid .sf-field-row[b-itywdjkwc8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.fam-person-grid .sf-field-row > label[b-itywdjkwc8] {
    flex: 0 0 110px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-align: right;
    white-space: nowrap;
}

.fam-person-grid .sf-field-input[b-itywdjkwc8] {
    flex: 1;
    min-width: 0;
}

.fam-person-grid .sf-field-input input[b-itywdjkwc8],
.fam-person-grid .sf-field-input select[b-itywdjkwc8],
.fam-person-grid .sf-field-input textarea[b-itywdjkwc8] {
    width: 100%;
    padding: 0.35rem 0.55rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    font-size: 0.78rem;
    font-family: inherit;
    transition: border-color 0.15s;
}

.fam-person-grid .sf-field-input textarea[b-itywdjkwc8] {
    resize: vertical;
    min-height: 44px;
}

.fam-person-grid .sf-field-input input:focus[b-itywdjkwc8],
.fam-person-grid .sf-field-input select:focus[b-itywdjkwc8],
.fam-person-grid .sf-field-input textarea:focus[b-itywdjkwc8] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 2px rgba(26, 58, 92, 0.15);
}

.fam-person-grid .sf-field-input input.fam-input-date[b-itywdjkwc8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 0.02em;
}

/* Campo que ocupa las 3 columnas (Lugar Trabajo) */
.fam-person-grid .fam-field-fullrow[b-itywdjkwc8] {
    grid-column: 1 / -1;
    align-items: flex-start;
}

.fam-person-grid .fam-field-fullrow > label[b-itywdjkwc8] {
    padding-top: 0.4rem;
}

.fam-field-textarea[b-itywdjkwc8] {
    align-items: flex-start !important;
}

.fam-field-textarea > label[b-itywdjkwc8] {
    padding-top: 0.35rem;
}

/* ============================================================
   TAB 3 — FORMULARIO DE ALUMNO (grid 3 columnas compacto)
   ============================================================ */

.fam-student-form[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem 1.25rem;
    padding: 0.9rem 1rem;
}

.fam-student-form .sf-field-row > label[b-itywdjkwc8] {
    flex: 0 0 100px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-align: right;
    white-space: nowrap;
}

.fam-student-form .sf-field-input input[b-itywdjkwc8],
.fam-student-form .sf-field-input select[b-itywdjkwc8],
.fam-student-form .sf-field-input textarea[b-itywdjkwc8] {
    width: 100%;
    padding: 0.35rem 0.55rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    font-size: 0.78rem;
    font-family: inherit;
}

.fam-student-form .sf-field-input input:focus[b-itywdjkwc8],
.fam-student-form .sf-field-input select:focus[b-itywdjkwc8],
.fam-student-form .sf-field-input textarea:focus[b-itywdjkwc8] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 2px rgba(26, 58, 92, 0.15);
}

.fam-student-form .fam-field-fullspan[b-itywdjkwc8] {
    grid-column: 1 / -1;
}

.fam-field-retiro[b-itywdjkwc8] {
    gap: 0.4rem;
}

.fam-check-label[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--rg-text-secondary);
    cursor: pointer;
    white-space: nowrap;
}

.fam-check-label input[type="checkbox"][b-itywdjkwc8] {
    accent-color: var(--rg-primary);
    cursor: pointer;
}

/* ============================================================
   TAB 3 — SPLIT (grid de alumnos | asignación de curso)
   ============================================================ */

.fam-split[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem;
}

.fam-section-split[b-itywdjkwc8] {
    margin-bottom: 0;
}

.fam-grid-wrapper[b-itywdjkwc8] {
    border: none;
    border-radius: 0;
    max-height: 300px;
}

.crud-empty-row td[b-itywdjkwc8] {
    padding: 0 !important;
}

.fam-empty-inner[b-itywdjkwc8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 2rem;
    color: var(--rg-text-muted);
    font-size: 0.82rem;
}

.fam-empty-inner i[b-itywdjkwc8] {
    font-size: 1.75rem;
    opacity: 0.5;
}

.fam-assign-form[b-itywdjkwc8] {
    padding: 0.9rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.fam-assign-form .sf-field-row > label[b-itywdjkwc8] {
    flex: 0 0 95px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-align: right;
}

.fam-assign-form .sf-field-input input[b-itywdjkwc8],
.fam-assign-form .sf-field-input select[b-itywdjkwc8] {
    padding: 0.35rem 0.55rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    font-size: 0.78rem;
    width: 100%;
}

.fam-curso-row[b-itywdjkwc8] {
    display: grid;
    grid-template-columns: 80px 70px 1fr;
    gap: 0.4rem;
}

.fam-assign-footer[b-itywdjkwc8] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--rg-border);
}

/* ============================================================
   FOOTER — Barra inferior con acciones globales
   ============================================================ */

.fam-footer[b-itywdjkwc8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
    flex-wrap: wrap;
}

.fam-footer-left[b-itywdjkwc8] {
    flex: 1;
    min-width: 200px;
}

.fam-status-text[b-itywdjkwc8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
}

.fam-footer-actions[b-itywdjkwc8] {
    display: flex;
    gap: 0.5rem;
}

/* ============================================================
   BOTÓN PEQUEÑO — Variante del btn-crud para headers
   ============================================================ */

.btn-crud.btn-sm[b-itywdjkwc8] {
    padding: 0.3rem 0.75rem;
    font-size: 0.72rem;
}

/* ============================================================
   RESPONSIVE — Tabletas y iPhone
   ============================================================ */

@media (max-width: 1024px) {
    .fam-person-grid[b-itywdjkwc8] {
        grid-template-columns: 1fr 1fr;
    }

    .fam-student-form[b-itywdjkwc8] {
        grid-template-columns: 1fr 1fr;
    }

    .fam-split[b-itywdjkwc8] {
        grid-template-columns: 1fr;
    }

    .fam-header-row[b-itywdjkwc8] {
        grid-template-columns: 1fr 1fr;
    }

    .fam-header-status[b-itywdjkwc8] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 640px) {
    .crud-cards-wrapper[b-itywdjkwc8] { grid-template-columns: 1fr; max-height: none; }
    .fam-show-canceled span[b-itywdjkwc8] { display: none; }

    .fam-person-grid[b-itywdjkwc8],
    .fam-student-form[b-itywdjkwc8] {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .fam-header-row[b-itywdjkwc8] {
        grid-template-columns: 1fr;
    }

    .fam-person-grid .sf-field-row > label[b-itywdjkwc8],
    .fam-student-form .sf-field-row > label[b-itywdjkwc8],
    .fam-assign-form .sf-field-row > label[b-itywdjkwc8] {
        flex: 0 0 80px;
        font-size: 0.7rem;
    }

    .sf-tab-text[b-itywdjkwc8] {
        display: none;
    }

    .fam-section-header[b-itywdjkwc8] {
        padding: 0.5rem 0.7rem;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .fam-curso-row[b-itywdjkwc8] {
        grid-template-columns: 70px 60px 1fr;
    }

    .fam-footer[b-itywdjkwc8] {
        flex-direction: column;
        align-items: stretch;
    }

    .fam-footer-actions[b-itywdjkwc8] {
        justify-content: flex-end;
    }
}

@media (max-width: 420px) {
    .fam-tutor-toggle span[b-itywdjkwc8],
    .fam-hint-badge[b-itywdjkwc8] {
        display: none;
    }

    .fam-person-grid .sf-field-input input[b-itywdjkwc8],
    .fam-person-grid .sf-field-input select[b-itywdjkwc8],
    .fam-student-form .sf-field-input input[b-itywdjkwc8],
    .fam-student-form .sf-field-input select[b-itywdjkwc8] {
        font-size: 0.72rem;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_generacionplandepago.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-p1na69h6hz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-p1na69h6hz 0.3s ease-out; }
@keyframes slideUp-b-p1na69h6hz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-p1na69h6hz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-p1na69h6hz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-p1na69h6hz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-p1na69h6hz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-p1na69h6hz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-p1na69h6hz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-p1na69h6hz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-p1na69h6hz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-p1na69h6hz] { filter: brightness(1.1); }
.btn-outline[b-p1na69h6hz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-p1na69h6hz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-p1na69h6hz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-p1na69h6hz] { filter: brightness(1.1); }
.btn-icon[b-p1na69h6hz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-p1na69h6hz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-p1na69h6hz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-p1na69h6hz] { color: #ef4444; }
.btn-delete:hover[b-p1na69h6hz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-p1na69h6hz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-p1na69h6hz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-p1na69h6hz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-p1na69h6hz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-p1na69h6hz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-p1na69h6hz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-p1na69h6hz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-p1na69h6hz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-p1na69h6hz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-p1na69h6hz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-p1na69h6hz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-p1na69h6hz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-p1na69h6hz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-p1na69h6hz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-p1na69h6hz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-p1na69h6hz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-p1na69h6hz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-p1na69h6hz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-p1na69h6hz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-p1na69h6hz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-p1na69h6hz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-p1na69h6hz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-p1na69h6hz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-p1na69h6hz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-p1na69h6hz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-p1na69h6hz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-p1na69h6hz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-p1na69h6hz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-p1na69h6hz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-p1na69h6hz] { display: block; }
.hide-on-cards[b-p1na69h6hz] { display: none !important; }
.show-on-cards[b-p1na69h6hz] { display: grid; }
.hide-on-grid[b-p1na69h6hz] { display: none !important; }

/* Badges */
.badge[b-p1na69h6hz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-p1na69h6hz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-p1na69h6hz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-p1na69h6hz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-p1na69h6hz] { text-align: center; }
.text-muted[b-p1na69h6hz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-p1na69h6hz], .crud-empty-state[b-p1na69h6hz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-p1na69h6hz] { font-size: 2rem; }
.crud-spinner[b-p1na69h6hz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-p1na69h6hz 0.6s linear infinite; }
.crud-spinner-sm[b-p1na69h6hz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-p1na69h6hz 0.6s linear infinite; }
@keyframes spin-b-p1na69h6hz { to { transform: rotate(360deg); } }
.spin[b-p1na69h6hz] { animation: spin-b-p1na69h6hz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-p1na69h6hz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-p1na69h6hz 0.15s ease-out; }
.modal-container[b-p1na69h6hz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-p1na69h6hz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-p1na69h6hz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-p1na69h6hz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-p1na69h6hz] { max-width: 420px; }
@keyframes fadeIn-b-p1na69h6hz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-p1na69h6hz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-p1na69h6hz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-p1na69h6hz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-p1na69h6hz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-p1na69h6hz] { color: #dc2626; }
.modal-close[b-p1na69h6hz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-p1na69h6hz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-p1na69h6hz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-p1na69h6hz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-p1na69h6hz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-p1na69h6hz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-p1na69h6hz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-p1na69h6hz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-p1na69h6hz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-p1na69h6hz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-p1na69h6hz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-p1na69h6hz] { flex: 2; }
.form-group label[b-p1na69h6hz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-p1na69h6hz], .form-group select[b-p1na69h6hz], .form-textarea[b-p1na69h6hz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-p1na69h6hz], .form-group select:focus[b-p1na69h6hz], .form-textarea:focus[b-p1na69h6hz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-p1na69h6hz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-p1na69h6hz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-p1na69h6hz] { flex: 1; display: flex; align-items: center; }
.form-check[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-p1na69h6hz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-p1na69h6hz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-p1na69h6hz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-p1na69h6hz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-p1na69h6hz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-p1na69h6hz] { font-size: 3rem; }
.photo-placeholder span[b-p1na69h6hz] { font-size: 0.78rem; }
.photo-actions[b-p1na69h6hz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-p1na69h6hz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-p1na69h6hz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-p1na69h6hz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-p1na69h6hz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-p1na69h6hz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-p1na69h6hz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-p1na69h6hz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-p1na69h6hz] { filter: brightness(1.15); transform: scale(1.05); }
[b-p1na69h6hz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-p1na69h6hz] { padding: 0.75rem; }
    .crud-header[b-p1na69h6hz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-p1na69h6hz] { font-size: 1.1rem; }
    .btn-text[b-p1na69h6hz] { display: none; }
    .form-row[b-p1na69h6hz] { flex-direction: column; }
    .form-row-4[b-p1na69h6hz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-p1na69h6hz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-p1na69h6hz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-p1na69h6hz] { padding: 0.75rem; }
    .modal-tabs[b-p1na69h6hz] { overflow-x: auto; }
    .modal-tab[b-p1na69h6hz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-p1na69h6hz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-p1na69h6hz] { display: grid !important; }
    .crud-cards-wrapper[b-p1na69h6hz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-p1na69h6hz] { grid-template-columns: 1fr; }
    .card-details[b-p1na69h6hz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-p1na69h6hz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-p1na69h6hz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-p1na69h6hz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-p1na69h6hz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_impresion_control_nota.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rcfjpfcu7a] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rcfjpfcu7a 0.3s ease-out; }
@keyframes slideUp-b-rcfjpfcu7a { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rcfjpfcu7a] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rcfjpfcu7a] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rcfjpfcu7a] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rcfjpfcu7a] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rcfjpfcu7a] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rcfjpfcu7a] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rcfjpfcu7a] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rcfjpfcu7a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rcfjpfcu7a] { filter: brightness(1.1); }
.btn-outline[b-rcfjpfcu7a] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rcfjpfcu7a] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rcfjpfcu7a] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rcfjpfcu7a] { filter: brightness(1.1); }
.btn-icon[b-rcfjpfcu7a] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rcfjpfcu7a] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rcfjpfcu7a] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rcfjpfcu7a] { color: #ef4444; }
.btn-delete:hover[b-rcfjpfcu7a] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rcfjpfcu7a] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rcfjpfcu7a] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rcfjpfcu7a] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rcfjpfcu7a] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rcfjpfcu7a] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rcfjpfcu7a] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rcfjpfcu7a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rcfjpfcu7a] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rcfjpfcu7a] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rcfjpfcu7a] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rcfjpfcu7a] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rcfjpfcu7a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rcfjpfcu7a] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rcfjpfcu7a] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rcfjpfcu7a] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rcfjpfcu7a] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rcfjpfcu7a] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rcfjpfcu7a] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rcfjpfcu7a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rcfjpfcu7a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rcfjpfcu7a] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rcfjpfcu7a] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rcfjpfcu7a] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rcfjpfcu7a] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rcfjpfcu7a] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rcfjpfcu7a] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rcfjpfcu7a] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rcfjpfcu7a] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rcfjpfcu7a] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rcfjpfcu7a] { display: block; }
.hide-on-cards[b-rcfjpfcu7a] { display: none !important; }
.show-on-cards[b-rcfjpfcu7a] { display: grid; }
.hide-on-grid[b-rcfjpfcu7a] { display: none !important; }

/* Badges */
.badge[b-rcfjpfcu7a] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rcfjpfcu7a] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rcfjpfcu7a] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rcfjpfcu7a] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rcfjpfcu7a] { text-align: center; }
.text-muted[b-rcfjpfcu7a] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rcfjpfcu7a], .crud-empty-state[b-rcfjpfcu7a] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rcfjpfcu7a] { font-size: 2rem; }
.crud-spinner[b-rcfjpfcu7a] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rcfjpfcu7a 0.6s linear infinite; }
.crud-spinner-sm[b-rcfjpfcu7a] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rcfjpfcu7a 0.6s linear infinite; }
@keyframes spin-b-rcfjpfcu7a { to { transform: rotate(360deg); } }
.spin[b-rcfjpfcu7a] { animation: spin-b-rcfjpfcu7a 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rcfjpfcu7a] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rcfjpfcu7a 0.15s ease-out; }
.modal-container[b-rcfjpfcu7a] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rcfjpfcu7a] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rcfjpfcu7a 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rcfjpfcu7a] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rcfjpfcu7a] { max-width: 420px; }
@keyframes fadeIn-b-rcfjpfcu7a { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rcfjpfcu7a { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rcfjpfcu7a] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rcfjpfcu7a] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rcfjpfcu7a] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rcfjpfcu7a] { color: #dc2626; }
.modal-close[b-rcfjpfcu7a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rcfjpfcu7a] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rcfjpfcu7a] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rcfjpfcu7a] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rcfjpfcu7a] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rcfjpfcu7a] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rcfjpfcu7a] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rcfjpfcu7a] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rcfjpfcu7a] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rcfjpfcu7a] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rcfjpfcu7a] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rcfjpfcu7a] { flex: 2; }
.form-group label[b-rcfjpfcu7a] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rcfjpfcu7a], .form-group select[b-rcfjpfcu7a], .form-textarea[b-rcfjpfcu7a] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rcfjpfcu7a], .form-group select:focus[b-rcfjpfcu7a], .form-textarea:focus[b-rcfjpfcu7a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rcfjpfcu7a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rcfjpfcu7a] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rcfjpfcu7a] { flex: 1; display: flex; align-items: center; }
.form-check[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rcfjpfcu7a] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rcfjpfcu7a] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rcfjpfcu7a] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rcfjpfcu7a] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rcfjpfcu7a] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rcfjpfcu7a] { font-size: 3rem; }
.photo-placeholder span[b-rcfjpfcu7a] { font-size: 0.78rem; }
.photo-actions[b-rcfjpfcu7a] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rcfjpfcu7a] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rcfjpfcu7a] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rcfjpfcu7a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rcfjpfcu7a] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rcfjpfcu7a] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rcfjpfcu7a] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rcfjpfcu7a] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rcfjpfcu7a] { filter: brightness(1.15); transform: scale(1.05); }
[b-rcfjpfcu7a] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rcfjpfcu7a] { padding: 0.75rem; }
    .crud-header[b-rcfjpfcu7a] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rcfjpfcu7a] { font-size: 1.1rem; }
    .btn-text[b-rcfjpfcu7a] { display: none; }
    .form-row[b-rcfjpfcu7a] { flex-direction: column; }
    .form-row-4[b-rcfjpfcu7a] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rcfjpfcu7a] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rcfjpfcu7a] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rcfjpfcu7a] { padding: 0.75rem; }
    .modal-tabs[b-rcfjpfcu7a] { overflow-x: auto; }
    .modal-tab[b-rcfjpfcu7a] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rcfjpfcu7a] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rcfjpfcu7a] { display: grid !important; }
    .crud-cards-wrapper[b-rcfjpfcu7a] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rcfjpfcu7a] { grid-template-columns: 1fr; }
    .card-details[b-rcfjpfcu7a] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rcfjpfcu7a] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rcfjpfcu7a] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rcfjpfcu7a] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rcfjpfcu7a] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_impresion_nota_estudiantes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ubmv224hal] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ubmv224hal 0.3s ease-out; }
@keyframes slideUp-b-ubmv224hal { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ubmv224hal] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ubmv224hal] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ubmv224hal] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ubmv224hal] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ubmv224hal] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ubmv224hal] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ubmv224hal] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ubmv224hal] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ubmv224hal] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ubmv224hal] { filter: brightness(1.1); }
.btn-outline[b-ubmv224hal] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ubmv224hal] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ubmv224hal] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ubmv224hal] { filter: brightness(1.1); }
.btn-icon[b-ubmv224hal] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ubmv224hal] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ubmv224hal] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ubmv224hal] { color: #ef4444; }
.btn-delete:hover[b-ubmv224hal] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ubmv224hal] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ubmv224hal] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ubmv224hal] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ubmv224hal] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ubmv224hal] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ubmv224hal] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ubmv224hal] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ubmv224hal] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ubmv224hal] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ubmv224hal] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ubmv224hal] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ubmv224hal] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ubmv224hal] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ubmv224hal] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ubmv224hal] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ubmv224hal] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ubmv224hal] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ubmv224hal] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ubmv224hal] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ubmv224hal] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ubmv224hal] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ubmv224hal] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ubmv224hal] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ubmv224hal] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ubmv224hal] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ubmv224hal] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ubmv224hal] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ubmv224hal] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ubmv224hal] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ubmv224hal] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ubmv224hal] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ubmv224hal] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ubmv224hal] { display: block; }
.hide-on-cards[b-ubmv224hal] { display: none !important; }
.show-on-cards[b-ubmv224hal] { display: grid; }
.hide-on-grid[b-ubmv224hal] { display: none !important; }

/* Badges */
.badge[b-ubmv224hal] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ubmv224hal] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ubmv224hal] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ubmv224hal] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ubmv224hal] { text-align: center; }
.text-muted[b-ubmv224hal] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ubmv224hal], .crud-empty-state[b-ubmv224hal] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ubmv224hal] { font-size: 2rem; }
.crud-spinner[b-ubmv224hal] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ubmv224hal 0.6s linear infinite; }
.crud-spinner-sm[b-ubmv224hal] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ubmv224hal 0.6s linear infinite; }
@keyframes spin-b-ubmv224hal { to { transform: rotate(360deg); } }
.spin[b-ubmv224hal] { animation: spin-b-ubmv224hal 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ubmv224hal] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ubmv224hal 0.15s ease-out; }
.modal-container[b-ubmv224hal] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ubmv224hal] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ubmv224hal 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ubmv224hal] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ubmv224hal] { max-width: 420px; }
@keyframes fadeIn-b-ubmv224hal { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ubmv224hal { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ubmv224hal] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ubmv224hal] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ubmv224hal] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ubmv224hal] { color: #dc2626; }
.modal-close[b-ubmv224hal] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ubmv224hal] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ubmv224hal] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ubmv224hal] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ubmv224hal] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ubmv224hal] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ubmv224hal] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ubmv224hal] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ubmv224hal] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ubmv224hal] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ubmv224hal] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ubmv224hal] { flex: 2; }
.form-group label[b-ubmv224hal] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ubmv224hal], .form-group select[b-ubmv224hal], .form-textarea[b-ubmv224hal] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ubmv224hal], .form-group select:focus[b-ubmv224hal], .form-textarea:focus[b-ubmv224hal] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ubmv224hal] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ubmv224hal] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ubmv224hal] { flex: 1; display: flex; align-items: center; }
.form-check[b-ubmv224hal] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ubmv224hal] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ubmv224hal] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ubmv224hal] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ubmv224hal] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ubmv224hal] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ubmv224hal] { font-size: 3rem; }
.photo-placeholder span[b-ubmv224hal] { font-size: 0.78rem; }
.photo-actions[b-ubmv224hal] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ubmv224hal] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ubmv224hal] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ubmv224hal] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ubmv224hal] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ubmv224hal] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ubmv224hal] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ubmv224hal] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ubmv224hal] { filter: brightness(1.15); transform: scale(1.05); }
[b-ubmv224hal] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ubmv224hal] { padding: 0.75rem; }
    .crud-header[b-ubmv224hal] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ubmv224hal] { font-size: 1.1rem; }
    .btn-text[b-ubmv224hal] { display: none; }
    .form-row[b-ubmv224hal] { flex-direction: column; }
    .form-row-4[b-ubmv224hal] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ubmv224hal] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ubmv224hal] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ubmv224hal] { padding: 0.75rem; }
    .modal-tabs[b-ubmv224hal] { overflow-x: auto; }
    .modal-tab[b-ubmv224hal] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ubmv224hal] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ubmv224hal] { display: grid !important; }
    .crud-cards-wrapper[b-ubmv224hal] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ubmv224hal] { grid-template-columns: 1fr; }
    .card-details[b-ubmv224hal] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ubmv224hal] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ubmv224hal] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ubmv224hal] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ubmv224hal] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_ingresonota2024.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hj5bo9x2rt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hj5bo9x2rt 0.3s ease-out; }
@keyframes slideUp-b-hj5bo9x2rt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hj5bo9x2rt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hj5bo9x2rt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hj5bo9x2rt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hj5bo9x2rt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hj5bo9x2rt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hj5bo9x2rt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hj5bo9x2rt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hj5bo9x2rt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hj5bo9x2rt] { filter: brightness(1.1); }
.btn-outline[b-hj5bo9x2rt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hj5bo9x2rt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hj5bo9x2rt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hj5bo9x2rt] { filter: brightness(1.1); }
.btn-icon[b-hj5bo9x2rt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hj5bo9x2rt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hj5bo9x2rt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hj5bo9x2rt] { color: #ef4444; }
.btn-delete:hover[b-hj5bo9x2rt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hj5bo9x2rt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hj5bo9x2rt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hj5bo9x2rt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hj5bo9x2rt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hj5bo9x2rt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hj5bo9x2rt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hj5bo9x2rt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hj5bo9x2rt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hj5bo9x2rt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hj5bo9x2rt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hj5bo9x2rt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hj5bo9x2rt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hj5bo9x2rt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hj5bo9x2rt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hj5bo9x2rt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hj5bo9x2rt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hj5bo9x2rt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hj5bo9x2rt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hj5bo9x2rt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hj5bo9x2rt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hj5bo9x2rt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hj5bo9x2rt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hj5bo9x2rt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hj5bo9x2rt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hj5bo9x2rt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hj5bo9x2rt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hj5bo9x2rt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hj5bo9x2rt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hj5bo9x2rt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hj5bo9x2rt] { display: block; }
.hide-on-cards[b-hj5bo9x2rt] { display: none !important; }
.show-on-cards[b-hj5bo9x2rt] { display: grid; }
.hide-on-grid[b-hj5bo9x2rt] { display: none !important; }

/* Badges */
.badge[b-hj5bo9x2rt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hj5bo9x2rt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hj5bo9x2rt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hj5bo9x2rt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hj5bo9x2rt] { text-align: center; }
.text-muted[b-hj5bo9x2rt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hj5bo9x2rt], .crud-empty-state[b-hj5bo9x2rt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hj5bo9x2rt] { font-size: 2rem; }
.crud-spinner[b-hj5bo9x2rt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hj5bo9x2rt 0.6s linear infinite; }
.crud-spinner-sm[b-hj5bo9x2rt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hj5bo9x2rt 0.6s linear infinite; }
@keyframes spin-b-hj5bo9x2rt { to { transform: rotate(360deg); } }
.spin[b-hj5bo9x2rt] { animation: spin-b-hj5bo9x2rt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hj5bo9x2rt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hj5bo9x2rt 0.15s ease-out; }
.modal-container[b-hj5bo9x2rt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hj5bo9x2rt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hj5bo9x2rt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hj5bo9x2rt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hj5bo9x2rt] { max-width: 420px; }
@keyframes fadeIn-b-hj5bo9x2rt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hj5bo9x2rt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hj5bo9x2rt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hj5bo9x2rt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hj5bo9x2rt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hj5bo9x2rt] { color: #dc2626; }
.modal-close[b-hj5bo9x2rt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hj5bo9x2rt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hj5bo9x2rt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hj5bo9x2rt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hj5bo9x2rt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hj5bo9x2rt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hj5bo9x2rt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hj5bo9x2rt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hj5bo9x2rt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hj5bo9x2rt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hj5bo9x2rt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hj5bo9x2rt] { flex: 2; }
.form-group label[b-hj5bo9x2rt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hj5bo9x2rt], .form-group select[b-hj5bo9x2rt], .form-textarea[b-hj5bo9x2rt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hj5bo9x2rt], .form-group select:focus[b-hj5bo9x2rt], .form-textarea:focus[b-hj5bo9x2rt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hj5bo9x2rt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hj5bo9x2rt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hj5bo9x2rt] { flex: 1; display: flex; align-items: center; }
.form-check[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hj5bo9x2rt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hj5bo9x2rt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hj5bo9x2rt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hj5bo9x2rt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hj5bo9x2rt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hj5bo9x2rt] { font-size: 3rem; }
.photo-placeholder span[b-hj5bo9x2rt] { font-size: 0.78rem; }
.photo-actions[b-hj5bo9x2rt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hj5bo9x2rt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hj5bo9x2rt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hj5bo9x2rt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hj5bo9x2rt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hj5bo9x2rt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hj5bo9x2rt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hj5bo9x2rt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hj5bo9x2rt] { filter: brightness(1.15); transform: scale(1.05); }
[b-hj5bo9x2rt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hj5bo9x2rt] { padding: 0.75rem; }
    .crud-header[b-hj5bo9x2rt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hj5bo9x2rt] { font-size: 1.1rem; }
    .btn-text[b-hj5bo9x2rt] { display: none; }
    .form-row[b-hj5bo9x2rt] { flex-direction: column; }
    .form-row-4[b-hj5bo9x2rt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hj5bo9x2rt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hj5bo9x2rt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hj5bo9x2rt] { padding: 0.75rem; }
    .modal-tabs[b-hj5bo9x2rt] { overflow-x: auto; }
    .modal-tab[b-hj5bo9x2rt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hj5bo9x2rt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hj5bo9x2rt] { display: grid !important; }
    .crud-cards-wrapper[b-hj5bo9x2rt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hj5bo9x2rt] { grid-template-columns: 1fr; }
    .card-details[b-hj5bo9x2rt] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hj5bo9x2rt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hj5bo9x2rt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hj5bo9x2rt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hj5bo9x2rt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_ingresonotas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-bb65ixl0jk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bb65ixl0jk 0.3s ease-out; }
@keyframes slideUp-b-bb65ixl0jk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bb65ixl0jk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bb65ixl0jk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bb65ixl0jk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bb65ixl0jk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bb65ixl0jk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bb65ixl0jk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bb65ixl0jk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bb65ixl0jk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bb65ixl0jk] { filter: brightness(1.1); }
.btn-outline[b-bb65ixl0jk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bb65ixl0jk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bb65ixl0jk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bb65ixl0jk] { filter: brightness(1.1); }
.btn-icon[b-bb65ixl0jk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bb65ixl0jk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bb65ixl0jk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bb65ixl0jk] { color: #ef4444; }
.btn-delete:hover[b-bb65ixl0jk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-bb65ixl0jk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bb65ixl0jk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bb65ixl0jk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bb65ixl0jk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bb65ixl0jk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bb65ixl0jk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-bb65ixl0jk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bb65ixl0jk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-bb65ixl0jk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bb65ixl0jk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bb65ixl0jk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bb65ixl0jk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bb65ixl0jk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bb65ixl0jk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bb65ixl0jk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-bb65ixl0jk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-bb65ixl0jk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-bb65ixl0jk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-bb65ixl0jk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-bb65ixl0jk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-bb65ixl0jk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-bb65ixl0jk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-bb65ixl0jk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-bb65ixl0jk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-bb65ixl0jk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-bb65ixl0jk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-bb65ixl0jk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-bb65ixl0jk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-bb65ixl0jk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-bb65ixl0jk] { display: block; }
.hide-on-cards[b-bb65ixl0jk] { display: none !important; }
.show-on-cards[b-bb65ixl0jk] { display: grid; }
.hide-on-grid[b-bb65ixl0jk] { display: none !important; }

/* Badges */
.badge[b-bb65ixl0jk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bb65ixl0jk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bb65ixl0jk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-bb65ixl0jk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bb65ixl0jk] { text-align: center; }
.text-muted[b-bb65ixl0jk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bb65ixl0jk], .crud-empty-state[b-bb65ixl0jk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bb65ixl0jk] { font-size: 2rem; }
.crud-spinner[b-bb65ixl0jk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bb65ixl0jk 0.6s linear infinite; }
.crud-spinner-sm[b-bb65ixl0jk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bb65ixl0jk 0.6s linear infinite; }
@keyframes spin-b-bb65ixl0jk { to { transform: rotate(360deg); } }
.spin[b-bb65ixl0jk] { animation: spin-b-bb65ixl0jk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-bb65ixl0jk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bb65ixl0jk 0.15s ease-out; }
.modal-container[b-bb65ixl0jk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bb65ixl0jk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bb65ixl0jk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-bb65ixl0jk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-bb65ixl0jk] { max-width: 420px; }
@keyframes fadeIn-b-bb65ixl0jk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bb65ixl0jk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bb65ixl0jk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bb65ixl0jk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-bb65ixl0jk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-bb65ixl0jk] { color: #dc2626; }
.modal-close[b-bb65ixl0jk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bb65ixl0jk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bb65ixl0jk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bb65ixl0jk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bb65ixl0jk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-bb65ixl0jk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bb65ixl0jk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bb65ixl0jk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bb65ixl0jk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bb65ixl0jk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bb65ixl0jk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bb65ixl0jk] { flex: 2; }
.form-group label[b-bb65ixl0jk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bb65ixl0jk], .form-group select[b-bb65ixl0jk], .form-textarea[b-bb65ixl0jk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bb65ixl0jk], .form-group select:focus[b-bb65ixl0jk], .form-textarea:focus[b-bb65ixl0jk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bb65ixl0jk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bb65ixl0jk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bb65ixl0jk] { flex: 1; display: flex; align-items: center; }
.form-check[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bb65ixl0jk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-bb65ixl0jk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-bb65ixl0jk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-bb65ixl0jk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-bb65ixl0jk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-bb65ixl0jk] { font-size: 3rem; }
.photo-placeholder span[b-bb65ixl0jk] { font-size: 0.78rem; }
.photo-actions[b-bb65ixl0jk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-bb65ixl0jk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-bb65ixl0jk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-bb65ixl0jk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-bb65ixl0jk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-bb65ixl0jk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-bb65ixl0jk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-bb65ixl0jk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-bb65ixl0jk] { filter: brightness(1.15); transform: scale(1.05); }
[b-bb65ixl0jk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bb65ixl0jk] { padding: 0.75rem; }
    .crud-header[b-bb65ixl0jk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bb65ixl0jk] { font-size: 1.1rem; }
    .btn-text[b-bb65ixl0jk] { display: none; }
    .form-row[b-bb65ixl0jk] { flex-direction: column; }
    .form-row-4[b-bb65ixl0jk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bb65ixl0jk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bb65ixl0jk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-bb65ixl0jk] { padding: 0.75rem; }
    .modal-tabs[b-bb65ixl0jk] { overflow-x: auto; }
    .modal-tab[b-bb65ixl0jk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-bb65ixl0jk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-bb65ixl0jk] { display: grid !important; }
    .crud-cards-wrapper[b-bb65ixl0jk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-bb65ixl0jk] { grid-template-columns: 1fr; }
    .card-details[b-bb65ixl0jk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-bb65ixl0jk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bb65ixl0jk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bb65ixl0jk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bb65ixl0jk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_listado_estudiante.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6nv8464klv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6nv8464klv 0.3s ease-out; }
@keyframes slideUp-b-6nv8464klv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6nv8464klv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6nv8464klv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6nv8464klv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6nv8464klv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6nv8464klv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6nv8464klv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6nv8464klv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6nv8464klv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6nv8464klv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6nv8464klv] { filter: brightness(1.1); }
.btn-outline[b-6nv8464klv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6nv8464klv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6nv8464klv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6nv8464klv] { filter: brightness(1.1); }
.btn-icon[b-6nv8464klv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6nv8464klv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6nv8464klv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6nv8464klv] { color: #ef4444; }
.btn-delete:hover[b-6nv8464klv] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6nv8464klv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6nv8464klv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6nv8464klv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6nv8464klv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6nv8464klv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6nv8464klv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6nv8464klv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6nv8464klv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6nv8464klv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6nv8464klv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6nv8464klv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6nv8464klv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6nv8464klv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6nv8464klv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6nv8464klv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6nv8464klv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6nv8464klv] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6nv8464klv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6nv8464klv] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6nv8464klv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6nv8464klv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6nv8464klv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6nv8464klv] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6nv8464klv] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6nv8464klv] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6nv8464klv] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6nv8464klv] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6nv8464klv] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6nv8464klv] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6nv8464klv] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6nv8464klv] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6nv8464klv] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6nv8464klv] { display: block; }
.hide-on-cards[b-6nv8464klv] { display: none !important; }
.show-on-cards[b-6nv8464klv] { display: grid; }
.hide-on-grid[b-6nv8464klv] { display: none !important; }

/* Badges */
.badge[b-6nv8464klv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6nv8464klv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6nv8464klv] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6nv8464klv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6nv8464klv] { text-align: center; }
.text-muted[b-6nv8464klv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6nv8464klv], .crud-empty-state[b-6nv8464klv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6nv8464klv] { font-size: 2rem; }
.crud-spinner[b-6nv8464klv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6nv8464klv 0.6s linear infinite; }
.crud-spinner-sm[b-6nv8464klv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6nv8464klv 0.6s linear infinite; }
@keyframes spin-b-6nv8464klv { to { transform: rotate(360deg); } }
.spin[b-6nv8464klv] { animation: spin-b-6nv8464klv 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6nv8464klv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6nv8464klv 0.15s ease-out; }
.modal-container[b-6nv8464klv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6nv8464klv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6nv8464klv 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6nv8464klv] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6nv8464klv] { max-width: 420px; }
@keyframes fadeIn-b-6nv8464klv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6nv8464klv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6nv8464klv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6nv8464klv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6nv8464klv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6nv8464klv] { color: #dc2626; }
.modal-close[b-6nv8464klv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6nv8464klv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6nv8464klv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6nv8464klv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6nv8464klv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6nv8464klv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6nv8464klv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6nv8464klv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6nv8464klv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6nv8464klv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6nv8464klv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6nv8464klv] { flex: 2; }
.form-group label[b-6nv8464klv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6nv8464klv], .form-group select[b-6nv8464klv], .form-textarea[b-6nv8464klv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6nv8464klv], .form-group select:focus[b-6nv8464klv], .form-textarea:focus[b-6nv8464klv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6nv8464klv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6nv8464klv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6nv8464klv] { flex: 1; display: flex; align-items: center; }
.form-check[b-6nv8464klv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6nv8464klv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6nv8464klv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6nv8464klv] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6nv8464klv] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6nv8464klv] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6nv8464klv] { font-size: 3rem; }
.photo-placeholder span[b-6nv8464klv] { font-size: 0.78rem; }
.photo-actions[b-6nv8464klv] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6nv8464klv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6nv8464klv] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6nv8464klv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6nv8464klv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6nv8464klv] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6nv8464klv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6nv8464klv] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6nv8464klv] { filter: brightness(1.15); transform: scale(1.05); }
[b-6nv8464klv] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6nv8464klv] { padding: 0.75rem; }
    .crud-header[b-6nv8464klv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6nv8464klv] { font-size: 1.1rem; }
    .btn-text[b-6nv8464klv] { display: none; }
    .form-row[b-6nv8464klv] { flex-direction: column; }
    .form-row-4[b-6nv8464klv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6nv8464klv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6nv8464klv] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6nv8464klv] { padding: 0.75rem; }
    .modal-tabs[b-6nv8464klv] { overflow-x: auto; }
    .modal-tab[b-6nv8464klv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6nv8464klv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6nv8464klv] { display: grid !important; }
    .crud-cards-wrapper[b-6nv8464klv] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6nv8464klv] { grid-template-columns: 1fr; }
    .card-details[b-6nv8464klv] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6nv8464klv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6nv8464klv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6nv8464klv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6nv8464klv] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_maestracargo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rssidyhuxp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rssidyhuxp 0.3s ease-out; }
@keyframes slideUp-b-rssidyhuxp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rssidyhuxp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rssidyhuxp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rssidyhuxp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rssidyhuxp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rssidyhuxp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rssidyhuxp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rssidyhuxp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rssidyhuxp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rssidyhuxp] { filter: brightness(1.1); }
.btn-outline[b-rssidyhuxp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rssidyhuxp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rssidyhuxp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rssidyhuxp] { filter: brightness(1.1); }
.btn-icon[b-rssidyhuxp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rssidyhuxp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rssidyhuxp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rssidyhuxp] { color: #ef4444; }
.btn-delete:hover[b-rssidyhuxp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rssidyhuxp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rssidyhuxp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rssidyhuxp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rssidyhuxp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rssidyhuxp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rssidyhuxp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rssidyhuxp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rssidyhuxp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rssidyhuxp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rssidyhuxp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rssidyhuxp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rssidyhuxp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rssidyhuxp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rssidyhuxp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rssidyhuxp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rssidyhuxp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rssidyhuxp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rssidyhuxp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rssidyhuxp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rssidyhuxp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rssidyhuxp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rssidyhuxp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rssidyhuxp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rssidyhuxp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rssidyhuxp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rssidyhuxp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rssidyhuxp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rssidyhuxp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rssidyhuxp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rssidyhuxp] { display: block; }
.hide-on-cards[b-rssidyhuxp] { display: none !important; }
.show-on-cards[b-rssidyhuxp] { display: grid; }
.hide-on-grid[b-rssidyhuxp] { display: none !important; }

/* Badges */
.badge[b-rssidyhuxp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rssidyhuxp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rssidyhuxp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rssidyhuxp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rssidyhuxp] { text-align: center; }
.text-muted[b-rssidyhuxp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rssidyhuxp], .crud-empty-state[b-rssidyhuxp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rssidyhuxp] { font-size: 2rem; }
.crud-spinner[b-rssidyhuxp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rssidyhuxp 0.6s linear infinite; }
.crud-spinner-sm[b-rssidyhuxp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rssidyhuxp 0.6s linear infinite; }
@keyframes spin-b-rssidyhuxp { to { transform: rotate(360deg); } }
.spin[b-rssidyhuxp] { animation: spin-b-rssidyhuxp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rssidyhuxp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rssidyhuxp 0.15s ease-out; }
.modal-container[b-rssidyhuxp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rssidyhuxp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rssidyhuxp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rssidyhuxp] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rssidyhuxp] { max-width: 420px; }
@keyframes fadeIn-b-rssidyhuxp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rssidyhuxp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rssidyhuxp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rssidyhuxp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rssidyhuxp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rssidyhuxp] { color: #dc2626; }
.modal-close[b-rssidyhuxp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rssidyhuxp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rssidyhuxp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rssidyhuxp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rssidyhuxp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rssidyhuxp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rssidyhuxp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rssidyhuxp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rssidyhuxp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rssidyhuxp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rssidyhuxp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rssidyhuxp] { flex: 2; }
.form-group label[b-rssidyhuxp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rssidyhuxp], .form-group select[b-rssidyhuxp], .form-textarea[b-rssidyhuxp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rssidyhuxp], .form-group select:focus[b-rssidyhuxp], .form-textarea:focus[b-rssidyhuxp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rssidyhuxp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rssidyhuxp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rssidyhuxp] { flex: 1; display: flex; align-items: center; }
.form-check[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rssidyhuxp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rssidyhuxp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rssidyhuxp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rssidyhuxp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rssidyhuxp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rssidyhuxp] { font-size: 3rem; }
.photo-placeholder span[b-rssidyhuxp] { font-size: 0.78rem; }
.photo-actions[b-rssidyhuxp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rssidyhuxp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rssidyhuxp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rssidyhuxp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rssidyhuxp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rssidyhuxp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rssidyhuxp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rssidyhuxp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rssidyhuxp] { filter: brightness(1.15); transform: scale(1.05); }
[b-rssidyhuxp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rssidyhuxp] { padding: 0.75rem; }
    .crud-header[b-rssidyhuxp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rssidyhuxp] { font-size: 1.1rem; }
    .btn-text[b-rssidyhuxp] { display: none; }
    .form-row[b-rssidyhuxp] { flex-direction: column; }
    .form-row-4[b-rssidyhuxp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rssidyhuxp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rssidyhuxp] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rssidyhuxp] { padding: 0.75rem; }
    .modal-tabs[b-rssidyhuxp] { overflow-x: auto; }
    .modal-tab[b-rssidyhuxp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rssidyhuxp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rssidyhuxp] { display: grid !important; }
    .crud-cards-wrapper[b-rssidyhuxp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rssidyhuxp] { grid-template-columns: 1fr; }
    .card-details[b-rssidyhuxp] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rssidyhuxp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rssidyhuxp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rssidyhuxp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rssidyhuxp] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-rssidyhuxp] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-rssidyhuxp] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-rssidyhuxp] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-rssidyhuxp] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-rssidyhuxp] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-rssidyhuxp] { min-width: 140px; }
.param-band-input[b-rssidyhuxp] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-rssidyhuxp] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-rssidyhuxp] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-rssidyhuxp] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-rssidyhuxp] { border-bottom: none; }
.param-section-title[b-rssidyhuxp] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-rssidyhuxp] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-rssidyhuxp] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-rssidyhuxp] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-rssidyhuxp] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-rssidyhuxp] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-rssidyhuxp] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-rssidyhuxp] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-rssidyhuxp] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-rssidyhuxp] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-rssidyhuxp] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-rssidyhuxp] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-rssidyhuxp] { border-bottom: none; }
.help-section p[b-rssidyhuxp] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-rssidyhuxp], .help-section ol[b-rssidyhuxp] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-rssidyhuxp] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-rssidyhuxp] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-rssidyhuxp] { color: var(--rg-accent,#2563eb); }
.help-tip[b-rssidyhuxp] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-rssidyhuxp] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-rssidyhuxp] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-rssidyhuxp], .form-row-3[b-rssidyhuxp], .form-row-4[b-rssidyhuxp] { grid-template-columns: 1fr; }
    .param-band[b-rssidyhuxp] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-rssidyhuxp] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-rssidyhuxp] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-rssidyhuxp] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-rssidyhuxp] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-rssidyhuxp] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-rssidyhuxp] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-rssidyhuxp] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-rssidyhuxp] { color: var(--rg-accent, #2563eb); }

.form-hint[b-rssidyhuxp] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-rssidyhuxp] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-rssidyhuxp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-rssidyhuxp] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-rssidyhuxp] { filter: brightness(1.1); }

.text-muted[b-rssidyhuxp] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-rssidyhuxp] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-rssidyhuxp] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-rssidyhuxp] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-rssidyhuxp] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-rssidyhuxp]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-rssidyhuxp] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-rssidyhuxp]::before {
    transform: translateX(16px);
}
.switch-text[b-rssidyhuxp] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-rssidyhuxp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-rssidyhuxp] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-rssidyhuxp] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_materias.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-s3fy5nfxqj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-s3fy5nfxqj 0.3s ease-out; }
@keyframes slideUp-b-s3fy5nfxqj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-s3fy5nfxqj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-s3fy5nfxqj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-s3fy5nfxqj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-s3fy5nfxqj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-s3fy5nfxqj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-s3fy5nfxqj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-s3fy5nfxqj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-s3fy5nfxqj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-s3fy5nfxqj] { filter: brightness(1.1); }
.btn-outline[b-s3fy5nfxqj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-s3fy5nfxqj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-s3fy5nfxqj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-s3fy5nfxqj] { filter: brightness(1.1); }
.btn-icon[b-s3fy5nfxqj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-s3fy5nfxqj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-s3fy5nfxqj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-s3fy5nfxqj] { color: #ef4444; }
.btn-delete:hover[b-s3fy5nfxqj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-s3fy5nfxqj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-s3fy5nfxqj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-s3fy5nfxqj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-s3fy5nfxqj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-s3fy5nfxqj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-s3fy5nfxqj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-s3fy5nfxqj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-s3fy5nfxqj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-s3fy5nfxqj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-s3fy5nfxqj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-s3fy5nfxqj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-s3fy5nfxqj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-s3fy5nfxqj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-s3fy5nfxqj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-s3fy5nfxqj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-s3fy5nfxqj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-s3fy5nfxqj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-s3fy5nfxqj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-s3fy5nfxqj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-s3fy5nfxqj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-s3fy5nfxqj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-s3fy5nfxqj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-s3fy5nfxqj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-s3fy5nfxqj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-s3fy5nfxqj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-s3fy5nfxqj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-s3fy5nfxqj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-s3fy5nfxqj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-s3fy5nfxqj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-s3fy5nfxqj] { display: block; }
.hide-on-cards[b-s3fy5nfxqj] { display: none !important; }
.show-on-cards[b-s3fy5nfxqj] { display: grid; }
.hide-on-grid[b-s3fy5nfxqj] { display: none !important; }

/* Badges */
.badge[b-s3fy5nfxqj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-s3fy5nfxqj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-s3fy5nfxqj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-s3fy5nfxqj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-s3fy5nfxqj] { text-align: center; }
.text-muted[b-s3fy5nfxqj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-s3fy5nfxqj], .crud-empty-state[b-s3fy5nfxqj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-s3fy5nfxqj] { font-size: 2rem; }
.crud-spinner[b-s3fy5nfxqj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-s3fy5nfxqj 0.6s linear infinite; }
.crud-spinner-sm[b-s3fy5nfxqj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-s3fy5nfxqj 0.6s linear infinite; }
@keyframes spin-b-s3fy5nfxqj { to { transform: rotate(360deg); } }
.spin[b-s3fy5nfxqj] { animation: spin-b-s3fy5nfxqj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-s3fy5nfxqj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-s3fy5nfxqj 0.15s ease-out; }
.modal-container[b-s3fy5nfxqj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-s3fy5nfxqj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-s3fy5nfxqj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-s3fy5nfxqj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-s3fy5nfxqj] { max-width: 420px; }
@keyframes fadeIn-b-s3fy5nfxqj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-s3fy5nfxqj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-s3fy5nfxqj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-s3fy5nfxqj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-s3fy5nfxqj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-s3fy5nfxqj] { color: #dc2626; }
.modal-close[b-s3fy5nfxqj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-s3fy5nfxqj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-s3fy5nfxqj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-s3fy5nfxqj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-s3fy5nfxqj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-s3fy5nfxqj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-s3fy5nfxqj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-s3fy5nfxqj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-s3fy5nfxqj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-s3fy5nfxqj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-s3fy5nfxqj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-s3fy5nfxqj] { flex: 2; }
.form-group label[b-s3fy5nfxqj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-s3fy5nfxqj], .form-group select[b-s3fy5nfxqj], .form-textarea[b-s3fy5nfxqj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-s3fy5nfxqj], .form-group select:focus[b-s3fy5nfxqj], .form-textarea:focus[b-s3fy5nfxqj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-s3fy5nfxqj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-s3fy5nfxqj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-s3fy5nfxqj] { flex: 1; display: flex; align-items: center; }
.form-check[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-s3fy5nfxqj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-s3fy5nfxqj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-s3fy5nfxqj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-s3fy5nfxqj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-s3fy5nfxqj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-s3fy5nfxqj] { font-size: 3rem; }
.photo-placeholder span[b-s3fy5nfxqj] { font-size: 0.78rem; }
.photo-actions[b-s3fy5nfxqj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-s3fy5nfxqj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-s3fy5nfxqj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-s3fy5nfxqj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-s3fy5nfxqj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-s3fy5nfxqj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-s3fy5nfxqj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-s3fy5nfxqj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-s3fy5nfxqj] { filter: brightness(1.15); transform: scale(1.05); }
[b-s3fy5nfxqj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-s3fy5nfxqj] { padding: 0.75rem; }
    .crud-header[b-s3fy5nfxqj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-s3fy5nfxqj] { font-size: 1.1rem; }
    .btn-text[b-s3fy5nfxqj] { display: none; }
    .form-row[b-s3fy5nfxqj] { flex-direction: column; }
    .form-row-4[b-s3fy5nfxqj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-s3fy5nfxqj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-s3fy5nfxqj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-s3fy5nfxqj] { padding: 0.75rem; }
    .modal-tabs[b-s3fy5nfxqj] { overflow-x: auto; }
    .modal-tab[b-s3fy5nfxqj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-s3fy5nfxqj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-s3fy5nfxqj] { display: grid !important; }
    .crud-cards-wrapper[b-s3fy5nfxqj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-s3fy5nfxqj] { grid-template-columns: 1fr; }
    .card-details[b-s3fy5nfxqj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-s3fy5nfxqj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-s3fy5nfxqj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-s3fy5nfxqj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-s3fy5nfxqj] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-s3fy5nfxqj] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-s3fy5nfxqj] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-s3fy5nfxqj] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-s3fy5nfxqj] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-s3fy5nfxqj] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-s3fy5nfxqj] { min-width: 140px; }
.param-band-input[b-s3fy5nfxqj] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-s3fy5nfxqj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-s3fy5nfxqj] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-s3fy5nfxqj] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-s3fy5nfxqj] { border-bottom: none; }
.param-section-title[b-s3fy5nfxqj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-s3fy5nfxqj] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-s3fy5nfxqj] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-s3fy5nfxqj] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-s3fy5nfxqj] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-s3fy5nfxqj] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-s3fy5nfxqj] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-s3fy5nfxqj] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-s3fy5nfxqj] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-s3fy5nfxqj] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-s3fy5nfxqj] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-s3fy5nfxqj] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-s3fy5nfxqj] { border-bottom: none; }
.help-section p[b-s3fy5nfxqj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-s3fy5nfxqj], .help-section ol[b-s3fy5nfxqj] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-s3fy5nfxqj] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-s3fy5nfxqj] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-s3fy5nfxqj] { color: var(--rg-accent,#2563eb); }
.help-tip[b-s3fy5nfxqj] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-s3fy5nfxqj] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-s3fy5nfxqj] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-s3fy5nfxqj], .form-row-3[b-s3fy5nfxqj], .form-row-4[b-s3fy5nfxqj] { grid-template-columns: 1fr; }
    .param-band[b-s3fy5nfxqj] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-s3fy5nfxqj] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-s3fy5nfxqj] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-s3fy5nfxqj] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-s3fy5nfxqj] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-s3fy5nfxqj] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-s3fy5nfxqj] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-s3fy5nfxqj] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-s3fy5nfxqj] { color: var(--rg-accent, #2563eb); }

.form-hint[b-s3fy5nfxqj] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-s3fy5nfxqj] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-s3fy5nfxqj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-s3fy5nfxqj] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-s3fy5nfxqj] { filter: brightness(1.1); }

.text-muted[b-s3fy5nfxqj] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-s3fy5nfxqj] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-s3fy5nfxqj] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-s3fy5nfxqj] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-s3fy5nfxqj] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-s3fy5nfxqj]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-s3fy5nfxqj] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-s3fy5nfxqj]::before {
    transform: translateX(16px);
}
.switch-text[b-s3fy5nfxqj] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-s3fy5nfxqj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-s3fy5nfxqj] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-s3fy5nfxqj] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_nota_minima_para_pasar_curso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xwc93ahhpa] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xwc93ahhpa 0.3s ease-out; }
@keyframes slideUp-b-xwc93ahhpa { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xwc93ahhpa] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xwc93ahhpa] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xwc93ahhpa] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xwc93ahhpa] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xwc93ahhpa] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xwc93ahhpa] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xwc93ahhpa] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xwc93ahhpa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xwc93ahhpa] { filter: brightness(1.1); }
.btn-outline[b-xwc93ahhpa] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xwc93ahhpa] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xwc93ahhpa] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xwc93ahhpa] { filter: brightness(1.1); }
.btn-icon[b-xwc93ahhpa] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xwc93ahhpa] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xwc93ahhpa] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xwc93ahhpa] { color: #ef4444; }
.btn-delete:hover[b-xwc93ahhpa] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xwc93ahhpa] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xwc93ahhpa] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xwc93ahhpa] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xwc93ahhpa] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xwc93ahhpa] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xwc93ahhpa] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xwc93ahhpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xwc93ahhpa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xwc93ahhpa] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xwc93ahhpa] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xwc93ahhpa] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xwc93ahhpa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xwc93ahhpa] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xwc93ahhpa] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xwc93ahhpa] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xwc93ahhpa] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xwc93ahhpa] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xwc93ahhpa] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xwc93ahhpa] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xwc93ahhpa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xwc93ahhpa] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xwc93ahhpa] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xwc93ahhpa] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xwc93ahhpa] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xwc93ahhpa] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xwc93ahhpa] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xwc93ahhpa] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xwc93ahhpa] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xwc93ahhpa] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xwc93ahhpa] { display: block; }
.hide-on-cards[b-xwc93ahhpa] { display: none !important; }
.show-on-cards[b-xwc93ahhpa] { display: grid; }
.hide-on-grid[b-xwc93ahhpa] { display: none !important; }

/* Badges */
.badge[b-xwc93ahhpa] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xwc93ahhpa] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xwc93ahhpa] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xwc93ahhpa] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xwc93ahhpa] { text-align: center; }
.text-muted[b-xwc93ahhpa] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xwc93ahhpa], .crud-empty-state[b-xwc93ahhpa] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xwc93ahhpa] { font-size: 2rem; }
.crud-spinner[b-xwc93ahhpa] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xwc93ahhpa 0.6s linear infinite; }
.crud-spinner-sm[b-xwc93ahhpa] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xwc93ahhpa 0.6s linear infinite; }
@keyframes spin-b-xwc93ahhpa { to { transform: rotate(360deg); } }
.spin[b-xwc93ahhpa] { animation: spin-b-xwc93ahhpa 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xwc93ahhpa] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xwc93ahhpa 0.15s ease-out; }
.modal-container[b-xwc93ahhpa] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xwc93ahhpa] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xwc93ahhpa 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xwc93ahhpa] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xwc93ahhpa] { max-width: 420px; }
@keyframes fadeIn-b-xwc93ahhpa { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xwc93ahhpa { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xwc93ahhpa] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xwc93ahhpa] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xwc93ahhpa] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xwc93ahhpa] { color: #dc2626; }
.modal-close[b-xwc93ahhpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xwc93ahhpa] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xwc93ahhpa] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xwc93ahhpa] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xwc93ahhpa] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xwc93ahhpa] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xwc93ahhpa] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xwc93ahhpa] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xwc93ahhpa] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xwc93ahhpa] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xwc93ahhpa] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xwc93ahhpa] { flex: 2; }
.form-group label[b-xwc93ahhpa] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xwc93ahhpa], .form-group select[b-xwc93ahhpa], .form-textarea[b-xwc93ahhpa] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xwc93ahhpa], .form-group select:focus[b-xwc93ahhpa], .form-textarea:focus[b-xwc93ahhpa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xwc93ahhpa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xwc93ahhpa] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xwc93ahhpa] { flex: 1; display: flex; align-items: center; }
.form-check[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xwc93ahhpa] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xwc93ahhpa] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xwc93ahhpa] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xwc93ahhpa] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xwc93ahhpa] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xwc93ahhpa] { font-size: 3rem; }
.photo-placeholder span[b-xwc93ahhpa] { font-size: 0.78rem; }
.photo-actions[b-xwc93ahhpa] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xwc93ahhpa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xwc93ahhpa] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xwc93ahhpa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xwc93ahhpa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xwc93ahhpa] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xwc93ahhpa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xwc93ahhpa] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xwc93ahhpa] { filter: brightness(1.15); transform: scale(1.05); }
[b-xwc93ahhpa] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xwc93ahhpa] { padding: 0.75rem; }
    .crud-header[b-xwc93ahhpa] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xwc93ahhpa] { font-size: 1.1rem; }
    .btn-text[b-xwc93ahhpa] { display: none; }
    .form-row[b-xwc93ahhpa] { flex-direction: column; }
    .form-row-4[b-xwc93ahhpa] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xwc93ahhpa] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xwc93ahhpa] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xwc93ahhpa] { padding: 0.75rem; }
    .modal-tabs[b-xwc93ahhpa] { overflow-x: auto; }
    .modal-tab[b-xwc93ahhpa] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xwc93ahhpa] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xwc93ahhpa] { display: grid !important; }
    .crud-cards-wrapper[b-xwc93ahhpa] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xwc93ahhpa] { grid-template-columns: 1fr; }
    .card-details[b-xwc93ahhpa] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xwc93ahhpa] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xwc93ahhpa] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xwc93ahhpa] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xwc93ahhpa] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-xwc93ahhpa] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-xwc93ahhpa] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-xwc93ahhpa] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-xwc93ahhpa] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-xwc93ahhpa] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-xwc93ahhpa] { min-width: 140px; }
.param-band-input[b-xwc93ahhpa] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-xwc93ahhpa] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-xwc93ahhpa] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-xwc93ahhpa] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-xwc93ahhpa] { border-bottom: none; }
.param-section-title[b-xwc93ahhpa] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-xwc93ahhpa] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-xwc93ahhpa] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-xwc93ahhpa] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-xwc93ahhpa] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-xwc93ahhpa] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-xwc93ahhpa] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-xwc93ahhpa] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-xwc93ahhpa] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-xwc93ahhpa] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-xwc93ahhpa] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-xwc93ahhpa] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-xwc93ahhpa] { border-bottom: none; }
.help-section p[b-xwc93ahhpa] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-xwc93ahhpa], .help-section ol[b-xwc93ahhpa] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-xwc93ahhpa] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-xwc93ahhpa] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-xwc93ahhpa] { color: var(--rg-accent,#2563eb); }
.help-tip[b-xwc93ahhpa] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-xwc93ahhpa] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-xwc93ahhpa] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-xwc93ahhpa], .form-row-3[b-xwc93ahhpa], .form-row-4[b-xwc93ahhpa] { grid-template-columns: 1fr; }
    .param-band[b-xwc93ahhpa] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-xwc93ahhpa] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-xwc93ahhpa] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-xwc93ahhpa] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-xwc93ahhpa] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-xwc93ahhpa] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-xwc93ahhpa] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-xwc93ahhpa] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-xwc93ahhpa] { color: var(--rg-accent, #2563eb); }

.form-hint[b-xwc93ahhpa] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-xwc93ahhpa] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-xwc93ahhpa] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-xwc93ahhpa] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-xwc93ahhpa] { filter: brightness(1.1); }

.text-muted[b-xwc93ahhpa] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-xwc93ahhpa] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-xwc93ahhpa] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-xwc93ahhpa] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-xwc93ahhpa] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-xwc93ahhpa]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-xwc93ahhpa] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-xwc93ahhpa]::before {
    transform: translateX(16px);
}
.switch-text[b-xwc93ahhpa] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-xwc93ahhpa] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-xwc93ahhpa] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-xwc93ahhpa] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_parametros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0nrv7e88f6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0nrv7e88f6 0.3s ease-out; }
@keyframes slideUp-b-0nrv7e88f6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0nrv7e88f6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0nrv7e88f6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0nrv7e88f6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0nrv7e88f6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0nrv7e88f6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0nrv7e88f6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0nrv7e88f6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0nrv7e88f6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0nrv7e88f6] { filter: brightness(1.1); }
.btn-outline[b-0nrv7e88f6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0nrv7e88f6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0nrv7e88f6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0nrv7e88f6] { filter: brightness(1.1); }
.btn-icon[b-0nrv7e88f6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0nrv7e88f6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0nrv7e88f6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0nrv7e88f6] { color: #ef4444; }
.btn-delete:hover[b-0nrv7e88f6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0nrv7e88f6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0nrv7e88f6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0nrv7e88f6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0nrv7e88f6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0nrv7e88f6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0nrv7e88f6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0nrv7e88f6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0nrv7e88f6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0nrv7e88f6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0nrv7e88f6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0nrv7e88f6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0nrv7e88f6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0nrv7e88f6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0nrv7e88f6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0nrv7e88f6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0nrv7e88f6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0nrv7e88f6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0nrv7e88f6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0nrv7e88f6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0nrv7e88f6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0nrv7e88f6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0nrv7e88f6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0nrv7e88f6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0nrv7e88f6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0nrv7e88f6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0nrv7e88f6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0nrv7e88f6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0nrv7e88f6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0nrv7e88f6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0nrv7e88f6] { display: block; }
.hide-on-cards[b-0nrv7e88f6] { display: none !important; }
.show-on-cards[b-0nrv7e88f6] { display: grid; }
.hide-on-grid[b-0nrv7e88f6] { display: none !important; }

/* Badges */
.badge[b-0nrv7e88f6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0nrv7e88f6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0nrv7e88f6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0nrv7e88f6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0nrv7e88f6] { text-align: center; }
.text-muted[b-0nrv7e88f6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0nrv7e88f6], .crud-empty-state[b-0nrv7e88f6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0nrv7e88f6] { font-size: 2rem; }
.crud-spinner[b-0nrv7e88f6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0nrv7e88f6 0.6s linear infinite; }
.crud-spinner-sm[b-0nrv7e88f6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0nrv7e88f6 0.6s linear infinite; }
@keyframes spin-b-0nrv7e88f6 { to { transform: rotate(360deg); } }
.spin[b-0nrv7e88f6] { animation: spin-b-0nrv7e88f6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0nrv7e88f6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0nrv7e88f6 0.15s ease-out; }
.modal-container[b-0nrv7e88f6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0nrv7e88f6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0nrv7e88f6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0nrv7e88f6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0nrv7e88f6] { max-width: 420px; }
@keyframes fadeIn-b-0nrv7e88f6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0nrv7e88f6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0nrv7e88f6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0nrv7e88f6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0nrv7e88f6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0nrv7e88f6] { color: #dc2626; }
.modal-close[b-0nrv7e88f6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0nrv7e88f6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0nrv7e88f6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0nrv7e88f6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0nrv7e88f6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0nrv7e88f6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0nrv7e88f6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0nrv7e88f6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0nrv7e88f6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0nrv7e88f6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0nrv7e88f6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0nrv7e88f6] { flex: 2; }
.form-group label[b-0nrv7e88f6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0nrv7e88f6], .form-group select[b-0nrv7e88f6], .form-textarea[b-0nrv7e88f6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0nrv7e88f6], .form-group select:focus[b-0nrv7e88f6], .form-textarea:focus[b-0nrv7e88f6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0nrv7e88f6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0nrv7e88f6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0nrv7e88f6] { flex: 1; display: flex; align-items: center; }
.form-check[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0nrv7e88f6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0nrv7e88f6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0nrv7e88f6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0nrv7e88f6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0nrv7e88f6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0nrv7e88f6] { font-size: 3rem; }
.photo-placeholder span[b-0nrv7e88f6] { font-size: 0.78rem; }
.photo-actions[b-0nrv7e88f6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0nrv7e88f6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0nrv7e88f6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0nrv7e88f6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0nrv7e88f6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0nrv7e88f6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0nrv7e88f6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0nrv7e88f6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0nrv7e88f6] { filter: brightness(1.15); transform: scale(1.05); }
[b-0nrv7e88f6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0nrv7e88f6] { padding: 0.75rem; }
    .crud-header[b-0nrv7e88f6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0nrv7e88f6] { font-size: 1.1rem; }
    .btn-text[b-0nrv7e88f6] { display: none; }
    .form-row[b-0nrv7e88f6] { flex-direction: column; }
    .form-row-4[b-0nrv7e88f6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0nrv7e88f6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0nrv7e88f6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0nrv7e88f6] { padding: 0.75rem; }
    .modal-tabs[b-0nrv7e88f6] { overflow-x: auto; }
    .modal-tab[b-0nrv7e88f6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0nrv7e88f6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0nrv7e88f6] { display: grid !important; }
    .crud-cards-wrapper[b-0nrv7e88f6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0nrv7e88f6] { grid-template-columns: 1fr; }
    .card-details[b-0nrv7e88f6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0nrv7e88f6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0nrv7e88f6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0nrv7e88f6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0nrv7e88f6] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-0nrv7e88f6] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-0nrv7e88f6] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-0nrv7e88f6] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-0nrv7e88f6] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-0nrv7e88f6] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-0nrv7e88f6] { min-width: 140px; }
.param-band-input[b-0nrv7e88f6] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-0nrv7e88f6] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-0nrv7e88f6] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-0nrv7e88f6] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-0nrv7e88f6] { border-bottom: none; }
.param-section-title[b-0nrv7e88f6] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-0nrv7e88f6] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-0nrv7e88f6] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-0nrv7e88f6] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-0nrv7e88f6] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-0nrv7e88f6] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-0nrv7e88f6] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-0nrv7e88f6] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-0nrv7e88f6] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-0nrv7e88f6] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-0nrv7e88f6] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-0nrv7e88f6] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-0nrv7e88f6] { border-bottom: none; }
.help-section p[b-0nrv7e88f6] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-0nrv7e88f6], .help-section ol[b-0nrv7e88f6] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-0nrv7e88f6] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-0nrv7e88f6] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-0nrv7e88f6] { color: var(--rg-accent,#2563eb); }
.help-tip[b-0nrv7e88f6] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-0nrv7e88f6] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-0nrv7e88f6] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-0nrv7e88f6], .form-row-3[b-0nrv7e88f6] { grid-template-columns: 1fr; }
    .param-band[b-0nrv7e88f6] { flex-direction: column; gap: .5rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_planespago.razor.rz.scp.css */
/* ============================================================
   Frmclg_planespago — Planes de Pago por Período (grid editable inline)
   Copiado base de Frmclientes.razor.css + estilos propios pp-*
   ============================================================ */

.crud-container[b-riwlo0h0qg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-riwlo0h0qg 0.3s ease-out; }
@keyframes slideUp-b-riwlo0h0qg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-riwlo0h0qg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-riwlo0h0qg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-riwlo0h0qg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-riwlo0h0qg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-riwlo0h0qg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-riwlo0h0qg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-riwlo0h0qg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-riwlo0h0qg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-riwlo0h0qg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-riwlo0h0qg] { filter: brightness(1.1); }
.btn-outline[b-riwlo0h0qg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-riwlo0h0qg] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-riwlo0h0qg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-riwlo0h0qg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-riwlo0h0qg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-riwlo0h0qg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-riwlo0h0qg] { background: rgba(16,185,129,0.12); color: #6ee7b7; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-riwlo0h0qg] { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* Spinner */
.crud-loading[b-riwlo0h0qg], .crud-empty-state[b-riwlo0h0qg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-riwlo0h0qg] { font-size: 2rem; }
.crud-spinner[b-riwlo0h0qg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-riwlo0h0qg 0.6s linear infinite; }
.crud-spinner-sm[b-riwlo0h0qg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-riwlo0h0qg 0.6s linear infinite; }
@keyframes spin-b-riwlo0h0qg { to { transform: rotate(360deg); } }
.spin[b-riwlo0h0qg] { animation: spin-b-riwlo0h0qg 0.8s linear infinite; }

/* Font mono */
.font-mono[b-riwlo0h0qg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-right[b-riwlo0h0qg] { text-align: right; }

/* ── Filtro de período ────────────────────────────────────────────────────── */
.pp-filter-bar[b-riwlo0h0qg] { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.875rem; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.pp-filter-label[b-riwlo0h0qg] { font-size: 0.78rem; font-weight: 600; color: var(--rg-text-secondary, #475569); display: flex; align-items: center; gap: 0.35rem; white-space: nowrap; }
.pp-filter-select[b-riwlo0h0qg] { flex: 0 0 auto; min-width: 200px; max-width: 280px; padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.pp-filter-select:focus[b-riwlo0h0qg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.pp-count[b-riwlo0h0qg] { margin-left: auto; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* ── Grid editable ────────────────────────────────────────────────────────── */
.pp-grid-wrapper[b-riwlo0h0qg] { overflow-x: auto; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 300px); }
.pp-table[b-riwlo0h0qg] { width: 100%; border-collapse: collapse; font-size: 0.82rem; min-width: 900px; }
.pp-table thead[b-riwlo0h0qg] { position: sticky; top: 0; z-index: 1; }
.pp-table th[b-riwlo0h0qg] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.5rem 0.6rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; }
.pp-table th.text-right[b-riwlo0h0qg] { text-align: right; }
.pp-table td[b-riwlo0h0qg] { padding: 0.3rem 0.4rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); vertical-align: middle; }
.pp-table tbody tr:hover td[b-riwlo0h0qg] { background: var(--rg-bg-hover, #f8fafc); }

/* Inputs del grid */
.pp-inp[b-riwlo0h0qg] { width: 100%; min-width: 90px; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 4px; padding: 0.25rem 0.4rem; font-size: 0.82rem; text-align: right; transition: border-color 0.15s; }
.pp-inp:focus[b-riwlo0h0qg] { border-color: var(--rg-accent, #4f46e5); outline: none; box-shadow: 0 0 0 2px rgba(79,70,229,0.1); }
.pp-plan-inp[b-riwlo0h0qg] { width: 80px; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 4px; padding: 0.25rem 0.4rem; font-size: 0.82rem; transition: border-color 0.15s; }
.pp-plan-inp:focus[b-riwlo0h0qg] { border-color: var(--rg-accent, #4f46e5); outline: none; }

/* Columnas especiales */
.pp-readonly[b-riwlo0h0qg] { color: var(--rg-text-secondary, #475569); font-size: 0.82rem; }
.pp-total[b-riwlo0h0qg] { font-weight: 700; color: var(--rg-accent, #4f46e5); font-size: 0.85rem; font-family: 'Cascadia Code', 'Fira Code', monospace; text-align: right; white-space: nowrap; }

/* ── Modal ─────────────────────────────────────────────────────────────────── */
.modal-backdrop[b-riwlo0h0qg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-riwlo0h0qg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-riwlo0h0qg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-riwlo0h0qg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-header[b-riwlo0h0qg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-riwlo0h0qg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-riwlo0h0qg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-riwlo0h0qg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-riwlo0h0qg] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-riwlo0h0qg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ── Botón Ayuda ──────────────────────────────────────────────────────────── */
.btn-help[b-riwlo0h0qg] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-riwlo0h0qg] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-riwlo0h0qg] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-riwlo0h0qg] { background: rgba(37,99,235,0.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────────── */
.help-icon-header[b-riwlo0h0qg] { color: var(--rg-accent, #2563eb); margin-right: 0.25rem; }
.help-body[b-riwlo0h0qg] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-riwlo0h0qg] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.help-section:last-child[b-riwlo0h0qg] { border-bottom: none; }
.help-section p[b-riwlo0h0qg] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.4rem; }
.help-section ul[b-riwlo0h0qg], .help-section ol[b-riwlo0h0qg] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-riwlo0h0qg] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.2rem; }
.help-section-title[b-riwlo0h0qg] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-riwlo0h0qg] { color: var(--rg-accent, #2563eb); }
.help-tip[b-riwlo0h0qg] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary, #475569); }
.help-tip i[b-riwlo0h0qg] { color: var(--rg-accent, #2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-riwlo0h0qg] { background: rgba(37,99,235,0.12); }
.help-steps[b-riwlo0h0qg] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-riwlo0h0qg] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-riwlo0h0qg] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent, #2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-riwlo0h0qg] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); padding-top: 0.1rem; }
.help-table[b-riwlo0h0qg] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-riwlo0h0qg] { background: var(--rg-bg-subtle, #f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted, #94a3b8); }
.help-table td[b-riwlo0h0qg] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-secondary, #475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-riwlo0h0qg] { background: rgba(255,255,255,0.04); }
.help-badge[b-riwlo0h0qg] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-riwlo0h0qg]   { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-riwlo0h0qg] { background: rgba(217,119,6,0.12); color: #92400e; }
[data-mode="dark"] .help-badge-ok[b-riwlo0h0qg]   { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-riwlo0h0qg] { color: #fcd34d; }

/* ── Acordeón por Plan ───────────────────────────────────────────────────── */
.pp-acc-toolbar[b-riwlo0h0qg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0 0.75rem;
    flex-wrap: wrap;
}
.pp-acc-toggle-all[b-riwlo0h0qg] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
    padding: 0.3rem 0.65rem;
    border-radius: 0.4rem;
    font-size: 0.78rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: all 0.15s;
}
.pp-acc-toggle-all:hover[b-riwlo0h0qg] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
    border-color: var(--rg-primary, #1a3a5c);
}
.pp-acc-summary[b-riwlo0h0qg] {
    margin-left: auto;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
}
.pp-acc-summary strong[b-riwlo0h0qg] { color: var(--rg-text-primary); }

.pp-acc-panel[b-riwlo0h0qg] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 0.6rem;
    overflow: hidden;
    transition: box-shadow 0.15s;
}
.pp-acc-panel.open[b-riwlo0h0qg] {
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    border-color: rgba(26, 58, 92, 0.25);
}

.pp-acc-header[b-riwlo0h0qg] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-subtle);
    border: none;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s;
    font-family: inherit;
}
.pp-acc-header:hover[b-riwlo0h0qg] { background: var(--rg-bg-hover); }
.pp-acc-panel.open .pp-acc-header[b-riwlo0h0qg] {
    background: linear-gradient(90deg, rgba(26, 58, 92, 0.08), transparent);
    border-bottom: 1px solid var(--rg-border);
}

.pp-acc-chevron[b-riwlo0h0qg] {
    color: var(--rg-text-secondary);
    font-size: 0.9rem;
    transition: transform 0.15s;
    width: 16px;
    text-align: center;
}
.pp-acc-title[b-riwlo0h0qg] {
    flex: 0 0 auto;
    color: var(--rg-text-primary);
    font-size: 0.92rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.pp-acc-title strong[b-riwlo0h0qg] {
    color: var(--rg-primary, #1a3a5c);
    font-size: 1.05rem;
    margin-left: 0.15rem;
}
.pp-acc-title i.bi-bookmark-fill[b-riwlo0h0qg] { color: var(--rg-accent, #2563eb); }

.pp-acc-badge[b-riwlo0h0qg] {
    background: rgba(37, 99, 235, 0.1);
    color: var(--rg-accent, #2563eb);
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 700;
}
.pp-acc-total[b-riwlo0h0qg] {
    margin-left: auto;
    color: var(--rg-success, #16a34a);
    font-size: 0.92rem;
    font-weight: 700;
}

.pp-acc-body[b-riwlo0h0qg] {
    padding: 0.75rem;
    background: var(--rg-bg-card);
}
.pp-acc-body .pp-grid-wrapper[b-riwlo0h0qg] {
    max-height: none;     /* dentro del acordeón el wrapper no necesita scroll vertical */
    border: none;
    background: transparent;
}

/* Dark mode acordeón */
[data-mode="dark"] .pp-acc-panel[b-riwlo0h0qg] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .pp-acc-header[b-riwlo0h0qg] { background: rgba(255,255,255,0.03); }
[data-mode="dark"] .pp-acc-header:hover[b-riwlo0h0qg] { background: rgba(255,255,255,0.06); }
[data-mode="dark"] .pp-acc-panel.open .pp-acc-header[b-riwlo0h0qg] { background: linear-gradient(90deg, rgba(96, 165, 250, 0.12), transparent); }
[data-mode="dark"] .pp-acc-title strong[b-riwlo0h0qg] { color: #93c5fd; }
[data-mode="dark"] .pp-acc-badge[b-riwlo0h0qg] { background: rgba(96, 165, 250, 0.15); color: #93c5fd; }
[data-mode="dark"] .pp-acc-total[b-riwlo0h0qg] { color: #86efac; }
[data-mode="dark"] .pp-acc-toggle-all[b-riwlo0h0qg] { background: rgba(255,255,255,0.03); }
[data-mode="dark"] .pp-acc-toggle-all:hover[b-riwlo0h0qg] { background: rgba(255,255,255,0.08); }

/* ── Dark mode overrides ─────────────────────────────────────────────────── */
[data-mode="dark"] .pp-filter-bar[b-riwlo0h0qg] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .pp-filter-select[b-riwlo0h0qg] { background: var(--rg-bg-input); color: var(--rg-text-primary); border-color: var(--rg-border); }
[data-mode="dark"] .pp-grid-wrapper[b-riwlo0h0qg] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .pp-table th[b-riwlo0h0qg] { background: rgba(255,255,255,0.04); }
[data-mode="dark"] .pp-inp[b-riwlo0h0qg],
[data-mode="dark"] .pp-plan-inp[b-riwlo0h0qg] { background: var(--rg-bg-input); color: var(--rg-text-primary); border-color: var(--rg-border); }
[data-mode="dark"] .modal-dialog[b-riwlo0h0qg] { background: var(--rg-bg-card); }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-riwlo0h0qg] { padding: 0.75rem; }
    .crud-header[b-riwlo0h0qg] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-riwlo0h0qg] { display: none; }
    .pp-filter-bar[b-riwlo0h0qg] { flex-direction: column; align-items: flex-start; }
    .pp-filter-select[b-riwlo0h0qg] { max-width: 100%; width: 100%; }
    .pp-count[b-riwlo0h0qg] { margin-left: 0; }
    .modal-dialog[b-riwlo0h0qg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-riwlo0h0qg] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_profesores.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-mlllarociq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-mlllarociq 0.3s ease-out; }
@keyframes slideUp-b-mlllarociq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-mlllarociq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-mlllarociq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-mlllarociq] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-mlllarociq] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-mlllarociq] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-mlllarociq] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-mlllarociq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-mlllarociq] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-mlllarociq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-mlllarociq] { filter: brightness(1.1); }
.btn-outline[b-mlllarociq] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-mlllarociq] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-mlllarociq] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-mlllarociq] { filter: brightness(1.1); }
.btn-icon[b-mlllarociq] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-mlllarociq] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-mlllarociq] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-mlllarociq] { color: #ef4444; }
.btn-delete:hover[b-mlllarociq] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-mlllarociq] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-mlllarociq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-mlllarociq] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-mlllarociq] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-mlllarociq] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-mlllarociq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-mlllarociq] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-mlllarociq] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-mlllarociq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-mlllarociq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-mlllarociq] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-mlllarociq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-mlllarociq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-mlllarociq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-mlllarociq] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-mlllarociq] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-mlllarociq] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-mlllarociq] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-mlllarociq] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-mlllarociq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-mlllarociq] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-mlllarociq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-mlllarociq] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-mlllarociq] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-mlllarociq] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-mlllarociq] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-mlllarociq] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-mlllarociq] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-mlllarociq] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-mlllarociq] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-mlllarociq] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-mlllarociq] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-mlllarociq] { display: block; }
.hide-on-cards[b-mlllarociq] { display: none !important; }
.show-on-cards[b-mlllarociq] { display: grid; }
.hide-on-grid[b-mlllarociq] { display: none !important; }

/* Badges */
.badge[b-mlllarociq] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-mlllarociq] { background: #ecfdf5; color: #065f46; }
.badge-no[b-mlllarociq] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-mlllarociq] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-mlllarociq] { text-align: center; }
.text-muted[b-mlllarociq] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-mlllarociq], .crud-empty-state[b-mlllarociq] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-mlllarociq] { font-size: 2rem; }
.crud-spinner[b-mlllarociq] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-mlllarociq 0.6s linear infinite; }
.crud-spinner-sm[b-mlllarociq] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-mlllarociq 0.6s linear infinite; }
@keyframes spin-b-mlllarociq { to { transform: rotate(360deg); } }
.spin[b-mlllarociq] { animation: spin-b-mlllarociq 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-mlllarociq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-mlllarociq 0.15s ease-out; }
.modal-container[b-mlllarociq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-mlllarociq] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-mlllarociq 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-mlllarociq] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-mlllarociq] { max-width: 420px; }
@keyframes fadeIn-b-mlllarociq { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-mlllarociq { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-mlllarociq] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-mlllarociq] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-mlllarociq] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-mlllarociq] { color: #dc2626; }
.modal-close[b-mlllarociq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-mlllarociq] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-mlllarociq] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-mlllarociq] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-mlllarociq] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-mlllarociq] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-mlllarociq] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-mlllarociq] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-mlllarociq] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-mlllarociq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-mlllarociq] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-mlllarociq] { flex: 2; }
.form-group label[b-mlllarociq] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-mlllarociq], .form-group select[b-mlllarociq], .form-textarea[b-mlllarociq] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-mlllarociq], .form-group select:focus[b-mlllarociq], .form-textarea:focus[b-mlllarociq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-mlllarociq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-mlllarociq] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-mlllarociq] { flex: 1; display: flex; align-items: center; }
.form-check[b-mlllarociq] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-mlllarociq] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-mlllarociq] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-mlllarociq] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-mlllarociq] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-mlllarociq] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-mlllarociq] { font-size: 3rem; }
.photo-placeholder span[b-mlllarociq] { font-size: 0.78rem; }
.photo-actions[b-mlllarociq] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-mlllarociq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-mlllarociq] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-mlllarociq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-mlllarociq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-mlllarociq] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-mlllarociq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-mlllarociq] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-mlllarociq] { filter: brightness(1.15); transform: scale(1.05); }
[b-mlllarociq] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-mlllarociq] { padding: 0.75rem; }
    .crud-header[b-mlllarociq] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-mlllarociq] { font-size: 1.1rem; }
    .btn-text[b-mlllarociq] { display: none; }
    .form-row[b-mlllarociq] { flex-direction: column; }
    .form-row-4[b-mlllarociq] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-mlllarociq] { width: 98%; max-height: 95vh; }
    .modal-lg[b-mlllarociq] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-mlllarociq] { padding: 0.75rem; }
    .modal-tabs[b-mlllarociq] { overflow-x: auto; }
    .modal-tab[b-mlllarociq] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-mlllarociq] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-mlllarociq] { display: grid !important; }
    .crud-cards-wrapper[b-mlllarociq] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-mlllarociq] { grid-template-columns: 1fr; }
    .card-details[b-mlllarociq] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-mlllarociq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-mlllarociq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-mlllarociq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-mlllarociq] { background:rgba(37,99,235,.25); }

/* ── Layout single-page ────────────────────────────────────────────── */
.param-card[b-mlllarociq] {
    background: var(--rg-bg-card,#fff);
    border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}

.param-band[b-mlllarociq] {
    display: flex; gap: 1rem;
    padding: .85rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-wrap: wrap;
}
.param-band-item[b-mlllarociq] { display: flex; flex-direction: column; gap: .15rem; min-width: 110px; }
.param-band-label[b-mlllarociq] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.param-band-value[b-mlllarociq] { font-size: .9rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }

/* Período activo editable — se ve como texto pero acepta cambios */
.param-band-periodo[b-mlllarociq] { min-width: 140px; }
.param-band-input[b-mlllarociq] {
    font-size: .95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: transparent;
    border: 1px solid transparent;
    border-radius: .4rem;
    padding: .15rem .35rem;
    margin-left: -.35rem;
    width: 100%;
    max-width: 130px;
    outline: none;
    cursor: text;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.param-band-input:hover[b-mlllarociq] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
}
.param-band-input:focus[b-mlllarociq] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

.param-section[b-mlllarociq] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.param-section:last-child[b-mlllarociq] { border-bottom: none; }
.param-section-title[b-mlllarociq] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
}
.param-section-title i[b-mlllarociq] { color: var(--rg-accent, #2563eb); font-size: 1rem; }

.param-audit[b-mlllarociq] { background: var(--rg-bg-subtle, #f8fafc); }
.param-audit .form-group input[readonly][b-mlllarociq] {
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #64748b);
    cursor: default;
}

.form-row-1[b-mlllarociq] { display: grid; grid-template-columns: 1fr; gap: .75rem; margin-bottom: .5rem; }
.form-row-2[b-mlllarociq] { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: .5rem; }
.form-row-3[b-mlllarociq] { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-bottom: .5rem; }

.check-label[b-mlllarociq] {
    display: flex !important; align-items: center; gap: .5rem;
    font-size: .82rem !important; font-weight: 500 !important;
    color: var(--rg-text-primary, #1e293b) !important;
    text-transform: none !important; letter-spacing: 0 !important;
    cursor: pointer;
    padding: .45rem .65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    background: var(--rg-bg-card, #fff);
}
.check-label input[type="checkbox"][b-mlllarociq] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-accent, #2563eb); margin: 0; }

/* ── Contenido del modal de ayuda ──────────────────────────────────── */
.help-icon-header[b-mlllarociq] { color: var(--rg-accent,#2563eb); margin-right: .25rem; }
.help-body[b-mlllarociq] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-mlllarociq] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-mlllarociq] { border-bottom: none; }
.help-section p[b-mlllarociq] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .4rem; }
.help-section ul[b-mlllarociq], .help-section ol[b-mlllarociq] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-mlllarociq] { font-size: .85rem; color: var(--rg-text-secondary,#475569); margin-bottom: .2rem; }
.help-section-title[b-mlllarociq] { display: flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: .65rem; }
.help-section-title i[b-mlllarociq] { color: var(--rg-accent,#2563eb); }
.help-tip[b-mlllarociq] { display: flex; gap: .6rem; align-items: flex-start; background: rgba(37,99,235,.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 .4rem .4rem 0; padding: .65rem .8rem; margin-top: .5rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-mlllarociq] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: .05rem; }
[data-mode="dark"] .help-tip[b-mlllarociq] { background: rgba(37,99,235,.12); }

@media (max-width: 768px) {
    .form-row-2[b-mlllarociq], .form-row-3[b-mlllarociq], .form-row-4[b-mlllarociq] { grid-template-columns: 1fr; }
    .param-band[b-mlllarociq] { flex-direction: column; gap: .5rem; }
}

/* ── Específicos de Frmano_lectivo ─────────────────────────────────── */
.periodo-icon-sm[b-mlllarociq] {
    width: 32px; height: 32px; border-radius: 8px;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem;
}
[data-mode="dark"] .periodo-icon-sm[b-mlllarociq] { background: rgba(37,99,235,.18); }

/* Tabs */
.sf-tabs-main[b-mlllarociq] {
    display: flex; gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1rem;
}
.sf-tab-main[b-mlllarociq] {
    background: none; border: none;
    padding: .55rem 1rem;
    font-size: .8rem; font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    display: flex; align-items: center; gap: .4rem;
}
.sf-tab-main:hover[b-mlllarociq] { color: var(--rg-text-primary, #1e293b); }
.sf-tab-main.active[b-mlllarociq] {
    color: var(--rg-accent, #2563eb);
    border-bottom-color: var(--rg-accent, #2563eb);
}

/* Sección dentro del modal */
.form-section-title[b-mlllarociq] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .82rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    text-transform: uppercase; letter-spacing: .03em;
    margin-bottom: .85rem;
    padding-bottom: .4rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
}
.form-section-title i[b-mlllarociq] { color: var(--rg-accent, #2563eb); }

.form-hint[b-mlllarociq] {
    font-size: .78rem;
    color: var(--rg-text-secondary, #64748b);
    margin-bottom: .75rem;
    padding: .55rem .75rem;
    background: rgba(37,99,235,.05);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
}
[data-mode="dark"] .form-hint[b-mlllarociq] { background: rgba(37,99,235,.1); }

/* Filas form-row-4 */
.form-row-4[b-mlllarociq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin-bottom: .5rem; }

/* Botón danger */
.btn-danger[b-mlllarociq] {
    background: var(--rg-danger, #dc2626) !important;
    color: #fff !important;
    border-color: var(--rg-danger, #dc2626) !important;
}
.btn-danger:hover:not(:disabled)[b-mlllarociq] { filter: brightness(1.1); }

.text-muted[b-mlllarociq] { color: var(--rg-text-muted, #94a3b8); font-size: .78rem; }

/* ── Switch toggle estilo iOS ──────────────────────────────────────── */
.switch-card[b-mlllarociq] {
    display: flex; align-items: center; gap: .65rem;
    padding: .65rem .85rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    user-select: none;
}
.switch-card:hover[b-mlllarociq] {
    border-color: var(--rg-accent, #2563eb);
    background: var(--rg-bg-hover, #f8fafc);
}
.switch-card input[type="checkbox"][b-mlllarociq] {
    position: absolute;
    opacity: 0;
    width: 0; height: 0;
}
.switch-slider[b-mlllarociq] {
    position: relative;
    width: 38px; height: 22px;
    background: var(--rg-border, #cbd5e1);
    border-radius: 999px;
    flex-shrink: 0;
    transition: background .2s;
}
.switch-slider[b-mlllarociq]::before {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-mlllarociq] {
    background: var(--rg-accent, #2563eb);
}
.switch-card input[type="checkbox"]:checked ~ .switch-slider[b-mlllarociq]::before {
    transform: translateX(16px);
}
.switch-text[b-mlllarociq] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    flex: 1;
}

/* Grid responsive para los switches */
.switch-grid[b-mlllarociq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .55rem;
    margin-bottom: .5rem;
}

[data-mode="dark"] .switch-slider[b-mlllarociq] { background: #475569; }
[data-mode="dark"] .switch-card:hover[b-mlllarociq] { background: rgba(37,99,235,.08); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_record_estudiantes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0hscf0astg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0hscf0astg 0.3s ease-out; }
@keyframes slideUp-b-0hscf0astg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0hscf0astg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0hscf0astg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0hscf0astg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0hscf0astg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0hscf0astg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0hscf0astg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0hscf0astg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0hscf0astg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0hscf0astg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0hscf0astg] { filter: brightness(1.1); }
.btn-outline[b-0hscf0astg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0hscf0astg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0hscf0astg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0hscf0astg] { filter: brightness(1.1); }
.btn-icon[b-0hscf0astg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0hscf0astg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0hscf0astg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0hscf0astg] { color: #ef4444; }
.btn-delete:hover[b-0hscf0astg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0hscf0astg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0hscf0astg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0hscf0astg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0hscf0astg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0hscf0astg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0hscf0astg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0hscf0astg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0hscf0astg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0hscf0astg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0hscf0astg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0hscf0astg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0hscf0astg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0hscf0astg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0hscf0astg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0hscf0astg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0hscf0astg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0hscf0astg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0hscf0astg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0hscf0astg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0hscf0astg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0hscf0astg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0hscf0astg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0hscf0astg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0hscf0astg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0hscf0astg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0hscf0astg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0hscf0astg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0hscf0astg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0hscf0astg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0hscf0astg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0hscf0astg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0hscf0astg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0hscf0astg] { display: block; }
.hide-on-cards[b-0hscf0astg] { display: none !important; }
.show-on-cards[b-0hscf0astg] { display: grid; }
.hide-on-grid[b-0hscf0astg] { display: none !important; }

/* Badges */
.badge[b-0hscf0astg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0hscf0astg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0hscf0astg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0hscf0astg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0hscf0astg] { text-align: center; }
.text-muted[b-0hscf0astg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0hscf0astg], .crud-empty-state[b-0hscf0astg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0hscf0astg] { font-size: 2rem; }
.crud-spinner[b-0hscf0astg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0hscf0astg 0.6s linear infinite; }
.crud-spinner-sm[b-0hscf0astg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0hscf0astg 0.6s linear infinite; }
@keyframes spin-b-0hscf0astg { to { transform: rotate(360deg); } }
.spin[b-0hscf0astg] { animation: spin-b-0hscf0astg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0hscf0astg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0hscf0astg 0.15s ease-out; }
.modal-container[b-0hscf0astg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0hscf0astg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0hscf0astg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0hscf0astg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0hscf0astg] { max-width: 420px; }
@keyframes fadeIn-b-0hscf0astg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0hscf0astg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0hscf0astg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0hscf0astg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0hscf0astg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0hscf0astg] { color: #dc2626; }
.modal-close[b-0hscf0astg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0hscf0astg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0hscf0astg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0hscf0astg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0hscf0astg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0hscf0astg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0hscf0astg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0hscf0astg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0hscf0astg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0hscf0astg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0hscf0astg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0hscf0astg] { flex: 2; }
.form-group label[b-0hscf0astg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0hscf0astg], .form-group select[b-0hscf0astg], .form-textarea[b-0hscf0astg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0hscf0astg], .form-group select:focus[b-0hscf0astg], .form-textarea:focus[b-0hscf0astg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0hscf0astg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0hscf0astg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0hscf0astg] { flex: 1; display: flex; align-items: center; }
.form-check[b-0hscf0astg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0hscf0astg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0hscf0astg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0hscf0astg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0hscf0astg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0hscf0astg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0hscf0astg] { font-size: 3rem; }
.photo-placeholder span[b-0hscf0astg] { font-size: 0.78rem; }
.photo-actions[b-0hscf0astg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0hscf0astg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0hscf0astg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0hscf0astg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0hscf0astg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0hscf0astg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0hscf0astg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0hscf0astg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0hscf0astg] { filter: brightness(1.15); transform: scale(1.05); }
[b-0hscf0astg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0hscf0astg] { padding: 0.75rem; }
    .crud-header[b-0hscf0astg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0hscf0astg] { font-size: 1.1rem; }
    .btn-text[b-0hscf0astg] { display: none; }
    .form-row[b-0hscf0astg] { flex-direction: column; }
    .form-row-4[b-0hscf0astg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0hscf0astg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0hscf0astg] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0hscf0astg] { padding: 0.75rem; }
    .modal-tabs[b-0hscf0astg] { overflow-x: auto; }
    .modal-tab[b-0hscf0astg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0hscf0astg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0hscf0astg] { display: grid !important; }
    .crud-cards-wrapper[b-0hscf0astg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0hscf0astg] { grid-template-columns: 1fr; }
    .card-details[b-0hscf0astg] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0hscf0astg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0hscf0astg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0hscf0astg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0hscf0astg] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmclg_registro_escolar.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-nmd30yl5e9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-nmd30yl5e9 0.3s ease-out; }
@keyframes slideUp-b-nmd30yl5e9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-nmd30yl5e9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-nmd30yl5e9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-nmd30yl5e9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-nmd30yl5e9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-nmd30yl5e9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-nmd30yl5e9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-nmd30yl5e9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-nmd30yl5e9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-nmd30yl5e9] { filter: brightness(1.1); }
.btn-outline[b-nmd30yl5e9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-nmd30yl5e9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-nmd30yl5e9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-nmd30yl5e9] { filter: brightness(1.1); }
.btn-icon[b-nmd30yl5e9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-nmd30yl5e9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-nmd30yl5e9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-nmd30yl5e9] { color: #ef4444; }
.btn-delete:hover[b-nmd30yl5e9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-nmd30yl5e9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-nmd30yl5e9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-nmd30yl5e9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-nmd30yl5e9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-nmd30yl5e9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-nmd30yl5e9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-nmd30yl5e9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-nmd30yl5e9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-nmd30yl5e9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-nmd30yl5e9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-nmd30yl5e9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-nmd30yl5e9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-nmd30yl5e9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-nmd30yl5e9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-nmd30yl5e9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-nmd30yl5e9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-nmd30yl5e9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-nmd30yl5e9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-nmd30yl5e9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-nmd30yl5e9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-nmd30yl5e9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-nmd30yl5e9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-nmd30yl5e9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-nmd30yl5e9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-nmd30yl5e9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-nmd30yl5e9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-nmd30yl5e9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-nmd30yl5e9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-nmd30yl5e9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-nmd30yl5e9] { display: block; }
.hide-on-cards[b-nmd30yl5e9] { display: none !important; }
.show-on-cards[b-nmd30yl5e9] { display: grid; }
.hide-on-grid[b-nmd30yl5e9] { display: none !important; }

/* Badges */
.badge[b-nmd30yl5e9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-nmd30yl5e9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-nmd30yl5e9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-nmd30yl5e9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-nmd30yl5e9] { text-align: center; }
.text-muted[b-nmd30yl5e9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-nmd30yl5e9], .crud-empty-state[b-nmd30yl5e9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-nmd30yl5e9] { font-size: 2rem; }
.crud-spinner[b-nmd30yl5e9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-nmd30yl5e9 0.6s linear infinite; }
.crud-spinner-sm[b-nmd30yl5e9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-nmd30yl5e9 0.6s linear infinite; }
@keyframes spin-b-nmd30yl5e9 { to { transform: rotate(360deg); } }
.spin[b-nmd30yl5e9] { animation: spin-b-nmd30yl5e9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-nmd30yl5e9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-nmd30yl5e9 0.15s ease-out; }
.modal-container[b-nmd30yl5e9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-nmd30yl5e9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-nmd30yl5e9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-nmd30yl5e9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-nmd30yl5e9] { max-width: 420px; }
@keyframes fadeIn-b-nmd30yl5e9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-nmd30yl5e9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-nmd30yl5e9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-nmd30yl5e9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-nmd30yl5e9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-nmd30yl5e9] { color: #dc2626; }
.modal-close[b-nmd30yl5e9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-nmd30yl5e9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-nmd30yl5e9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-nmd30yl5e9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-nmd30yl5e9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-nmd30yl5e9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-nmd30yl5e9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-nmd30yl5e9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-nmd30yl5e9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-nmd30yl5e9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-nmd30yl5e9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-nmd30yl5e9] { flex: 2; }
.form-group label[b-nmd30yl5e9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-nmd30yl5e9], .form-group select[b-nmd30yl5e9], .form-textarea[b-nmd30yl5e9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-nmd30yl5e9], .form-group select:focus[b-nmd30yl5e9], .form-textarea:focus[b-nmd30yl5e9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-nmd30yl5e9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-nmd30yl5e9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-nmd30yl5e9] { flex: 1; display: flex; align-items: center; }
.form-check[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-nmd30yl5e9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-nmd30yl5e9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-nmd30yl5e9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-nmd30yl5e9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-nmd30yl5e9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-nmd30yl5e9] { font-size: 3rem; }
.photo-placeholder span[b-nmd30yl5e9] { font-size: 0.78rem; }
.photo-actions[b-nmd30yl5e9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-nmd30yl5e9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-nmd30yl5e9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-nmd30yl5e9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-nmd30yl5e9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-nmd30yl5e9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-nmd30yl5e9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-nmd30yl5e9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-nmd30yl5e9] { filter: brightness(1.15); transform: scale(1.05); }
[b-nmd30yl5e9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-nmd30yl5e9] { padding: 0.75rem; }
    .crud-header[b-nmd30yl5e9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-nmd30yl5e9] { font-size: 1.1rem; }
    .btn-text[b-nmd30yl5e9] { display: none; }
    .form-row[b-nmd30yl5e9] { flex-direction: column; }
    .form-row-4[b-nmd30yl5e9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-nmd30yl5e9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-nmd30yl5e9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-nmd30yl5e9] { padding: 0.75rem; }
    .modal-tabs[b-nmd30yl5e9] { overflow-x: auto; }
    .modal-tab[b-nmd30yl5e9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-nmd30yl5e9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-nmd30yl5e9] { display: grid !important; }
    .crud-cards-wrapper[b-nmd30yl5e9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-nmd30yl5e9] { grid-template-columns: 1fr; }
    .card-details[b-nmd30yl5e9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-nmd30yl5e9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-nmd30yl5e9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-nmd30yl5e9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-nmd30yl5e9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmcobromos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-q9t30r6i33] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-q9t30r6i33 0.3s ease-out; }
@keyframes slideUp-b-q9t30r6i33 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-q9t30r6i33] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-q9t30r6i33] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-q9t30r6i33] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-q9t30r6i33] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-q9t30r6i33] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-q9t30r6i33] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-q9t30r6i33] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-q9t30r6i33] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-q9t30r6i33] { filter: brightness(1.1); }
.btn-outline[b-q9t30r6i33] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-q9t30r6i33] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-q9t30r6i33] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-q9t30r6i33] { filter: brightness(1.1); }
.btn-icon[b-q9t30r6i33] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-q9t30r6i33] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-q9t30r6i33] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-q9t30r6i33] { color: #ef4444; }
.btn-delete:hover[b-q9t30r6i33] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-q9t30r6i33] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-q9t30r6i33] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-q9t30r6i33] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-q9t30r6i33] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-q9t30r6i33] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-q9t30r6i33] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-q9t30r6i33] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-q9t30r6i33] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-q9t30r6i33] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-q9t30r6i33] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-q9t30r6i33] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-q9t30r6i33] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-q9t30r6i33] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-q9t30r6i33] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-q9t30r6i33] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-q9t30r6i33] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-q9t30r6i33] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-q9t30r6i33] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-q9t30r6i33] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-q9t30r6i33] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-q9t30r6i33] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-q9t30r6i33] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-q9t30r6i33] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-q9t30r6i33] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-q9t30r6i33] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-q9t30r6i33] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-q9t30r6i33] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-q9t30r6i33] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-q9t30r6i33] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-q9t30r6i33] { display: block; }
.hide-on-cards[b-q9t30r6i33] { display: none !important; }
.show-on-cards[b-q9t30r6i33] { display: grid; }
.hide-on-grid[b-q9t30r6i33] { display: none !important; }

/* Badges */
.badge[b-q9t30r6i33] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-q9t30r6i33] { background: #ecfdf5; color: #065f46; }
.badge-no[b-q9t30r6i33] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-q9t30r6i33] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-q9t30r6i33] { text-align: center; }
.text-muted[b-q9t30r6i33] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-q9t30r6i33], .crud-empty-state[b-q9t30r6i33] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-q9t30r6i33] { font-size: 2rem; }
.crud-spinner[b-q9t30r6i33] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-q9t30r6i33 0.6s linear infinite; }
.crud-spinner-sm[b-q9t30r6i33] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-q9t30r6i33 0.6s linear infinite; }
@keyframes spin-b-q9t30r6i33 { to { transform: rotate(360deg); } }
.spin[b-q9t30r6i33] { animation: spin-b-q9t30r6i33 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-q9t30r6i33] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-q9t30r6i33 0.15s ease-out; }
.modal-container[b-q9t30r6i33] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-q9t30r6i33] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-q9t30r6i33 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-q9t30r6i33] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-q9t30r6i33] { max-width: 420px; }
@keyframes fadeIn-b-q9t30r6i33 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-q9t30r6i33 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-q9t30r6i33] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-q9t30r6i33] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-q9t30r6i33] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-q9t30r6i33] { color: #dc2626; }
.modal-close[b-q9t30r6i33] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-q9t30r6i33] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-q9t30r6i33] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-q9t30r6i33] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-q9t30r6i33] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-q9t30r6i33] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-q9t30r6i33] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-q9t30r6i33] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-q9t30r6i33] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-q9t30r6i33] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-q9t30r6i33] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-q9t30r6i33] { flex: 2; }
.form-group label[b-q9t30r6i33] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-q9t30r6i33], .form-group select[b-q9t30r6i33], .form-textarea[b-q9t30r6i33] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-q9t30r6i33], .form-group select:focus[b-q9t30r6i33], .form-textarea:focus[b-q9t30r6i33] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-q9t30r6i33] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-q9t30r6i33] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-q9t30r6i33] { flex: 1; display: flex; align-items: center; }
.form-check[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-q9t30r6i33] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-q9t30r6i33] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-q9t30r6i33] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-q9t30r6i33] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-q9t30r6i33] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-q9t30r6i33] { font-size: 3rem; }
.photo-placeholder span[b-q9t30r6i33] { font-size: 0.78rem; }
.photo-actions[b-q9t30r6i33] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-q9t30r6i33] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-q9t30r6i33] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-q9t30r6i33] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-q9t30r6i33] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-q9t30r6i33] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-q9t30r6i33] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-q9t30r6i33] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-q9t30r6i33] { filter: brightness(1.15); transform: scale(1.05); }
[b-q9t30r6i33] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-q9t30r6i33] { padding: 0.75rem; }
    .crud-header[b-q9t30r6i33] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-q9t30r6i33] { font-size: 1.1rem; }
    .btn-text[b-q9t30r6i33] { display: none; }
    .form-row[b-q9t30r6i33] { flex-direction: column; }
    .form-row-4[b-q9t30r6i33] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-q9t30r6i33] { width: 98%; max-height: 95vh; }
    .modal-lg[b-q9t30r6i33] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-q9t30r6i33] { padding: 0.75rem; }
    .modal-tabs[b-q9t30r6i33] { overflow-x: auto; }
    .modal-tab[b-q9t30r6i33] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-q9t30r6i33] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-q9t30r6i33] { display: grid !important; }
    .crud-cards-wrapper[b-q9t30r6i33] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-q9t30r6i33] { grid-template-columns: 1fr; }
    .card-details[b-q9t30r6i33] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-q9t30r6i33] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-q9t30r6i33] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-q9t30r6i33] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-q9t30r6i33] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmhgimpresionnota.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-p2z77c6n63] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-p2z77c6n63 0.3s ease-out; }
@keyframes slideUp-b-p2z77c6n63 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-p2z77c6n63] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-p2z77c6n63] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-p2z77c6n63] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-p2z77c6n63] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-p2z77c6n63] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-p2z77c6n63] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-p2z77c6n63] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-p2z77c6n63] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-p2z77c6n63] { filter: brightness(1.1); }
.btn-outline[b-p2z77c6n63] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-p2z77c6n63] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-p2z77c6n63] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-p2z77c6n63] { filter: brightness(1.1); }
.btn-icon[b-p2z77c6n63] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-p2z77c6n63] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-p2z77c6n63] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-p2z77c6n63] { color: #ef4444; }
.btn-delete:hover[b-p2z77c6n63] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-p2z77c6n63] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-p2z77c6n63] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-p2z77c6n63] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-p2z77c6n63] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-p2z77c6n63] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-p2z77c6n63] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-p2z77c6n63] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-p2z77c6n63] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-p2z77c6n63] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-p2z77c6n63] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-p2z77c6n63] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-p2z77c6n63] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-p2z77c6n63] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-p2z77c6n63] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-p2z77c6n63] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-p2z77c6n63] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-p2z77c6n63] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-p2z77c6n63] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-p2z77c6n63] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-p2z77c6n63] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-p2z77c6n63] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-p2z77c6n63] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-p2z77c6n63] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-p2z77c6n63] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-p2z77c6n63] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-p2z77c6n63] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-p2z77c6n63] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-p2z77c6n63] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-p2z77c6n63] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-p2z77c6n63] { display: block; }
.hide-on-cards[b-p2z77c6n63] { display: none !important; }
.show-on-cards[b-p2z77c6n63] { display: grid; }
.hide-on-grid[b-p2z77c6n63] { display: none !important; }

/* Badges */
.badge[b-p2z77c6n63] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-p2z77c6n63] { background: #ecfdf5; color: #065f46; }
.badge-no[b-p2z77c6n63] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-p2z77c6n63] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-p2z77c6n63] { text-align: center; }
.text-muted[b-p2z77c6n63] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-p2z77c6n63], .crud-empty-state[b-p2z77c6n63] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-p2z77c6n63] { font-size: 2rem; }
.crud-spinner[b-p2z77c6n63] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-p2z77c6n63 0.6s linear infinite; }
.crud-spinner-sm[b-p2z77c6n63] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-p2z77c6n63 0.6s linear infinite; }
@keyframes spin-b-p2z77c6n63 { to { transform: rotate(360deg); } }
.spin[b-p2z77c6n63] { animation: spin-b-p2z77c6n63 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-p2z77c6n63] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-p2z77c6n63 0.15s ease-out; }
.modal-container[b-p2z77c6n63] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-p2z77c6n63] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-p2z77c6n63 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-p2z77c6n63] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-p2z77c6n63] { max-width: 420px; }
@keyframes fadeIn-b-p2z77c6n63 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-p2z77c6n63 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-p2z77c6n63] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-p2z77c6n63] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-p2z77c6n63] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-p2z77c6n63] { color: #dc2626; }
.modal-close[b-p2z77c6n63] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-p2z77c6n63] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-p2z77c6n63] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-p2z77c6n63] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-p2z77c6n63] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-p2z77c6n63] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-p2z77c6n63] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-p2z77c6n63] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-p2z77c6n63] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-p2z77c6n63] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-p2z77c6n63] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-p2z77c6n63] { flex: 2; }
.form-group label[b-p2z77c6n63] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-p2z77c6n63], .form-group select[b-p2z77c6n63], .form-textarea[b-p2z77c6n63] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-p2z77c6n63], .form-group select:focus[b-p2z77c6n63], .form-textarea:focus[b-p2z77c6n63] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-p2z77c6n63] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-p2z77c6n63] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-p2z77c6n63] { flex: 1; display: flex; align-items: center; }
.form-check[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-p2z77c6n63] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-p2z77c6n63] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-p2z77c6n63] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-p2z77c6n63] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-p2z77c6n63] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-p2z77c6n63] { font-size: 3rem; }
.photo-placeholder span[b-p2z77c6n63] { font-size: 0.78rem; }
.photo-actions[b-p2z77c6n63] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-p2z77c6n63] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-p2z77c6n63] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-p2z77c6n63] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-p2z77c6n63] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-p2z77c6n63] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-p2z77c6n63] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-p2z77c6n63] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-p2z77c6n63] { filter: brightness(1.15); transform: scale(1.05); }
[b-p2z77c6n63] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-p2z77c6n63] { padding: 0.75rem; }
    .crud-header[b-p2z77c6n63] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-p2z77c6n63] { font-size: 1.1rem; }
    .btn-text[b-p2z77c6n63] { display: none; }
    .form-row[b-p2z77c6n63] { flex-direction: column; }
    .form-row-4[b-p2z77c6n63] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-p2z77c6n63] { width: 98%; max-height: 95vh; }
    .modal-lg[b-p2z77c6n63] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-p2z77c6n63] { padding: 0.75rem; }
    .modal-tabs[b-p2z77c6n63] { overflow-x: auto; }
    .modal-tab[b-p2z77c6n63] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-p2z77c6n63] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-p2z77c6n63] { display: grid !important; }
    .crud-cards-wrapper[b-p2z77c6n63] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-p2z77c6n63] { grid-template-columns: 1fr; }
    .card-details[b-p2z77c6n63] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-p2z77c6n63] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-p2z77c6n63] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-p2z77c6n63] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-p2z77c6n63] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmhg_clasificacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yqvww2obcu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yqvww2obcu 0.3s ease-out; }
@keyframes slideUp-b-yqvww2obcu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yqvww2obcu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yqvww2obcu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yqvww2obcu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yqvww2obcu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yqvww2obcu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yqvww2obcu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yqvww2obcu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yqvww2obcu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yqvww2obcu] { filter: brightness(1.1); }
.btn-outline[b-yqvww2obcu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yqvww2obcu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yqvww2obcu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yqvww2obcu] { filter: brightness(1.1); }
.btn-icon[b-yqvww2obcu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yqvww2obcu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yqvww2obcu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yqvww2obcu] { color: #ef4444; }
.btn-delete:hover[b-yqvww2obcu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yqvww2obcu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yqvww2obcu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yqvww2obcu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yqvww2obcu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yqvww2obcu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yqvww2obcu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yqvww2obcu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yqvww2obcu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yqvww2obcu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yqvww2obcu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yqvww2obcu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yqvww2obcu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yqvww2obcu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yqvww2obcu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yqvww2obcu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yqvww2obcu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yqvww2obcu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yqvww2obcu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yqvww2obcu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yqvww2obcu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yqvww2obcu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yqvww2obcu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yqvww2obcu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yqvww2obcu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yqvww2obcu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yqvww2obcu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yqvww2obcu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yqvww2obcu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yqvww2obcu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yqvww2obcu] { display: block; }
.hide-on-cards[b-yqvww2obcu] { display: none !important; }
.show-on-cards[b-yqvww2obcu] { display: grid; }
.hide-on-grid[b-yqvww2obcu] { display: none !important; }

/* Badges */
.badge[b-yqvww2obcu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yqvww2obcu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yqvww2obcu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yqvww2obcu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yqvww2obcu] { text-align: center; }
.text-muted[b-yqvww2obcu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yqvww2obcu], .crud-empty-state[b-yqvww2obcu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yqvww2obcu] { font-size: 2rem; }
.crud-spinner[b-yqvww2obcu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yqvww2obcu 0.6s linear infinite; }
.crud-spinner-sm[b-yqvww2obcu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yqvww2obcu 0.6s linear infinite; }
@keyframes spin-b-yqvww2obcu { to { transform: rotate(360deg); } }
.spin[b-yqvww2obcu] { animation: spin-b-yqvww2obcu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yqvww2obcu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yqvww2obcu 0.15s ease-out; }
.modal-container[b-yqvww2obcu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yqvww2obcu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yqvww2obcu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yqvww2obcu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yqvww2obcu] { max-width: 420px; }
@keyframes fadeIn-b-yqvww2obcu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yqvww2obcu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yqvww2obcu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yqvww2obcu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yqvww2obcu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yqvww2obcu] { color: #dc2626; }
.modal-close[b-yqvww2obcu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yqvww2obcu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yqvww2obcu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yqvww2obcu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yqvww2obcu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yqvww2obcu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yqvww2obcu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yqvww2obcu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yqvww2obcu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yqvww2obcu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yqvww2obcu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yqvww2obcu] { flex: 2; }
.form-group label[b-yqvww2obcu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yqvww2obcu], .form-group select[b-yqvww2obcu], .form-textarea[b-yqvww2obcu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yqvww2obcu], .form-group select:focus[b-yqvww2obcu], .form-textarea:focus[b-yqvww2obcu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yqvww2obcu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yqvww2obcu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yqvww2obcu] { flex: 1; display: flex; align-items: center; }
.form-check[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yqvww2obcu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yqvww2obcu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yqvww2obcu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yqvww2obcu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yqvww2obcu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yqvww2obcu] { font-size: 3rem; }
.photo-placeholder span[b-yqvww2obcu] { font-size: 0.78rem; }
.photo-actions[b-yqvww2obcu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yqvww2obcu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yqvww2obcu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yqvww2obcu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yqvww2obcu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yqvww2obcu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yqvww2obcu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yqvww2obcu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yqvww2obcu] { filter: brightness(1.15); transform: scale(1.05); }
[b-yqvww2obcu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yqvww2obcu] { padding: 0.75rem; }
    .crud-header[b-yqvww2obcu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yqvww2obcu] { font-size: 1.1rem; }
    .btn-text[b-yqvww2obcu] { display: none; }
    .form-row[b-yqvww2obcu] { flex-direction: column; }
    .form-row-4[b-yqvww2obcu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yqvww2obcu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yqvww2obcu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yqvww2obcu] { padding: 0.75rem; }
    .modal-tabs[b-yqvww2obcu] { overflow-x: auto; }
    .modal-tab[b-yqvww2obcu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yqvww2obcu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yqvww2obcu] { display: grid !important; }
    .crud-cards-wrapper[b-yqvww2obcu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yqvww2obcu] { grid-template-columns: 1fr; }
    .card-details[b-yqvww2obcu] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yqvww2obcu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yqvww2obcu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yqvww2obcu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yqvww2obcu] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmhg_fichaalumnos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-smobn7uxvy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-smobn7uxvy 0.3s ease-out; }
@keyframes slideUp-b-smobn7uxvy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-smobn7uxvy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-smobn7uxvy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-smobn7uxvy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-smobn7uxvy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-smobn7uxvy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-smobn7uxvy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-smobn7uxvy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-smobn7uxvy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-smobn7uxvy] { filter: brightness(1.1); }
.btn-outline[b-smobn7uxvy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-smobn7uxvy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-smobn7uxvy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-smobn7uxvy] { filter: brightness(1.1); }
.btn-icon[b-smobn7uxvy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-smobn7uxvy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-smobn7uxvy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-smobn7uxvy] { color: #ef4444; }
.btn-delete:hover[b-smobn7uxvy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-smobn7uxvy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-smobn7uxvy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-smobn7uxvy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-smobn7uxvy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-smobn7uxvy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-smobn7uxvy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-smobn7uxvy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-smobn7uxvy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-smobn7uxvy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-smobn7uxvy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-smobn7uxvy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-smobn7uxvy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-smobn7uxvy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-smobn7uxvy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-smobn7uxvy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-smobn7uxvy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-smobn7uxvy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-smobn7uxvy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-smobn7uxvy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-smobn7uxvy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-smobn7uxvy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-smobn7uxvy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-smobn7uxvy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-smobn7uxvy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-smobn7uxvy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-smobn7uxvy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-smobn7uxvy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-smobn7uxvy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-smobn7uxvy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-smobn7uxvy] { display: block; }
.hide-on-cards[b-smobn7uxvy] { display: none !important; }
.show-on-cards[b-smobn7uxvy] { display: grid; }
.hide-on-grid[b-smobn7uxvy] { display: none !important; }

/* Badges */
.badge[b-smobn7uxvy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-smobn7uxvy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-smobn7uxvy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-smobn7uxvy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-smobn7uxvy] { text-align: center; }
.text-muted[b-smobn7uxvy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-smobn7uxvy], .crud-empty-state[b-smobn7uxvy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-smobn7uxvy] { font-size: 2rem; }
.crud-spinner[b-smobn7uxvy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-smobn7uxvy 0.6s linear infinite; }
.crud-spinner-sm[b-smobn7uxvy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-smobn7uxvy 0.6s linear infinite; }
@keyframes spin-b-smobn7uxvy { to { transform: rotate(360deg); } }
.spin[b-smobn7uxvy] { animation: spin-b-smobn7uxvy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-smobn7uxvy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-smobn7uxvy 0.15s ease-out; }
.modal-container[b-smobn7uxvy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-smobn7uxvy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-smobn7uxvy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-smobn7uxvy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-smobn7uxvy] { max-width: 420px; }
@keyframes fadeIn-b-smobn7uxvy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-smobn7uxvy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-smobn7uxvy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-smobn7uxvy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-smobn7uxvy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-smobn7uxvy] { color: #dc2626; }
.modal-close[b-smobn7uxvy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-smobn7uxvy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-smobn7uxvy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-smobn7uxvy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-smobn7uxvy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-smobn7uxvy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-smobn7uxvy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-smobn7uxvy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-smobn7uxvy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-smobn7uxvy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-smobn7uxvy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-smobn7uxvy] { flex: 2; }
.form-group label[b-smobn7uxvy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-smobn7uxvy], .form-group select[b-smobn7uxvy], .form-textarea[b-smobn7uxvy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-smobn7uxvy], .form-group select:focus[b-smobn7uxvy], .form-textarea:focus[b-smobn7uxvy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-smobn7uxvy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-smobn7uxvy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-smobn7uxvy] { flex: 1; display: flex; align-items: center; }
.form-check[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-smobn7uxvy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-smobn7uxvy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-smobn7uxvy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-smobn7uxvy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-smobn7uxvy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-smobn7uxvy] { font-size: 3rem; }
.photo-placeholder span[b-smobn7uxvy] { font-size: 0.78rem; }
.photo-actions[b-smobn7uxvy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-smobn7uxvy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-smobn7uxvy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-smobn7uxvy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-smobn7uxvy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-smobn7uxvy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-smobn7uxvy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-smobn7uxvy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-smobn7uxvy] { filter: brightness(1.15); transform: scale(1.05); }
[b-smobn7uxvy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-smobn7uxvy] { padding: 0.75rem; }
    .crud-header[b-smobn7uxvy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-smobn7uxvy] { font-size: 1.1rem; }
    .btn-text[b-smobn7uxvy] { display: none; }
    .form-row[b-smobn7uxvy] { flex-direction: column; }
    .form-row-4[b-smobn7uxvy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-smobn7uxvy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-smobn7uxvy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-smobn7uxvy] { padding: 0.75rem; }
    .modal-tabs[b-smobn7uxvy] { overflow-x: auto; }
    .modal-tab[b-smobn7uxvy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-smobn7uxvy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-smobn7uxvy] { display: grid !important; }
    .crud-cards-wrapper[b-smobn7uxvy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-smobn7uxvy] { grid-template-columns: 1fr; }
    .card-details[b-smobn7uxvy] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-smobn7uxvy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-smobn7uxvy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-smobn7uxvy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-smobn7uxvy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmhg_grupos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-r69bicj80m] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-r69bicj80m 0.3s ease-out; }
@keyframes slideUp-b-r69bicj80m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-r69bicj80m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-r69bicj80m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-r69bicj80m] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-r69bicj80m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-r69bicj80m] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-r69bicj80m] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-r69bicj80m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-r69bicj80m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-r69bicj80m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-r69bicj80m] { filter: brightness(1.1); }
.btn-outline[b-r69bicj80m] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-r69bicj80m] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-r69bicj80m] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-r69bicj80m] { filter: brightness(1.1); }
.btn-icon[b-r69bicj80m] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-r69bicj80m] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-r69bicj80m] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-r69bicj80m] { color: #ef4444; }
.btn-delete:hover[b-r69bicj80m] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-r69bicj80m] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-r69bicj80m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-r69bicj80m] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-r69bicj80m] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-r69bicj80m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-r69bicj80m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-r69bicj80m] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-r69bicj80m] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-r69bicj80m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-r69bicj80m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-r69bicj80m] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-r69bicj80m] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-r69bicj80m] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-r69bicj80m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-r69bicj80m] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-r69bicj80m] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-r69bicj80m] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-r69bicj80m] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-r69bicj80m] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-r69bicj80m] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-r69bicj80m] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-r69bicj80m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-r69bicj80m] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-r69bicj80m] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-r69bicj80m] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-r69bicj80m] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-r69bicj80m] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-r69bicj80m] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-r69bicj80m] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-r69bicj80m] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-r69bicj80m] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-r69bicj80m] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-r69bicj80m] { display: block; }
.hide-on-cards[b-r69bicj80m] { display: none !important; }
.show-on-cards[b-r69bicj80m] { display: grid; }
.hide-on-grid[b-r69bicj80m] { display: none !important; }

/* Badges */
.badge[b-r69bicj80m] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-r69bicj80m] { background: #ecfdf5; color: #065f46; }
.badge-no[b-r69bicj80m] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-r69bicj80m] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-r69bicj80m] { text-align: center; }
.text-muted[b-r69bicj80m] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-r69bicj80m], .crud-empty-state[b-r69bicj80m] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-r69bicj80m] { font-size: 2rem; }
.crud-spinner[b-r69bicj80m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-r69bicj80m 0.6s linear infinite; }
.crud-spinner-sm[b-r69bicj80m] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-r69bicj80m 0.6s linear infinite; }
@keyframes spin-b-r69bicj80m { to { transform: rotate(360deg); } }
.spin[b-r69bicj80m] { animation: spin-b-r69bicj80m 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-r69bicj80m] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-r69bicj80m 0.15s ease-out; }
.modal-container[b-r69bicj80m] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-r69bicj80m] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-r69bicj80m 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-r69bicj80m] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-r69bicj80m] { max-width: 420px; }
@keyframes fadeIn-b-r69bicj80m { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-r69bicj80m { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-r69bicj80m] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-r69bicj80m] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-r69bicj80m] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-r69bicj80m] { color: #dc2626; }
.modal-close[b-r69bicj80m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-r69bicj80m] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-r69bicj80m] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-r69bicj80m] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-r69bicj80m] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-r69bicj80m] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-r69bicj80m] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-r69bicj80m] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-r69bicj80m] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-r69bicj80m] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-r69bicj80m] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-r69bicj80m] { flex: 2; }
.form-group label[b-r69bicj80m] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-r69bicj80m], .form-group select[b-r69bicj80m], .form-textarea[b-r69bicj80m] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-r69bicj80m], .form-group select:focus[b-r69bicj80m], .form-textarea:focus[b-r69bicj80m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-r69bicj80m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-r69bicj80m] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-r69bicj80m] { flex: 1; display: flex; align-items: center; }
.form-check[b-r69bicj80m] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-r69bicj80m] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-r69bicj80m] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-r69bicj80m] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-r69bicj80m] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-r69bicj80m] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-r69bicj80m] { font-size: 3rem; }
.photo-placeholder span[b-r69bicj80m] { font-size: 0.78rem; }
.photo-actions[b-r69bicj80m] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-r69bicj80m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-r69bicj80m] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-r69bicj80m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-r69bicj80m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-r69bicj80m] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-r69bicj80m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-r69bicj80m] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-r69bicj80m] { filter: brightness(1.15); transform: scale(1.05); }
[b-r69bicj80m] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-r69bicj80m] { padding: 0.75rem; }
    .crud-header[b-r69bicj80m] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-r69bicj80m] { font-size: 1.1rem; }
    .btn-text[b-r69bicj80m] { display: none; }
    .form-row[b-r69bicj80m] { flex-direction: column; }
    .form-row-4[b-r69bicj80m] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-r69bicj80m] { width: 98%; max-height: 95vh; }
    .modal-lg[b-r69bicj80m] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-r69bicj80m] { padding: 0.75rem; }
    .modal-tabs[b-r69bicj80m] { overflow-x: auto; }
    .modal-tab[b-r69bicj80m] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-r69bicj80m] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-r69bicj80m] { display: grid !important; }
    .crud-cards-wrapper[b-r69bicj80m] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-r69bicj80m] { grid-template-columns: 1fr; }
    .card-details[b-r69bicj80m] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-r69bicj80m] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-r69bicj80m] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-r69bicj80m] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-r69bicj80m] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmhg_reglonesevaluacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qb0h5mwr3l] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qb0h5mwr3l 0.3s ease-out; }
@keyframes slideUp-b-qb0h5mwr3l { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qb0h5mwr3l] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qb0h5mwr3l] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qb0h5mwr3l] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qb0h5mwr3l] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qb0h5mwr3l] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qb0h5mwr3l] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qb0h5mwr3l] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qb0h5mwr3l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qb0h5mwr3l] { filter: brightness(1.1); }
.btn-outline[b-qb0h5mwr3l] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qb0h5mwr3l] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qb0h5mwr3l] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qb0h5mwr3l] { filter: brightness(1.1); }
.btn-icon[b-qb0h5mwr3l] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qb0h5mwr3l] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qb0h5mwr3l] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qb0h5mwr3l] { color: #ef4444; }
.btn-delete:hover[b-qb0h5mwr3l] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qb0h5mwr3l] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qb0h5mwr3l] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qb0h5mwr3l] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qb0h5mwr3l] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qb0h5mwr3l] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qb0h5mwr3l] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qb0h5mwr3l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qb0h5mwr3l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qb0h5mwr3l] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qb0h5mwr3l] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qb0h5mwr3l] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qb0h5mwr3l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qb0h5mwr3l] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qb0h5mwr3l] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qb0h5mwr3l] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qb0h5mwr3l] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qb0h5mwr3l] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qb0h5mwr3l] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qb0h5mwr3l] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qb0h5mwr3l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qb0h5mwr3l] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qb0h5mwr3l] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qb0h5mwr3l] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qb0h5mwr3l] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qb0h5mwr3l] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qb0h5mwr3l] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qb0h5mwr3l] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qb0h5mwr3l] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qb0h5mwr3l] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qb0h5mwr3l] { display: block; }
.hide-on-cards[b-qb0h5mwr3l] { display: none !important; }
.show-on-cards[b-qb0h5mwr3l] { display: grid; }
.hide-on-grid[b-qb0h5mwr3l] { display: none !important; }

/* Badges */
.badge[b-qb0h5mwr3l] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qb0h5mwr3l] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qb0h5mwr3l] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qb0h5mwr3l] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qb0h5mwr3l] { text-align: center; }
.text-muted[b-qb0h5mwr3l] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qb0h5mwr3l], .crud-empty-state[b-qb0h5mwr3l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qb0h5mwr3l] { font-size: 2rem; }
.crud-spinner[b-qb0h5mwr3l] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qb0h5mwr3l 0.6s linear infinite; }
.crud-spinner-sm[b-qb0h5mwr3l] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qb0h5mwr3l 0.6s linear infinite; }
@keyframes spin-b-qb0h5mwr3l { to { transform: rotate(360deg); } }
.spin[b-qb0h5mwr3l] { animation: spin-b-qb0h5mwr3l 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qb0h5mwr3l] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qb0h5mwr3l 0.15s ease-out; }
.modal-container[b-qb0h5mwr3l] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qb0h5mwr3l] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qb0h5mwr3l 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qb0h5mwr3l] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qb0h5mwr3l] { max-width: 420px; }
@keyframes fadeIn-b-qb0h5mwr3l { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qb0h5mwr3l { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qb0h5mwr3l] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qb0h5mwr3l] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qb0h5mwr3l] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qb0h5mwr3l] { color: #dc2626; }
.modal-close[b-qb0h5mwr3l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qb0h5mwr3l] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qb0h5mwr3l] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qb0h5mwr3l] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qb0h5mwr3l] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qb0h5mwr3l] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qb0h5mwr3l] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qb0h5mwr3l] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qb0h5mwr3l] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qb0h5mwr3l] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qb0h5mwr3l] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qb0h5mwr3l] { flex: 2; }
.form-group label[b-qb0h5mwr3l] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qb0h5mwr3l], .form-group select[b-qb0h5mwr3l], .form-textarea[b-qb0h5mwr3l] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qb0h5mwr3l], .form-group select:focus[b-qb0h5mwr3l], .form-textarea:focus[b-qb0h5mwr3l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qb0h5mwr3l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qb0h5mwr3l] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qb0h5mwr3l] { flex: 1; display: flex; align-items: center; }
.form-check[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qb0h5mwr3l] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qb0h5mwr3l] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qb0h5mwr3l] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qb0h5mwr3l] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qb0h5mwr3l] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qb0h5mwr3l] { font-size: 3rem; }
.photo-placeholder span[b-qb0h5mwr3l] { font-size: 0.78rem; }
.photo-actions[b-qb0h5mwr3l] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qb0h5mwr3l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qb0h5mwr3l] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qb0h5mwr3l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qb0h5mwr3l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qb0h5mwr3l] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qb0h5mwr3l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qb0h5mwr3l] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qb0h5mwr3l] { filter: brightness(1.15); transform: scale(1.05); }
[b-qb0h5mwr3l] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qb0h5mwr3l] { padding: 0.75rem; }
    .crud-header[b-qb0h5mwr3l] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qb0h5mwr3l] { font-size: 1.1rem; }
    .btn-text[b-qb0h5mwr3l] { display: none; }
    .form-row[b-qb0h5mwr3l] { flex-direction: column; }
    .form-row-4[b-qb0h5mwr3l] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qb0h5mwr3l] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qb0h5mwr3l] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qb0h5mwr3l] { padding: 0.75rem; }
    .modal-tabs[b-qb0h5mwr3l] { overflow-x: auto; }
    .modal-tab[b-qb0h5mwr3l] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qb0h5mwr3l] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qb0h5mwr3l] { display: grid !important; }
    .crud-cards-wrapper[b-qb0h5mwr3l] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qb0h5mwr3l] { grid-template-columns: 1fr; }
    .card-details[b-qb0h5mwr3l] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qb0h5mwr3l] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qb0h5mwr3l] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qb0h5mwr3l] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qb0h5mwr3l] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Colegio/Frmtransfiereestudiantedecurso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-izzalx7hl7] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-izzalx7hl7 0.3s ease-out; }
@keyframes slideUp-b-izzalx7hl7 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-izzalx7hl7] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-izzalx7hl7] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-izzalx7hl7] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-izzalx7hl7] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-izzalx7hl7] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-izzalx7hl7] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-izzalx7hl7] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-izzalx7hl7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-izzalx7hl7] { filter: brightness(1.1); }
.btn-outline[b-izzalx7hl7] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-izzalx7hl7] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-izzalx7hl7] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-izzalx7hl7] { filter: brightness(1.1); }
.btn-icon[b-izzalx7hl7] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-izzalx7hl7] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-izzalx7hl7] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-izzalx7hl7] { color: #ef4444; }
.btn-delete:hover[b-izzalx7hl7] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-izzalx7hl7] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-izzalx7hl7] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-izzalx7hl7] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-izzalx7hl7] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-izzalx7hl7] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-izzalx7hl7] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-izzalx7hl7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-izzalx7hl7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-izzalx7hl7] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-izzalx7hl7] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-izzalx7hl7] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-izzalx7hl7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-izzalx7hl7] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-izzalx7hl7] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-izzalx7hl7] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-izzalx7hl7] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-izzalx7hl7] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-izzalx7hl7] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-izzalx7hl7] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-izzalx7hl7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-izzalx7hl7] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-izzalx7hl7] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-izzalx7hl7] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-izzalx7hl7] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-izzalx7hl7] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-izzalx7hl7] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-izzalx7hl7] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-izzalx7hl7] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-izzalx7hl7] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-izzalx7hl7] { display: block; }
.hide-on-cards[b-izzalx7hl7] { display: none !important; }
.show-on-cards[b-izzalx7hl7] { display: grid; }
.hide-on-grid[b-izzalx7hl7] { display: none !important; }

/* Badges */
.badge[b-izzalx7hl7] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-izzalx7hl7] { background: #ecfdf5; color: #065f46; }
.badge-no[b-izzalx7hl7] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-izzalx7hl7] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-izzalx7hl7] { text-align: center; }
.text-muted[b-izzalx7hl7] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-izzalx7hl7], .crud-empty-state[b-izzalx7hl7] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-izzalx7hl7] { font-size: 2rem; }
.crud-spinner[b-izzalx7hl7] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-izzalx7hl7 0.6s linear infinite; }
.crud-spinner-sm[b-izzalx7hl7] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-izzalx7hl7 0.6s linear infinite; }
@keyframes spin-b-izzalx7hl7 { to { transform: rotate(360deg); } }
.spin[b-izzalx7hl7] { animation: spin-b-izzalx7hl7 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-izzalx7hl7] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-izzalx7hl7 0.15s ease-out; }
.modal-container[b-izzalx7hl7] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-izzalx7hl7] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-izzalx7hl7 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-izzalx7hl7] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-izzalx7hl7] { max-width: 420px; }
@keyframes fadeIn-b-izzalx7hl7 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-izzalx7hl7 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-izzalx7hl7] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-izzalx7hl7] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-izzalx7hl7] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-izzalx7hl7] { color: #dc2626; }
.modal-close[b-izzalx7hl7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-izzalx7hl7] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-izzalx7hl7] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-izzalx7hl7] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-izzalx7hl7] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-izzalx7hl7] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-izzalx7hl7] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-izzalx7hl7] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-izzalx7hl7] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-izzalx7hl7] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-izzalx7hl7] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-izzalx7hl7] { flex: 2; }
.form-group label[b-izzalx7hl7] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-izzalx7hl7], .form-group select[b-izzalx7hl7], .form-textarea[b-izzalx7hl7] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-izzalx7hl7], .form-group select:focus[b-izzalx7hl7], .form-textarea:focus[b-izzalx7hl7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-izzalx7hl7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-izzalx7hl7] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-izzalx7hl7] { flex: 1; display: flex; align-items: center; }
.form-check[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-izzalx7hl7] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-izzalx7hl7] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-izzalx7hl7] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-izzalx7hl7] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-izzalx7hl7] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-izzalx7hl7] { font-size: 3rem; }
.photo-placeholder span[b-izzalx7hl7] { font-size: 0.78rem; }
.photo-actions[b-izzalx7hl7] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-izzalx7hl7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-izzalx7hl7] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-izzalx7hl7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-izzalx7hl7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-izzalx7hl7] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-izzalx7hl7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-izzalx7hl7] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-izzalx7hl7] { filter: brightness(1.15); transform: scale(1.05); }
[b-izzalx7hl7] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-izzalx7hl7] { padding: 0.75rem; }
    .crud-header[b-izzalx7hl7] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-izzalx7hl7] { font-size: 1.1rem; }
    .btn-text[b-izzalx7hl7] { display: none; }
    .form-row[b-izzalx7hl7] { flex-direction: column; }
    .form-row-4[b-izzalx7hl7] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-izzalx7hl7] { width: 98%; max-height: 95vh; }
    .modal-lg[b-izzalx7hl7] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-izzalx7hl7] { padding: 0.75rem; }
    .modal-tabs[b-izzalx7hl7] { overflow-x: auto; }
    .modal-tab[b-izzalx7hl7] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-izzalx7hl7] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-izzalx7hl7] { display: grid !important; }
    .crud-cards-wrapper[b-izzalx7hl7] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-izzalx7hl7] { grid-template-columns: 1fr; }
    .card-details[b-izzalx7hl7] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-izzalx7hl7] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-izzalx7hl7] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-izzalx7hl7] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-izzalx7hl7] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconCatCapitulos.razor.rz.scp.css */
/* ============================================================
   Construcción — Catálogo de Capítulos
   ============================================================ */

.crud-container[b-y7i70ctl42] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-y7i70ctl42 0.3s ease-out; }
@keyframes slideUp-b-y7i70ctl42 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-y7i70ctl42] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-y7i70ctl42] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-y7i70ctl42] { font-size: 1.75rem; color: #b45309; }
.crud-title[b-y7i70ctl42] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-y7i70ctl42] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-y7i70ctl42] { display: flex; gap: 0.5rem; }

.btn-crud[b-y7i70ctl42] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-y7i70ctl42] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-y7i70ctl42] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-y7i70ctl42] { filter: brightness(1.1); }
.btn-outline[b-y7i70ctl42] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-y7i70ctl42] { background: var(--rg-bg-hover); }
.btn-help[b-y7i70ctl42] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover:not(:disabled)[b-y7i70ctl42] { background: var(--rg-accent); color: #fff; }
.btn-icon[b-y7i70ctl42] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-y7i70ctl42] { color: var(--rg-accent); }
.btn-edit:hover[b-y7i70ctl42] { background: rgba(79,70,229,0.1); }

.crud-alert[b-y7i70ctl42] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-y7i70ctl42] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-y7i70ctl42]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-y7i70ctl42] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-search-bar[b-y7i70ctl42] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); margin-bottom: 0.75rem; }
.crud-search-btn[b-y7i70ctl42] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-y7i70ctl42] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); min-width: 160px; }
.crud-search-clear[b-y7i70ctl42] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-y7i70ctl42] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-y7i70ctl42] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 250px); }
.crud-table[b-y7i70ctl42] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-y7i70ctl42] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-y7i70ctl42] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-y7i70ctl42] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-y7i70ctl42] { background: var(--rg-bg-hover); }
.text-center[b-y7i70ctl42] { text-align: center; }
.col-actions[b-y7i70ctl42] { width: 60px; text-align: center; }

.cap-codigo[b-y7i70ctl42] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; font-weight: 700; color: #b45309; }

/* Badges */
.badge[b-y7i70ctl42] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-y7i70ctl42] { background: rgba(22,163,74,0.12);  color: #166534; }
.badge-no[b-y7i70ctl42]  { background: rgba(100,116,139,0.12); color: #475569; }
[data-mode="dark"] .badge-yes[b-y7i70ctl42] { color: #86efac; }

.font-mono[b-y7i70ctl42] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }

.crud-loading[b-y7i70ctl42], .crud-empty-state[b-y7i70ctl42] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-y7i70ctl42] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-y7i70ctl42 0.6s linear infinite; }
@keyframes spin-b-y7i70ctl42 { to { transform: rotate(360deg); } }
.spin[b-y7i70ctl42] { animation: spin-b-y7i70ctl42 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-y7i70ctl42] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-y7i70ctl42 0.15s ease-out; }
.modal-container[b-y7i70ctl42] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-y7i70ctl42] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 400px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-y7i70ctl42 0.2s ease-out; }
.modal-sm[b-y7i70ctl42] { max-width: 400px; }
@keyframes fadeIn-b-y7i70ctl42 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-y7i70ctl42 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-y7i70ctl42] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-y7i70ctl42] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-y7i70ctl42] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-y7i70ctl42] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-y7i70ctl42] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-y7i70ctl42] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Form */
.form-row[b-y7i70ctl42] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-y7i70ctl42] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; margin-bottom: 0.5rem; }
.form-group label[b-y7i70ctl42] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-y7i70ctl42], .form-group select[b-y7i70ctl42] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-y7i70ctl42], .form-group select:focus[b-y7i70ctl42] { border-color: var(--rg-accent); }
.form-check-label[b-y7i70ctl42] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; color: var(--rg-text-primary); cursor: pointer; text-transform: none; letter-spacing: 0; }

@media (max-width: 768px) {
    .crud-container[b-y7i70ctl42] { padding: 0.75rem; }
    .btn-text[b-y7i70ctl42] { display: none; }
    .form-row[b-y7i70ctl42] { flex-direction: column; }
}
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconCatPartidas.razor.rz.scp.css */
/* ============================================================
   Construcción — Catálogo de Partidas
   ============================================================ */

.crud-container[b-r32hnlhad9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-r32hnlhad9 0.3s ease-out; }
@keyframes slideUp-b-r32hnlhad9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-r32hnlhad9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-r32hnlhad9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-r32hnlhad9] { font-size: 1.75rem; color: #b45309; }
.crud-title[b-r32hnlhad9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-r32hnlhad9] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-r32hnlhad9] { display: flex; gap: 0.5rem; }

.btn-crud[b-r32hnlhad9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-r32hnlhad9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-r32hnlhad9] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-r32hnlhad9] { filter: brightness(1.1); }
.btn-outline[b-r32hnlhad9] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-r32hnlhad9] { background: var(--rg-bg-hover); }
.btn-help[b-r32hnlhad9] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover:not(:disabled)[b-r32hnlhad9] { background: var(--rg-accent); color: #fff; }
.btn-sm[b-r32hnlhad9] { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-icon[b-r32hnlhad9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-r32hnlhad9] { color: var(--rg-accent); }
.btn-edit:hover[b-r32hnlhad9] { background: rgba(79,70,229,0.1); }

.crud-alert[b-r32hnlhad9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-r32hnlhad9] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-r32hnlhad9]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-r32hnlhad9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtros */
.cat-filter-bar[b-r32hnlhad9] { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: stretch; }
.crud-search-bar[b-r32hnlhad9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-r32hnlhad9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-r32hnlhad9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); min-width: 160px; }
.crud-search-clear[b-r32hnlhad9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-r32hnlhad9] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }
.cat-select[b-r32hnlhad9] { padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; }
.cat-select:focus[b-r32hnlhad9] { border-color: var(--rg-accent); }

/* Grid */
.crud-grid-wrapper[b-r32hnlhad9] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 270px); }
.crud-table[b-r32hnlhad9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-r32hnlhad9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-r32hnlhad9] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-r32hnlhad9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-r32hnlhad9] { background: var(--rg-bg-hover); }
.col-actions[b-r32hnlhad9] { width: 60px; text-align: center; white-space: nowrap; }
.text-right[b-r32hnlhad9] { text-align: right; }

.cat-cap-badge[b-r32hnlhad9] { font-size: 0.7rem; font-weight: 700; color: #b45309; }

/* Badges */
.badge[b-r32hnlhad9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-r32hnlhad9] { background: rgba(22,163,74,0.12);  color: #166534; }
.badge-no[b-r32hnlhad9]  { background: rgba(100,116,139,0.12); color: #475569; }
[data-mode="dark"] .badge-yes[b-r32hnlhad9] { color: #86efac; }

.font-mono[b-r32hnlhad9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-r32hnlhad9] { color: var(--rg-text-muted); font-size: 0.78rem; }

.crud-loading[b-r32hnlhad9], .crud-empty-state[b-r32hnlhad9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-r32hnlhad9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-r32hnlhad9 0.6s linear infinite; }
@keyframes spin-b-r32hnlhad9 { to { transform: rotate(360deg); } }
.spin[b-r32hnlhad9] { animation: spin-b-r32hnlhad9 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-r32hnlhad9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-r32hnlhad9 0.15s ease-out; }
.modal-container[b-r32hnlhad9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-r32hnlhad9] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 540px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-r32hnlhad9 0.2s ease-out; }
.modal-sm[b-r32hnlhad9] { max-width: 540px; }
@keyframes fadeIn-b-r32hnlhad9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-r32hnlhad9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-r32hnlhad9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-r32hnlhad9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-r32hnlhad9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-r32hnlhad9] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-r32hnlhad9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-r32hnlhad9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Form */
.form-row[b-r32hnlhad9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-r32hnlhad9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-r32hnlhad9] { flex: 2; }
.form-group label[b-r32hnlhad9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-r32hnlhad9], .form-group select[b-r32hnlhad9], .form-textarea[b-r32hnlhad9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-r32hnlhad9], .form-group select:focus[b-r32hnlhad9], .form-textarea:focus[b-r32hnlhad9] { border-color: var(--rg-accent); }
.form-textarea[b-r32hnlhad9] { resize: vertical; font-family: inherit; }

@media (max-width: 768px) {
    .crud-container[b-r32hnlhad9] { padding: 0.75rem; }
    .btn-text[b-r32hnlhad9] { display: none; }
    .cat-filter-bar[b-r32hnlhad9] { flex-direction: column; }
    .form-row[b-r32hnlhad9] { flex-direction: column; }
}
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconCubicaciones.razor.rz.scp.css */
/* ============================================================
   Construcción — Cubicaciones
   ============================================================ */

.crud-container[b-9sr0vxpvya] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9sr0vxpvya 0.3s ease-out; }
@keyframes slideUp-b-9sr0vxpvya { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-9sr0vxpvya] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9sr0vxpvya] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9sr0vxpvya] { font-size: 1.75rem; color: #b45309; }
.crud-title[b-9sr0vxpvya] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-9sr0vxpvya] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-9sr0vxpvya] { display: flex; gap: 0.5rem; }

.btn-crud[b-9sr0vxpvya] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9sr0vxpvya] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9sr0vxpvya] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9sr0vxpvya] { filter: brightness(1.1); }
.btn-outline[b-9sr0vxpvya] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-9sr0vxpvya] { background: var(--rg-bg-hover); }
.btn-help[b-9sr0vxpvya] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover:not(:disabled)[b-9sr0vxpvya] { background: var(--rg-accent); color: #fff; }
.btn-sm[b-9sr0vxpvya] { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-icon[b-9sr0vxpvya] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9sr0vxpvya] { color: var(--rg-accent); }
.btn-edit:hover[b-9sr0vxpvya] { background: rgba(79,70,229,0.1); }
.btn-delete[b-9sr0vxpvya] { color: #ef4444; }
.btn-delete:hover[b-9sr0vxpvya] { background: rgba(239,68,68,0.1); }
.btn-approve[b-9sr0vxpvya] { color: #16a34a; }
.btn-approve:hover[b-9sr0vxpvya] { background: rgba(22,163,74,0.1); }
.btn-view[b-9sr0vxpvya] { color: var(--rg-text-secondary); }
.btn-view:hover[b-9sr0vxpvya] { background: var(--rg-bg-hover); }
.btn-pdf[b-9sr0vxpvya] { color: #dc2626; }
.btn-pdf:hover[b-9sr0vxpvya] { background: rgba(220,38,38,0.1); }
.btn-send[b-9sr0vxpvya] { color: #0ea5e9; }
.btn-send:hover[b-9sr0vxpvya] { background: rgba(14,165,233,0.1); }

.crud-alert[b-9sr0vxpvya] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9sr0vxpvya] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-9sr0vxpvya]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-9sr0vxpvya] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtro proyecto */
.cub-filter-bar[b-9sr0vxpvya] { margin-bottom: 0.75rem; }
.cub-select[b-9sr0vxpvya] { width: 100%; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; }
.cub-select:focus[b-9sr0vxpvya] { border-color: var(--rg-accent); }

/* Grid */
.crud-grid-wrapper[b-9sr0vxpvya] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 260px); }
.crud-table[b-9sr0vxpvya] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9sr0vxpvya] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9sr0vxpvya] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9sr0vxpvya] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-9sr0vxpvya] { background: var(--rg-bg-hover); }
.col-actions[b-9sr0vxpvya] { width: 80px; text-align: center; white-space: nowrap; }
.text-center[b-9sr0vxpvya] { text-align: center; }
.text-right[b-9sr0vxpvya] { text-align: right; }

.cub-icon[b-9sr0vxpvya] { width: 32px; height: 32px; border-radius: 0.4rem; background: rgba(234,179,8,0.12); display: flex; align-items: center; justify-content: center; color: #ca8a04; font-size: 1rem; }

/* Badges */
.badge[b-9sr0vxpvya] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-borrador[b-9sr0vxpvya]   { background: rgba(100,116,139,0.12); color: #475569; }
.badge-aprobada[b-9sr0vxpvya]   { background: rgba(22,163,74,0.12);   color: #166534; }
.badge-facturada[b-9sr0vxpvya]  { background: rgba(37,99,235,0.12);   color: #1e40af; }
.badge-rechazada[b-9sr0vxpvya]  { background: rgba(239,68,68,0.12);   color: #991b1b; }

[data-mode="dark"] .badge-borrador[b-9sr0vxpvya]  { color: #94a3b8; }
[data-mode="dark"] .badge-aprobada[b-9sr0vxpvya]  { color: #86efac; }
[data-mode="dark"] .badge-facturada[b-9sr0vxpvya] { color: #93c5fd; }
[data-mode="dark"] .badge-rechazada[b-9sr0vxpvya] { color: #fca5a5; }

.font-mono[b-9sr0vxpvya] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Loading / Empty */
.crud-loading[b-9sr0vxpvya], .crud-empty-state[b-9sr0vxpvya] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-9sr0vxpvya] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-9sr0vxpvya 0.6s linear infinite; }
@keyframes spin-b-9sr0vxpvya { to { transform: rotate(360deg); } }
.spin[b-9sr0vxpvya] { animation: spin-b-9sr0vxpvya 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-9sr0vxpvya] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9sr0vxpvya 0.15s ease-out; }
.modal-container[b-9sr0vxpvya] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9sr0vxpvya] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 720px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9sr0vxpvya 0.2s ease-out; }
.modal-lg[b-9sr0vxpvya] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9sr0vxpvya] { max-width: 440px; }
@keyframes fadeIn-b-9sr0vxpvya { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9sr0vxpvya { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9sr0vxpvya] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-9sr0vxpvya] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-9sr0vxpvya] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9sr0vxpvya] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-9sr0vxpvya] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9sr0vxpvya] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Form */
.form-row[b-9sr0vxpvya] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9sr0vxpvya] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-9sr0vxpvya] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9sr0vxpvya], .form-group select[b-9sr0vxpvya], .form-textarea[b-9sr0vxpvya] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-9sr0vxpvya], .form-group select:focus[b-9sr0vxpvya], .form-textarea:focus[b-9sr0vxpvya] { border-color: var(--rg-accent); }
.form-group input[readonly][b-9sr0vxpvya] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); }
.form-textarea[b-9sr0vxpvya] { resize: vertical; font-family: inherit; }
.form-section-title[b-9sr0vxpvya] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); border-bottom: 1px solid var(--rg-border); padding-bottom: 0.3rem; margin: 0.75rem 0 0.5rem; }

/* Agregar partida */
.cub-add-row[b-9sr0vxpvya] { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: flex-end; }
.cub-select-partida[b-9sr0vxpvya] { flex: 1; padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; background: var(--rg-bg-input); color: var(--rg-text-primary); outline: none; }
.cub-qty-input[b-9sr0vxpvya] { width: 110px; padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; background: var(--rg-bg-input); color: var(--rg-text-primary); outline: none; }
.cub-select-partida:focus[b-9sr0vxpvya], .cub-qty-input:focus[b-9sr0vxpvya] { border-color: var(--rg-accent); }

/* Detalle table */
.cub-detalle-wrapper[b-9sr0vxpvya] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; max-height: 260px; margin-bottom: 0.75rem; }
.cub-detalle-table[b-9sr0vxpvya] { width: 100%; border-collapse: collapse; font-size: 0.77rem; }
.cub-detalle-table th[b-9sr0vxpvya] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.45rem 0.6rem; border-bottom: 2px solid var(--rg-border); font-size: 0.7rem; text-transform: uppercase; position: sticky; top: 0; }
.cub-detalle-table td[b-9sr0vxpvya] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.cub-detalle-table tbody tr:hover[b-9sr0vxpvya] { background: var(--rg-bg-hover); }
.cub-partida-name[b-9sr0vxpvya] { font-weight: 600; font-size: 0.78rem; }
.cub-partida-cap[b-9sr0vxpvya]  { font-size: 0.68rem; color: var(--rg-text-muted); }
.cub-empty-row[b-9sr0vxpvya] { text-align: center; color: var(--rg-text-muted); padding: 1.5rem; }

/* Totales */
.cub-totales[b-9sr0vxpvya] { display: flex; flex-direction: column; gap: 0.3rem; margin-top: 0.5rem; padding: 0.75rem; background: var(--rg-bg-subtle); border-radius: 0.5rem; border: 1px solid var(--rg-border); }
.cub-total-row[b-9sr0vxpvya] { display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--rg-text-secondary); }
.cub-total-final[b-9sr0vxpvya] { font-size: 0.9rem; font-weight: 700; color: var(--rg-text-primary); border-top: 1px solid var(--rg-border); padding-top: 0.3rem; margin-top: 0.2rem; }

@media (max-width: 768px) {
    .crud-container[b-9sr0vxpvya] { padding: 0.75rem; }
    .btn-text[b-9sr0vxpvya] { display: none; }
    .form-row[b-9sr0vxpvya] { flex-direction: column; }
    .modal-lg[b-9sr0vxpvya] { width: 98vw; height: 95vh; max-height: 95vh; }
    .cub-add-row[b-9sr0vxpvya] { flex-direction: column; }
    .cub-qty-input[b-9sr0vxpvya] { width: 100%; }
}

/* ── Modales anidados (post-save sobre modal principal) ── */
.modal-backdrop-nested[b-9sr0vxpvya]  { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 2000; }
.modal-container-nested[b-9sr0vxpvya] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 2001; }

/* ── Post-save ── */
.ps-modal[b-9sr0vxpvya] { max-width: 340px; }
.ps-recibo-info[b-9sr0vxpvya] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: 1rem; }
.ps-label[b-9sr0vxpvya] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-9sr0vxpvya] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-acciones[b-9sr0vxpvya] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-9sr0vxpvya] { width: 100%; justify-content: center; }
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconDashboard.razor.rz.scp.css */
/* ============================================================
   Construcción — Dashboard
   ============================================================ */

.crud-container[b-ivy9p2alzi] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ivy9p2alzi 0.3s ease-out; }
@keyframes slideUp-b-ivy9p2alzi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-ivy9p2alzi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ivy9p2alzi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ivy9p2alzi] { font-size: 1.75rem; }
.con-icon[b-ivy9p2alzi] { color: #b45309; }
.crud-title[b-ivy9p2alzi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-ivy9p2alzi] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-ivy9p2alzi] { display: flex; gap: 0.5rem; }

.btn-crud[b-ivy9p2alzi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ivy9p2alzi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ivy9p2alzi] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ivy9p2alzi] { filter: brightness(1.1); }
.btn-outline[b-ivy9p2alzi] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-ivy9p2alzi] { background: var(--rg-bg-hover); }

.crud-loading[b-ivy9p2alzi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-ivy9p2alzi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-ivy9p2alzi 0.6s linear infinite; }
@keyframes spin-b-ivy9p2alzi { to { transform: rotate(360deg); } }
.spin[b-ivy9p2alzi] { animation: spin-b-ivy9p2alzi 0.8s linear infinite; }

/* KPI Grid */
.con-kpi-grid[b-ivy9p2alzi] { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.875rem; margin-bottom: 1.25rem; }

.con-kpi-card[b-ivy9p2alzi] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    padding: 1rem 1.125rem;
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    transition: box-shadow 0.15s;
}
.con-kpi-card:hover[b-ivy9p2alzi] { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.con-kpi-card.con-kpi-alert[b-ivy9p2alzi] { border-color: #fb923c; }
.con-kpi-card.con-kpi-danger[b-ivy9p2alzi] { border-color: #f87171; }

.con-kpi-icon[b-ivy9p2alzi] {
    width: 42px; height: 42px; border-radius: 0.6rem;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem; flex-shrink: 0;
}
.con-kpi-body[b-ivy9p2alzi] { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.con-kpi-label[b-ivy9p2alzi] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.con-kpi-value[b-ivy9p2alzi] { font-size: 1.35rem; font-weight: 700; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.con-kpi-sub[b-ivy9p2alzi] { font-size: 0.7rem; color: var(--rg-text-muted); }

/* Quick access */
.con-quick-grid[b-ivy9p2alzi] { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.con-quick-btn[b-ivy9p2alzi] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.6rem 1.1rem;
    background: var(--rg-bg-card); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; cursor: pointer;
    font-size: 0.8rem; font-weight: 600; color: var(--rg-text-secondary);
    transition: all 0.15s;
}
.con-quick-btn:hover[b-ivy9p2alzi] { background: var(--rg-bg-hover); border-color: var(--rg-accent); color: var(--rg-accent); }
.con-quick-btn i[b-ivy9p2alzi] { font-size: 1rem; }

/* Dark mode badges */
[data-mode="dark"] .con-kpi-card.con-kpi-alert[b-ivy9p2alzi] { border-color: #c2410c; }
[data-mode="dark"] .con-kpi-card.con-kpi-danger[b-ivy9p2alzi] { border-color: #b91c1c; }
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconFacturas.razor.rz.scp.css */
/* ============================================================
   Construcción — Facturas e-CF
   ============================================================ */

.crud-container[b-lv1p8rczla] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lv1p8rczla 0.3s ease-out; }
@keyframes slideUp-b-lv1p8rczla { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-lv1p8rczla] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lv1p8rczla] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lv1p8rczla] { font-size: 1.75rem; color: #b45309; }
.crud-title[b-lv1p8rczla] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-lv1p8rczla] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-lv1p8rczla] { display: flex; gap: 0.5rem; }

.btn-crud[b-lv1p8rczla] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lv1p8rczla] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lv1p8rczla] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lv1p8rczla] { filter: brightness(1.1); }
.btn-outline[b-lv1p8rczla] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-lv1p8rczla] { background: var(--rg-bg-hover); }
.btn-help[b-lv1p8rczla] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover:not(:disabled)[b-lv1p8rczla] { background: var(--rg-accent); color: #fff; }
.btn-danger[b-lv1p8rczla] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lv1p8rczla] { filter: brightness(1.1); }
.btn-sm[b-lv1p8rczla] { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-icon[b-lv1p8rczla] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-view[b-lv1p8rczla]   { color: var(--rg-text-secondary); }
.btn-view:hover[b-lv1p8rczla] { background: var(--rg-bg-hover); }
.btn-delete[b-lv1p8rczla] { color: #ef4444; }
.btn-delete:hover[b-lv1p8rczla] { background: rgba(239,68,68,0.1); }

.crud-alert[b-lv1p8rczla] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lv1p8rczla] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-lv1p8rczla]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-lv1p8rczla] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtros */
.fact-filter-bar[b-lv1p8rczla] { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: stretch; }
.crud-search-bar[b-lv1p8rczla] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-lv1p8rczla] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-lv1p8rczla] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); min-width: 200px; }
.crud-search-clear[b-lv1p8rczla] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-lv1p8rczla] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }
.fact-select[b-lv1p8rczla] { padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; }
.fact-select:focus[b-lv1p8rczla] { border-color: var(--rg-accent); }

/* Grid */
.crud-grid-wrapper[b-lv1p8rczla] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 270px); }
.crud-table[b-lv1p8rczla] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lv1p8rczla] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lv1p8rczla] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lv1p8rczla] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-lv1p8rczla] { background: var(--rg-bg-hover); }
.col-actions[b-lv1p8rczla] { width: 80px; text-align: center; white-space: nowrap; }
.text-center[b-lv1p8rczla] { text-align: center; }
.text-right[b-lv1p8rczla] { text-align: right; }
.text-danger[b-lv1p8rczla] { color: #dc2626; }

.fact-icon[b-lv1p8rczla] { width: 32px; height: 32px; border-radius: 0.4rem; background: rgba(22,163,74,0.12); display: flex; align-items: center; justify-content: center; color: #16a34a; font-size: 1rem; }

/* Badges */
.badge[b-lv1p8rczla] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-pendiente[b-lv1p8rczla] { background: rgba(100,116,139,0.12); color: #475569; }
.badge-enviada[b-lv1p8rczla]   { background: rgba(37,99,235,0.12);   color: #1e40af; }
.badge-aceptada[b-lv1p8rczla]  { background: rgba(22,163,74,0.12);   color: #166534; }
.badge-rechazada[b-lv1p8rczla] { background: rgba(239,68,68,0.12);   color: #991b1b; }
.badge-anulada[b-lv1p8rczla]   { background: rgba(100,116,139,0.12); color: #475569; text-decoration: line-through; }

[data-mode="dark"] .badge-pendiente[b-lv1p8rczla] { color: #94a3b8; }
[data-mode="dark"] .badge-enviada[b-lv1p8rczla]   { color: #93c5fd; }
[data-mode="dark"] .badge-aceptada[b-lv1p8rczla]  { color: #86efac; }
[data-mode="dark"] .badge-rechazada[b-lv1p8rczla] { color: #fca5a5; }

.font-mono[b-lv1p8rczla] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-lv1p8rczla] { color: var(--rg-text-muted); font-size: 0.78rem; }

.crud-loading[b-lv1p8rczla], .crud-empty-state[b-lv1p8rczla] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-lv1p8rczla] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-lv1p8rczla 0.6s linear infinite; }
@keyframes spin-b-lv1p8rczla { to { transform: rotate(360deg); } }
.spin[b-lv1p8rczla] { animation: spin-b-lv1p8rczla 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-lv1p8rczla] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lv1p8rczla 0.15s ease-out; }
.modal-container[b-lv1p8rczla] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lv1p8rczla] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 720px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lv1p8rczla 0.2s ease-out; }
.modal-lg[b-lv1p8rczla] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lv1p8rczla] { max-width: 440px; }
@keyframes fadeIn-b-lv1p8rczla { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lv1p8rczla { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lv1p8rczla] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-lv1p8rczla] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-lv1p8rczla] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lv1p8rczla] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-lv1p8rczla] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lv1p8rczla] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Form */
.form-row[b-lv1p8rczla] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lv1p8rczla] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lv1p8rczla] { flex: 2; }
.form-group label[b-lv1p8rczla] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lv1p8rczla], .form-group select[b-lv1p8rczla], .form-textarea[b-lv1p8rczla] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-lv1p8rczla], .form-group select:focus[b-lv1p8rczla], .form-textarea:focus[b-lv1p8rczla] { border-color: var(--rg-accent); }
.form-group input[readonly][b-lv1p8rczla] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); }
.form-textarea[b-lv1p8rczla] { resize: vertical; font-family: inherit; }
.form-section-title[b-lv1p8rczla] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); border-bottom: 1px solid var(--rg-border); padding-bottom: 0.3rem; margin: 0.75rem 0 0.5rem; }

/* Detalle factura */
.fact-detalle-wrapper[b-lv1p8rczla] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; max-height: 220px; margin-bottom: 0.75rem; }
.fact-detalle-table[b-lv1p8rczla] { width: 100%; border-collapse: collapse; font-size: 0.77rem; }
.fact-detalle-table th[b-lv1p8rczla] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.45rem 0.6rem; border-bottom: 2px solid var(--rg-border); font-size: 0.7rem; text-transform: uppercase; position: sticky; top: 0; }
.fact-detalle-table td[b-lv1p8rczla] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.fact-empty-row[b-lv1p8rczla] { text-align: center; color: var(--rg-text-muted); padding: 1.5rem; }

/* Totales */
.fact-totales[b-lv1p8rczla] { display: flex; flex-direction: column; gap: 0.3rem; padding: 0.75rem; background: var(--rg-bg-subtle); border-radius: 0.5rem; border: 1px solid var(--rg-border); }
.fact-total-row[b-lv1p8rczla] { display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--rg-text-secondary); }
.fact-total-final[b-lv1p8rczla] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); border-top: 1px solid var(--rg-border); padding-top: 0.35rem; margin-top: 0.2rem; }

@media (max-width: 768px) {
    .crud-container[b-lv1p8rczla] { padding: 0.75rem; }
    .btn-text[b-lv1p8rczla] { display: none; }
    .fact-filter-bar[b-lv1p8rczla] { flex-direction: column; }
    .form-row[b-lv1p8rczla] { flex-direction: column; }
    .modal-lg[b-lv1p8rczla] { width: 98vw; height: 95vh; max-height: 95vh; }
}

/* ── Cliente picker input ────────────────────────────────── */
.fact-cliente-input[b-lv1p8rczla] {
    display: flex;
    gap: 0.4rem;
    align-items: stretch;
}
.fact-cliente-input input[b-lv1p8rczla] {
    flex: 1;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.45rem 0.65rem;
    font-size: 0.85rem;
}
.fact-cliente-input input:hover[b-lv1p8rczla] { border-color: var(--rg-accent); }
.fact-cliente-btn[b-lv1p8rczla] {
    flex: 0 0 auto;
    width: 2.4rem;
    background: var(--rg-accent);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    transition: filter 0.15s;
}
.fact-cliente-btn:hover[b-lv1p8rczla] { filter: brightness(1.1); }

/* ── Post-grabado ────────────────────────────────────────── */
.modal-backdrop-nested[b-lv1p8rczla]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-lv1p8rczla] { z-index: 2001 !important; }
.ps-modal[b-lv1p8rczla] { max-width: 380px; }
.ps-recibo-info[b-lv1p8rczla] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem; }
.ps-label[b-lv1p8rczla] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-lv1p8rczla] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-cliente-info[b-lv1p8rczla] { display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--rg-text-secondary); margin-bottom: .35rem; }
.ps-acciones[b-lv1p8rczla] { display: flex; flex-direction: column; gap: .5rem; margin-top: .75rem; }
.ps-acciones .btn-crud[b-lv1p8rczla] { width: 100%; justify-content: center; }
/* _content/Rgclouds.Web/Components/Pages/Constructora/FrmconProyectos.razor.rz.scp.css */
/* ============================================================
   Construcción — Proyectos  (CRUD estándar + tabs + estados)
   ============================================================ */

/* ── Tab Presupuesto ── */
.ppto-header-bar[b-enb7zt3m7r] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.ppto-version-info[b-enb7zt3m7r] { font-size: 0.8rem; }
.ppto-add-bar[b-enb7zt3m7r] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.85rem; flex-wrap: wrap; }
.ppto-select[b-enb7zt3m7r] { flex: 2; min-width: 160px; padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 6px; background: var(--rg-bg-input); color: var(--rg-text-primary); font-size: 0.8rem; }
.ppto-select-partida[b-enb7zt3m7r] { flex: 3; min-width: 200px; }
.ppto-qty[b-enb7zt3m7r] { width: 90px; padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 6px; background: var(--rg-bg-input); color: var(--rg-text-primary); font-size: 0.8rem; }
.ppto-unidad-label[b-enb7zt3m7r] { font-size: 0.75rem; color: var(--rg-text-muted); min-width: 24px; text-align: center; }
.ppto-table-wrapper[b-enb7zt3m7r] { max-height: 340px; overflow-y: auto; border: 1px solid var(--rg-border); border-radius: 8px; }
.ppto-table[b-enb7zt3m7r] { margin: 0; }
.ppto-cap-cell[b-enb7zt3m7r] { display: flex; flex-direction: column; gap: 0.1rem; }
.ppto-cap-badge[b-enb7zt3m7r] { font-size: 0.68rem; font-weight: 700; background: rgba(37,99,235,0.1); color: var(--rg-accent); padding: 0.1rem 0.35rem; border-radius: 4px; display: inline-block; width: fit-content; }
.ppto-cap-cell small[b-enb7zt3m7r] { font-size: 0.7rem; color: var(--rg-text-muted); }
.ppto-total-row td[b-enb7zt3m7r] { background: var(--rg-bg-subtle); font-weight: 700; border-top: 2px solid var(--rg-border); }

/* ── Accordion de capítulos ── */
.ppto-accordion-bar[b-enb7zt3m7r] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}
.ppto-cap-total-label[b-enb7zt3m7r] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    margin-left: auto;
}

/* Fila de capítulo (header del accordion) */
.ppto-cap-row[b-enb7zt3m7r] {
    cursor: pointer;
    user-select: none;
    background: var(--rg-bg-subtle) !important;
    border-bottom: 1px solid var(--rg-border);
    transition: background 0.15s;
}
.ppto-cap-row:hover[b-enb7zt3m7r] {
    background: rgba(37,99,235,0.08) !important;
}
.ppto-chevron-cell[b-enb7zt3m7r] {
    text-align: center;
    padding: 0.4rem 0.5rem !important;
    vertical-align: middle;
}
.ppto-chevron[b-enb7zt3m7r] {
    font-size: 0.7rem;
    color: var(--rg-accent);
    transition: transform 0.18s;
}
.ppto-cap-info[b-enb7zt3m7r] {
    padding: 0.45rem 0.5rem !important;
    vertical-align: middle;
}
.ppto-cap-info .ppto-cap-badge[b-enb7zt3m7r] {
    margin-right: 0.45rem;
}
.ppto-cap-nombre[b-enb7zt3m7r] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    margin-right: 0.5rem;
}
.ppto-cap-count[b-enb7zt3m7r] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 20px;
    padding: 0.05rem 0.45rem;
}
.ppto-cap-subtotal-cell[b-enb7zt3m7r] {
    color: var(--rg-text-primary);
    font-size: 0.82rem;
    padding-right: 0.6rem !important;
    vertical-align: middle;
}

/* Fila de partida (hijo del accordion) */
.ppto-partida-row[b-enb7zt3m7r] {
    background: var(--rg-bg-card) !important;
}
.ppto-partida-row:hover[b-enb7zt3m7r] {
    background: var(--rg-bg-hover) !important;
}
.ppto-indent-cell[b-enb7zt3m7r] {
    text-align: center;
    padding: 0.3rem 0.25rem !important;
    vertical-align: middle;
    border-left: 2px solid rgba(37,99,235,0.2);
}
.ppto-indent-icon[b-enb7zt3m7r] {
    font-size: 0.65rem;
    color: var(--rg-text-muted);
}

/* Alineación correcta: headers y celdas numéricas a la derecha
   (Blazor CSS isolation incrementa especificidad de .crud-table th, necesitamos sobreescribir) */
.ppto-table th.text-right[b-enb7zt3m7r], .ppto-table td.text-right[b-enb7zt3m7r] { text-align: right !important; }
.ppto-table th.text-center[b-enb7zt3m7r], .ppto-table td.text-center[b-enb7zt3m7r] { text-align: center !important; }

/* Header bar del presupuesto — flex con botones a la derecha */
.ppto-action-bar[b-enb7zt3m7r] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; }
.ppto-action-bar-left[b-enb7zt3m7r]  { display: flex; align-items: center; gap: 0.4rem; }
.ppto-action-bar-right[b-enb7zt3m7r] { display: flex; align-items: center; gap: 0.4rem; }

.crud-container[b-enb7zt3m7r] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-enb7zt3m7r 0.3s ease-out; }
@keyframes slideUp-b-enb7zt3m7r { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-enb7zt3m7r] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-enb7zt3m7r] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-enb7zt3m7r] { font-size: 1.75rem; color: #b45309; }
.crud-title[b-enb7zt3m7r] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-enb7zt3m7r] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-enb7zt3m7r] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-enb7zt3m7r] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-enb7zt3m7r] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-enb7zt3m7r] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-enb7zt3m7r] { filter: brightness(1.1); }
.btn-outline[b-enb7zt3m7r] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-enb7zt3m7r] { background: var(--rg-bg-hover); }
.btn-help[b-enb7zt3m7r] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover:not(:disabled)[b-enb7zt3m7r] { background: var(--rg-accent); color: #fff; }
.btn-danger[b-enb7zt3m7r] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-enb7zt3m7r] { filter: brightness(1.1); }
.btn-sm[b-enb7zt3m7r] { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-icon[b-enb7zt3m7r] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-enb7zt3m7r] { color: var(--rg-accent); }
.btn-edit:hover[b-enb7zt3m7r] { background: rgba(79,70,229,0.1); }
.btn-delete[b-enb7zt3m7r] { color: #ef4444; }
.btn-delete:hover[b-enb7zt3m7r] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-enb7zt3m7r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-enb7zt3m7r] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-enb7zt3m7r]   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-enb7zt3m7r] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filter bar */
.con-filter-bar[b-enb7zt3m7r] { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: stretch; }
.crud-search-bar[b-enb7zt3m7r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-enb7zt3m7r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-enb7zt3m7r] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); min-width: 180px; }
.crud-search-clear[b-enb7zt3m7r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-enb7zt3m7r] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }
.con-estado-select[b-enb7zt3m7r] { padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.78rem; background: var(--rg-bg-card); color: var(--rg-text-primary); outline: none; cursor: pointer; }
.con-estado-select:focus[b-enb7zt3m7r] { border-color: var(--rg-accent); }

/* Grid */
.crud-grid-wrapper[b-enb7zt3m7r] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-enb7zt3m7r] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-enb7zt3m7r] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-enb7zt3m7r] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-enb7zt3m7r] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-enb7zt3m7r] { background: var(--rg-bg-hover); }
.col-actions[b-enb7zt3m7r] { width: 80px; text-align: center; white-space: nowrap; }
.text-center[b-enb7zt3m7r] { text-align: center; }
.text-right[b-enb7zt3m7r] { text-align: right; }

/* Project icon cell */
.con-proy-icon[b-enb7zt3m7r] { width: 32px; height: 32px; border-radius: 0.4rem; background: rgba(180,83,9,0.12); display: flex; align-items: center; justify-content: center; color: #b45309; font-size: 1rem; }

/* Badges */
.badge[b-enb7zt3m7r] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-enb7zt3m7r]     { background: rgba(22,163,74,0.12);  color: #166534; }
.badge-no[b-enb7zt3m7r]      { background: rgba(100,116,139,0.12); color: #475569; }
.badge-ejecucion[b-enb7zt3m7r] { background: rgba(37,99,235,0.12); color: #1e40af; }
.badge-plan[b-enb7zt3m7r]    { background: rgba(217,119,6,0.12);  color: #92400e; }
.badge-cierre[b-enb7zt3m7r]  { background: rgba(139,92,246,0.12); color: #5b21b6; }
.badge-completado[b-enb7zt3m7r] { background: rgba(22,163,74,0.12); color: #166534; }
.badge-suspendido[b-enb7zt3m7r] { background: rgba(239,68,68,0.12);  color: #991b1b; }

[data-mode="dark"] .badge-yes[b-enb7zt3m7r]       { color: #86efac; }
[data-mode="dark"] .badge-ejecucion[b-enb7zt3m7r] { color: #93c5fd; }
[data-mode="dark"] .badge-plan[b-enb7zt3m7r]      { color: #fcd34d; }
[data-mode="dark"] .badge-cierre[b-enb7zt3m7r]    { color: #c4b5fd; }
[data-mode="dark"] .badge-completado[b-enb7zt3m7r] { color: #86efac; }
[data-mode="dark"] .badge-suspendido[b-enb7zt3m7r] { color: #fca5a5; }

/* Utilities */
.font-mono[b-enb7zt3m7r] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-enb7zt3m7r] { color: var(--rg-text-muted); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-enb7zt3m7r], .crud-empty-state[b-enb7zt3m7r] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-enb7zt3m7r] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-enb7zt3m7r 0.6s linear infinite; }
@keyframes spin-b-enb7zt3m7r { to { transform: rotate(360deg); } }
.spin[b-enb7zt3m7r] { animation: spin-b-enb7zt3m7r 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-enb7zt3m7r] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-enb7zt3m7r 0.15s ease-out; }
.modal-container[b-enb7zt3m7r] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-enb7zt3m7r] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-enb7zt3m7r 0.2s ease-out; }
.modal-lg[b-enb7zt3m7r] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-enb7zt3m7r] { max-width: 420px; }
@keyframes fadeIn-b-enb7zt3m7r { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-enb7zt3m7r { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-enb7zt3m7r] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-enb7zt3m7r] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-enb7zt3m7r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-enb7zt3m7r] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-enb7zt3m7r] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-enb7zt3m7r] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-enb7zt3m7r] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border); margin-bottom: 1rem; }
.modal-tab[b-enb7zt3m7r] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover:not(:disabled)[b-enb7zt3m7r] { color: var(--rg-text-primary); }
.modal-tab.active[b-enb7zt3m7r] { color: var(--rg-accent); border-bottom-color: var(--rg-accent); }
.modal-tab:disabled[b-enb7zt3m7r] { opacity: 0.45; cursor: not-allowed; }

/* Form */
.form-row[b-enb7zt3m7r] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-enb7zt3m7r] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-enb7zt3m7r] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-enb7zt3m7r] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-enb7zt3m7r] { flex: 2; }
.form-group label[b-enb7zt3m7r] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-enb7zt3m7r], .form-group select[b-enb7zt3m7r], .form-textarea[b-enb7zt3m7r] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-enb7zt3m7r], .form-group select:focus[b-enb7zt3m7r], .form-textarea:focus[b-enb7zt3m7r] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.form-group input[readonly][b-enb7zt3m7r] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); }
.form-textarea[b-enb7zt3m7r] { resize: vertical; font-family: inherit; }
.form-section-title[b-enb7zt3m7r] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); border-bottom: 1px solid var(--rg-border); padding-bottom: 0.3rem; margin-bottom: 0.5rem; margin-top: 0.75rem; }

/* Permisos sub-table */
.con-permisos-table[b-enb7zt3m7r] { width: 100%; border-collapse: collapse; font-size: 0.77rem; margin-top: 0.5rem; }
.con-permisos-table th[b-enb7zt3m7r] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.45rem 0.6rem; border-bottom: 2px solid var(--rg-border); font-size: 0.7rem; text-transform: uppercase; }
.con-permisos-table td[b-enb7zt3m7r] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.con-permisos-empty[b-enb7zt3m7r] { text-align: center; padding: 1.5rem; color: var(--rg-text-muted); font-size: 0.8rem; }
.con-permiso-add[b-enb7zt3m7r] { display: flex; gap: 0.5rem; margin-bottom: 0.75rem; align-items: flex-end; }
.con-permiso-add .form-group[b-enb7zt3m7r] { margin: 0; }

/* Nested modals */
.modal-backdrop-nested[b-enb7zt3m7r]  { z-index: 2000 !important; }
.modal-container-nested[b-enb7zt3m7r] { z-index: 2001 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-enb7zt3m7r] { padding: 0.75rem; }
    .crud-header[b-enb7zt3m7r] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-enb7zt3m7r] { display: none; }
    .con-filter-bar[b-enb7zt3m7r] { flex-direction: column; }
    .form-row[b-enb7zt3m7r] { flex-direction: column; }
    .form-row-3[b-enb7zt3m7r], .form-row-4[b-enb7zt3m7r] { grid-template-columns: 1fr 1fr; }
    .modal-lg[b-enb7zt3m7r] { width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-enb7zt3m7r] { padding: 0.75rem; }
    .modal-tabs[b-enb7zt3m7r] { overflow-x: auto; }
    .modal-tab[b-enb7zt3m7r] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Crctbauxiliarresumen_mrx.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kvcsnk8a1q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kvcsnk8a1q 0.3s ease-out; }
@keyframes slideUp-b-kvcsnk8a1q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kvcsnk8a1q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kvcsnk8a1q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kvcsnk8a1q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kvcsnk8a1q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kvcsnk8a1q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kvcsnk8a1q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kvcsnk8a1q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kvcsnk8a1q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kvcsnk8a1q] { filter: brightness(1.1); }
.btn-outline[b-kvcsnk8a1q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kvcsnk8a1q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kvcsnk8a1q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kvcsnk8a1q] { filter: brightness(1.1); }
.btn-icon[b-kvcsnk8a1q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kvcsnk8a1q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kvcsnk8a1q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kvcsnk8a1q] { color: #ef4444; }
.btn-delete:hover[b-kvcsnk8a1q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kvcsnk8a1q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kvcsnk8a1q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kvcsnk8a1q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kvcsnk8a1q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kvcsnk8a1q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kvcsnk8a1q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kvcsnk8a1q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kvcsnk8a1q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kvcsnk8a1q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kvcsnk8a1q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kvcsnk8a1q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kvcsnk8a1q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kvcsnk8a1q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kvcsnk8a1q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kvcsnk8a1q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kvcsnk8a1q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kvcsnk8a1q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kvcsnk8a1q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kvcsnk8a1q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kvcsnk8a1q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kvcsnk8a1q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kvcsnk8a1q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kvcsnk8a1q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kvcsnk8a1q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kvcsnk8a1q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kvcsnk8a1q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kvcsnk8a1q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kvcsnk8a1q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kvcsnk8a1q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kvcsnk8a1q] { display: block; }
.hide-on-cards[b-kvcsnk8a1q] { display: none !important; }
.show-on-cards[b-kvcsnk8a1q] { display: grid; }
.hide-on-grid[b-kvcsnk8a1q] { display: none !important; }

/* Badges */
.badge[b-kvcsnk8a1q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kvcsnk8a1q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kvcsnk8a1q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kvcsnk8a1q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kvcsnk8a1q] { text-align: center; }
.text-muted[b-kvcsnk8a1q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kvcsnk8a1q], .crud-empty-state[b-kvcsnk8a1q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kvcsnk8a1q] { font-size: 2rem; }
.crud-spinner[b-kvcsnk8a1q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kvcsnk8a1q 0.6s linear infinite; }
.crud-spinner-sm[b-kvcsnk8a1q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kvcsnk8a1q 0.6s linear infinite; }
@keyframes spin-b-kvcsnk8a1q { to { transform: rotate(360deg); } }
.spin[b-kvcsnk8a1q] { animation: spin-b-kvcsnk8a1q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kvcsnk8a1q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kvcsnk8a1q 0.15s ease-out; }
.modal-container[b-kvcsnk8a1q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kvcsnk8a1q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kvcsnk8a1q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kvcsnk8a1q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kvcsnk8a1q] { max-width: 420px; }
@keyframes fadeIn-b-kvcsnk8a1q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kvcsnk8a1q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kvcsnk8a1q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kvcsnk8a1q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kvcsnk8a1q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kvcsnk8a1q] { color: #dc2626; }
.modal-close[b-kvcsnk8a1q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kvcsnk8a1q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kvcsnk8a1q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kvcsnk8a1q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kvcsnk8a1q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kvcsnk8a1q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kvcsnk8a1q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kvcsnk8a1q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kvcsnk8a1q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kvcsnk8a1q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kvcsnk8a1q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kvcsnk8a1q] { flex: 2; }
.form-group label[b-kvcsnk8a1q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kvcsnk8a1q], .form-group select[b-kvcsnk8a1q], .form-textarea[b-kvcsnk8a1q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kvcsnk8a1q], .form-group select:focus[b-kvcsnk8a1q], .form-textarea:focus[b-kvcsnk8a1q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kvcsnk8a1q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kvcsnk8a1q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kvcsnk8a1q] { flex: 1; display: flex; align-items: center; }
.form-check[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kvcsnk8a1q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kvcsnk8a1q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kvcsnk8a1q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kvcsnk8a1q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kvcsnk8a1q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kvcsnk8a1q] { font-size: 3rem; }
.photo-placeholder span[b-kvcsnk8a1q] { font-size: 0.78rem; }
.photo-actions[b-kvcsnk8a1q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kvcsnk8a1q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kvcsnk8a1q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kvcsnk8a1q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kvcsnk8a1q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kvcsnk8a1q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kvcsnk8a1q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kvcsnk8a1q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kvcsnk8a1q] { filter: brightness(1.15); transform: scale(1.05); }
[b-kvcsnk8a1q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kvcsnk8a1q] { padding: 0.75rem; }
    .crud-header[b-kvcsnk8a1q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kvcsnk8a1q] { font-size: 1.1rem; }
    .btn-text[b-kvcsnk8a1q] { display: none; }
    .form-row[b-kvcsnk8a1q] { flex-direction: column; }
    .form-row-4[b-kvcsnk8a1q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kvcsnk8a1q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kvcsnk8a1q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kvcsnk8a1q] { padding: 0.75rem; }
    .modal-tabs[b-kvcsnk8a1q] { overflow-x: auto; }
    .modal-tab[b-kvcsnk8a1q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kvcsnk8a1q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kvcsnk8a1q] { display: grid !important; }
    .crud-cards-wrapper[b-kvcsnk8a1q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kvcsnk8a1q] { grid-template-columns: 1fr; }
    .card-details[b-kvcsnk8a1q] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kvcsnk8a1q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kvcsnk8a1q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kvcsnk8a1q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kvcsnk8a1q] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprAsientoDevengo.razor.rz.scp.css */
/* ============================================================
   FrmprAsientoDevengo — Estilos CRUD + Asientos Contables Devengo V2
   Base: Frmclientes.razor.css — SOLO tokens --rg-*
   ============================================================ */

.crud-container[b-7rhngqh7ke] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7rhngqh7ke 0.3s ease-out; }
@keyframes slideUp-b-7rhngqh7ke { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7rhngqh7ke] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7rhngqh7ke] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7rhngqh7ke] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7rhngqh7ke] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7rhngqh7ke] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7rhngqh7ke] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7rhngqh7ke] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7rhngqh7ke] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7rhngqh7ke] { filter: brightness(1.1); }
.btn-outline[b-7rhngqh7ke] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7rhngqh7ke] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-7rhngqh7ke] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-7rhngqh7ke] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.view-toggle-btn[b-7rhngqh7ke] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7rhngqh7ke] { background: rgba(34,197,94,0.1); color: #065f46; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-7rhngqh7ke]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-7rhngqh7ke] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-7rhngqh7ke] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-7rhngqh7ke]   { color: #fca5a5; }

/* Grid */
.crud-grid-wrapper[b-7rhngqh7ke] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-7rhngqh7ke] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7rhngqh7ke] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7rhngqh7ke] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7rhngqh7ke] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7rhngqh7ke] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7rhngqh7ke] { width: 120px; text-align: center; white-space: nowrap; }

/* Cards */
.crud-cards-wrapper[b-7rhngqh7ke] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 320px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7rhngqh7ke] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7rhngqh7ke] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7rhngqh7ke] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7rhngqh7ke] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7rhngqh7ke] { display: flex; gap: 0.35rem; flex-shrink: 0; flex-wrap: wrap; }
.card-title[b-7rhngqh7ke] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7rhngqh7ke] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7rhngqh7ke] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7rhngqh7ke] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7rhngqh7ke] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7rhngqh7ke] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border, #e2e8f0); }

/* Badges */
.badge[b-7rhngqh7ke] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }

/* Loading / Empty */
.crud-loading[b-7rhngqh7ke], .crud-empty-state[b-7rhngqh7ke] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7rhngqh7ke] { font-size: 2rem; }
.crud-spinner[b-7rhngqh7ke] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7rhngqh7ke 0.6s linear infinite; }
.crud-spinner-sm[b-7rhngqh7ke] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7rhngqh7ke 0.6s linear infinite; }
@keyframes spin-b-7rhngqh7ke { to { transform: rotate(360deg); } }
.spin[b-7rhngqh7ke] { animation: spin-b-7rhngqh7ke 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7rhngqh7ke] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7rhngqh7ke 0.15s ease-out; }
.modal-container[b-7rhngqh7ke] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7rhngqh7ke] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7rhngqh7ke 0.2s ease-out; }
.modal-sm[b-7rhngqh7ke] { max-width: 440px; }
@keyframes fadeIn-b-7rhngqh7ke { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7rhngqh7ke { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-7rhngqh7ke] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7rhngqh7ke] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-7rhngqh7ke] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7rhngqh7ke] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7rhngqh7ke] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7rhngqh7ke] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Utilities */
.font-mono[b-7rhngqh7ke] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7rhngqh7ke] { text-align: center; }
.text-right[b-7rhngqh7ke] { text-align: right; }
.text-muted[b-7rhngqh7ke] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Form check */
.form-check[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7rhngqh7ke] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* ── Barra de filtros ───────────────────────────────────────────────────── */

.dev-filters-bar[b-7rhngqh7ke] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.5rem;
}

.dev-filter-group[b-7rhngqh7ke] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 120px;
}

.dev-filter-group.dev-filter-wide[b-7rhngqh7ke] {
    min-width: 180px;
    flex: 1;
}

.dev-filter-group label[b-7rhngqh7ke] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted, #94a3b8);
}

.dev-filter-group input[b-7rhngqh7ke],
.dev-filter-group select[b-7rhngqh7ke] {
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s;
}

.dev-filter-group input:focus[b-7rhngqh7ke],
.dev-filter-group select:focus[b-7rhngqh7ke] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79,70,229,0.15);
}

.dev-filter-check[b-7rhngqh7ke] {
    display: flex;
    align-items: center;
    padding-bottom: 0.2rem;
}

/* ── Contador ───────────────────────────────────────────────────────────── */

.dev-count-bar[b-7rhngqh7ke] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.4rem;
}

.crud-count[b-7rhngqh7ke] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }

/* ── Badges de tipo ─────────────────────────────────────────────────────── */

.dev-tipo-ci[b-7rhngqh7ke] {
    background: rgba(59,130,246,0.12);
    color: #1d4ed8;
    border: 1px solid rgba(59,130,246,0.3);
}

.dev-tipo-cm[b-7rhngqh7ke] {
    background: rgba(139,92,246,0.12);
    color: #6d28d9;
    border: 1px solid rgba(139,92,246,0.3);
}

[data-mode="dark"] .dev-tipo-ci[b-7rhngqh7ke] { color: #93c5fd; }
[data-mode="dark"] .dev-tipo-cm[b-7rhngqh7ke] { color: #c4b5fd; }

/* ── Badges de estado ───────────────────────────────────────────────────── */

.dev-estado-enviado[b-7rhngqh7ke] {
    background: rgba(34,197,94,0.12);
    color: #065f46;
    border: 1px solid rgba(34,197,94,0.3);
}

.dev-estado-pendiente[b-7rhngqh7ke] {
    background: rgba(249,115,22,0.12);
    color: #9a3412;
    border: 1px solid rgba(249,115,22,0.3);
}

[data-mode="dark"] .dev-estado-enviado[b-7rhngqh7ke]  { color: #86efac; }
[data-mode="dark"] .dev-estado-pendiente[b-7rhngqh7ke] { color: #fdba74; }

/* ── Botón Enviar en tabla ──────────────────────────────────────────────── */

.dev-btn-enviar[b-7rhngqh7ke] {
    white-space: nowrap;
}

/* ── Ícono de tarjeta (tipo) ────────────────────────────────────────────── */

.dev-card-tipo-icon[b-7rhngqh7ke] {
    width: 38px;
    height: 38px;
    border-radius: 0.5rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
}

/* ── Modal de confirmación ──────────────────────────────────────────────── */

.dev-confirm-info[b-7rhngqh7ke] {
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 0.875rem;
}

.dev-confirm-row[b-7rhngqh7ke] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.3rem 0;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.8rem;
}

.dev-confirm-row:last-child[b-7rhngqh7ke] { border-bottom: none; }

.dev-confirm-label[b-7rhngqh7ke] {
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dev-confirm-value[b-7rhngqh7ke] {
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.82rem;
    font-weight: 500;
}

.dev-confirm-warning[b-7rhngqh7ke] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background: rgba(245,158,11,0.1);
    border: 1px solid rgba(245,158,11,0.3);
    border-radius: 0.4rem;
    padding: 0.6rem 0.75rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
    line-height: 1.45;
}

.dev-confirm-warning i[b-7rhngqh7ke] {
    color: var(--rg-warning, #f59e0b);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

[data-mode="dark"] .dev-confirm-warning[b-7rhngqh7ke] {
    background: rgba(245,158,11,0.08);
    color: var(--rg-text-secondary, #94a3b8);
}

/* ── Responsive ─────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    .crud-container[b-7rhngqh7ke] { padding: 0.75rem; }
    .crud-header[b-7rhngqh7ke] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7rhngqh7ke] { font-size: 1.1rem; }
    .btn-text[b-7rhngqh7ke] { display: none; }
    .dev-filters-bar[b-7rhngqh7ke] { gap: 0.45rem; }
    .dev-filter-group[b-7rhngqh7ke] { min-width: 100%; }
    .dev-filter-group.dev-filter-wide[b-7rhngqh7ke] { min-width: 100%; }
    .modal-dialog[b-7rhngqh7ke] { width: 98%; max-height: 95vh; }
    .modal-body[b-7rhngqh7ke] { padding: 0.75rem; }
    .crud-cards-wrapper[b-7rhngqh7ke] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .card-details[b-7rhngqh7ke] { flex-direction: column; gap: 0.35rem; }
    .dev-confirm-row[b-7rhngqh7ke] { flex-direction: column; align-items: flex-start; gap: 0.15rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-7rhngqh7ke] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-7rhngqh7ke] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-7rhngqh7ke] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-7rhngqh7ke] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-7rhngqh7ke] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7rhngqh7ke] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7rhngqh7ke] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7rhngqh7ke] { border-bottom: none; }
.help-section p[b-7rhngqh7ke] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-7rhngqh7ke], .help-section ol[b-7rhngqh7ke] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-7rhngqh7ke] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7rhngqh7ke] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-7rhngqh7ke] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-7rhngqh7ke] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-7rhngqh7ke] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-7rhngqh7ke] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-7rhngqh7ke] { padding-left: 1.1rem; }
.help-example li[b-7rhngqh7ke] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-7rhngqh7ke] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-7rhngqh7ke]  { color: #1d4ed8; }
.help-cm[b-7rhngqh7ke]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-7rhngqh7ke] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-7rhngqh7ke] { color: #fcd34d; }
.help-tip[b-7rhngqh7ke] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7rhngqh7ke] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7rhngqh7ke] { background: rgba(37,99,235,0.12); }
.help-steps[b-7rhngqh7ke] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-7rhngqh7ke] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-7rhngqh7ke] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-7rhngqh7ke] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-7rhngqh7ke] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-7rhngqh7ke] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-7rhngqh7ke] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-7rhngqh7ke] { background: rgba(255,255,255,0.04); }
.help-badge[b-7rhngqh7ke] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-7rhngqh7ke]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-7rhngqh7ke]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-7rhngqh7ke]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-7rhngqh7ke] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-7rhngqh7ke]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-7rhngqh7ke]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-7rhngqh7ke]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-7rhngqh7ke]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-7rhngqh7ke]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-7rhngqh7ke]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-7rhngqh7ke] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-7rhngqh7ke]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-7rhngqh7ke]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-7rhngqh7ke]     { color: #c4b5fd; }

/* ── KPI Cards CI/CM ────────────────────────────────────────────────────── */
.dev-kpi-row[b-7rhngqh7ke] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1rem; }
.dev-kpi-card[b-7rhngqh7ke] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.875rem 1rem; display: flex; flex-direction: column; gap: 0.15rem; position: relative; overflow: hidden; }
.dev-kpi-card[b-7rhngqh7ke]::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 4px 0 0 4px; }
.dev-kpi-label[b-7rhngqh7ke] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.dev-kpi-value[b-7rhngqh7ke] { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary); }
.dev-kpi-sub[b-7rhngqh7ke] { font-size: 0.68rem; color: var(--rg-text-muted); margin-top: 0.1rem; }
.dev-kpi-blue[b-7rhngqh7ke]::before  { background: var(--rg-primary); }
.dev-kpi-orange[b-7rhngqh7ke]::before{ background: var(--rg-warning); }
.dev-kpi-gray[b-7rhngqh7ke]::before  { background: var(--rg-text-muted); }
.dev-kpi-red[b-7rhngqh7ke]::before   { background: var(--rg-danger); }
.dev-kpi-green[b-7rhngqh7ke]::before { background: var(--rg-success); }
@media (max-width: 900px) { .dev-kpi-row[b-7rhngqh7ke] { grid-template-columns: repeat(2, 1fr); } }

/* ── Botón ojo en tabla ──────────────────────────────────────────────────── */
.dev-btn-codif[b-7rhngqh7ke] { color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.08); border: 1px solid rgba(79,70,229,0.2); margin-right: 0.3rem; }
.dev-btn-codif:hover[b-7rhngqh7ke] { background: rgba(79,70,229,0.15); border-color: rgba(79,70,229,0.4); }
[data-mode="dark"] .dev-btn-codif[b-7rhngqh7ke] { background: rgba(79,70,229,0.15); color: #a5b4fc; border-color: rgba(79,70,229,0.3); }

/* ── Tarjeta Voucher Codificación ───────────────────────────────────────── */
.dev-codif-card[b-7rhngqh7ke] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 1rem;
    width: 95%;
    max-width: 440px;
    box-shadow: 0 24px 64px rgba(0,0,0,0.18), 0 4px 16px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    animation: codifPop-b-7rhngqh7ke 0.22s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes codifPop-b-7rhngqh7ke {
    from { opacity: 0; transform: scale(0.92) translateY(12px); }
    to   { opacity: 1; transform: scale(1)    translateY(0); }
}

/* Cabecera */
.dev-codif-card-header[b-7rhngqh7ke] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.1rem 0.75rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    gap: 0.75rem;
}
.dev-codif-card-header-left[b-7rhngqh7ke] { display: flex; align-items: center; gap: 0.65rem; }
.dev-codif-card-icon[b-7rhngqh7ke] {
    width: 2.2rem; height: 2.2rem;
    background: rgba(79,70,229,0.1);
    border-radius: 0.6rem;
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
}
[data-mode="dark"] .dev-codif-card-icon[b-7rhngqh7ke] { background: rgba(79,70,229,0.2); color: #a5b4fc; }
.dev-codif-card-title[b-7rhngqh7ke] { font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.dev-codif-card-sub[b-7rhngqh7ke]   { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); margin-top: 0.05rem; }

/* Chips de metadatos */
.dev-codif-chips[b-7rhngqh7ke] {
    display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem;
    padding: 0.6rem 1.1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-codif-chip[b-7rhngqh7ke] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 0.15rem 0.55rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 1rem;
    font-size: 0.72rem; color: var(--rg-text-secondary, #475569);
}
.dev-codif-chip i[b-7rhngqh7ke] { color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; }

/* Fila de info (producto / monto / préstamos) */
.dev-codif-info-row[b-7rhngqh7ke] {
    display: flex; align-items: center;
    padding: 0.75rem 1.1rem;
    gap: 1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-codif-info-block[b-7rhngqh7ke] { display: flex; flex-direction: column; gap: 0.05rem; flex: 1; }
.dev-codif-info-block-right[b-7rhngqh7ke] { align-items: flex-end; }
.dev-codif-info-label[b-7rhngqh7ke] { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--rg-text-muted, #94a3b8); }
.dev-codif-info-val[b-7rhngqh7ke]   { font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); font-weight: 500; }
.dev-codif-monto[b-7rhngqh7ke]      { font-size: 1rem; color: var(--rg-text-primary, #1e293b); font-weight: 700; }

/* Separador "Partidas del asiento" */
.dev-codif-divider[b-7rhngqh7ke] {
    display: flex; align-items: center; gap: 0.6rem;
    padding: 0.55rem 1.1rem;
    font-size: 0.65rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.07em; color: var(--rg-text-muted, #94a3b8);
}
.dev-codif-divider[b-7rhngqh7ke]::before,
.dev-codif-divider[b-7rhngqh7ke]::after {
    content: ''; flex: 1;
    height: 1px; background: var(--rg-border, #e2e8f0);
}

/* Tarjetas DEBE / HABER */
.dev-codif-partida[b-7rhngqh7ke] {
    display: flex; align-items: center; gap: 0.8rem;
    margin: 0 1rem 0.5rem;
    padding: 0.75rem 0.9rem;
    border-radius: 0.6rem;
    border: 1px solid;
    transition: box-shadow 0.15s;
}
.dev-codif-partida:last-of-type[b-7rhngqh7ke] { margin-bottom: 0; }
.dev-codif-partida-debe[b-7rhngqh7ke]  { background: rgba(59,130,246,0.05); border-color: rgba(59,130,246,0.22); }
.dev-codif-partida-haber[b-7rhngqh7ke] { background: rgba(34,197,94,0.05);  border-color: rgba(34,197,94,0.22);  }
[data-mode="dark"] .dev-codif-partida-debe[b-7rhngqh7ke]  { background: rgba(59,130,246,0.1); border-color: rgba(59,130,246,0.3); }
[data-mode="dark"] .dev-codif-partida-haber[b-7rhngqh7ke] { background: rgba(34,197,94,0.1);  border-color: rgba(34,197,94,0.3); }

.dev-codif-partida-badge-wrap[b-7rhngqh7ke] { flex-shrink: 0; }
.dev-codif-partida-badge[b-7rhngqh7ke] {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    border-radius: 0.35rem;
    font-size: 0.65rem; font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.dev-debe-badge[b-7rhngqh7ke]  { background: rgba(59,130,246,0.15); color: #1d4ed8; border: 1px solid rgba(59,130,246,0.3); }
.dev-haber-badge[b-7rhngqh7ke] { background: rgba(34,197,94,0.15);  color: #166534; border: 1px solid rgba(34,197,94,0.3); }
[data-mode="dark"] .dev-debe-badge[b-7rhngqh7ke]  { color: #93c5fd; }
[data-mode="dark"] .dev-haber-badge[b-7rhngqh7ke] { color: #86efac; }

.dev-codif-partida-body[b-7rhngqh7ke] { flex: 1; min-width: 0; }
.dev-codif-partida-cuenta[b-7rhngqh7ke] { font-size: 0.78rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.dev-codif-partida-nombre[b-7rhngqh7ke] { font-size: 0.72rem; color: var(--rg-text-secondary, #475569); margin-top: 0.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dev-codif-partida-monto[b-7rhngqh7ke]  { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); flex-shrink: 0; text-align: right; }

/* Flecha entre DEBE y HABER */
.dev-codif-arrow[b-7rhngqh7ke] {
    display: flex; justify-content: center; align-items: center;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.75rem; padding: 0.05rem 0;
}

/* Advertencia sin cuenta */
.dev-codif-warning[b-7rhngqh7ke] {
    display: flex; align-items: flex-start; gap: 0.5rem;
    background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.3);
    border-radius: 0.5rem; padding: 0.6rem 0.85rem;
    margin: 0.6rem 1rem 0; font-size: 0.75rem; color: #92400e;
}
.dev-codif-warning i[b-7rhngqh7ke] { flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .dev-codif-warning[b-7rhngqh7ke] { color: #fcd34d; background: rgba(245,158,11,0.12); }

/* Footer de la tarjeta */
.dev-codif-card-footer[b-7rhngqh7ke] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    margin-top: 0.75rem;
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprConfigDevengo.razor.rz.scp.css */
/* ============================================================
   FrmprConfigDevengo — Configuracion Devengo V2
   Estilos CRUD + Switch + Tabla productos
   ============================================================ */

.crud-container[b-nadlkv18iw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-nadlkv18iw 0.3s ease-out; }
@keyframes slideUp-b-nadlkv18iw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-nadlkv18iw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-nadlkv18iw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-nadlkv18iw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-nadlkv18iw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-nadlkv18iw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-nadlkv18iw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-nadlkv18iw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-nadlkv18iw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-nadlkv18iw] { filter: brightness(1.1); }
.btn-outline[b-nadlkv18iw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-nadlkv18iw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-nadlkv18iw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-nadlkv18iw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-nadlkv18iw] { background: rgba(79, 70, 229, 0.1); }

/* Alert */
.crud-alert[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-nadlkv18iw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-nadlkv18iw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-nadlkv18iw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-nadlkv18iw] { background: rgba(22,163,74,0.15); color: #86efac; border-color: rgba(22,163,74,0.3); }
[data-mode="dark"] .crud-alert.error[b-nadlkv18iw] { background: rgba(220,38,38,0.15); color: #fca5a5; border-color: rgba(220,38,38,0.3); }

/* Grid */
.crud-grid-wrapper[b-nadlkv18iw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 340px); margin-top: 0.5rem; }
.crud-table[b-nadlkv18iw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-nadlkv18iw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-nadlkv18iw] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-nadlkv18iw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-nadlkv18iw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-nadlkv18iw] { width: 60px; text-align: center; }
.text-center[b-nadlkv18iw] { text-align: center; }
.text-muted[b-nadlkv18iw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.72rem; }
.font-mono[b-nadlkv18iw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Badges */
.badge[b-nadlkv18iw] { display: inline-flex; align-items: center; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-nadlkv18iw] { background: rgba(22,163,74,0.12); color: #166534; }
.badge-no[b-nadlkv18iw]  { background: rgba(100,116,139,0.12); color: #64748b; }
[data-mode="dark"] .badge-yes[b-nadlkv18iw] { color: #86efac; }
[data-mode="dark"] .badge-no[b-nadlkv18iw]  { color: #94a3b8; }

/* Loading / Empty */
.crud-loading[b-nadlkv18iw], .crud-empty-state[b-nadlkv18iw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-nadlkv18iw] { font-size: 2rem; }
.crud-spinner[b-nadlkv18iw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-nadlkv18iw 0.6s linear infinite; }
.crud-spinner-sm[b-nadlkv18iw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-nadlkv18iw 0.6s linear infinite; }
@keyframes spin-b-nadlkv18iw { to { transform: rotate(360deg); } }
.spin[b-nadlkv18iw] { animation: spin-b-nadlkv18iw 0.8s linear infinite; }

/* Switch card */
.dev-switch-card[b-nadlkv18iw] { display: flex; align-items: center; justify-content: space-between; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; padding: 1rem 1.25rem; margin-bottom: 1rem; gap: 1rem; flex-wrap: wrap; }
.dev-switch-info[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.75rem; }
.dev-switch-icon[b-nadlkv18iw] { font-size: 2rem; color: var(--rg-text-muted, #94a3b8); transition: color 0.2s; }
.dev-switch-icon.active[b-nadlkv18iw] { color: #16a34a; }
.dev-switch-title[b-nadlkv18iw] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.dev-switch-sub[b-nadlkv18iw] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); max-width: 480px; }

/* Toggle */
.dev-toggle-label[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; user-select: none; }
.dev-toggle-label input[type="checkbox"][b-nadlkv18iw] { display: none; }
.dev-toggle-track[b-nadlkv18iw] { position: relative; width: 3rem; height: 1.5rem; background: var(--rg-border, #cbd5e1); border-radius: 9999px; transition: background 0.2s; flex-shrink: 0; }
.dev-toggle-label input:checked + .dev-toggle-track[b-nadlkv18iw] { background: #16a34a; }
.dev-toggle-thumb[b-nadlkv18iw] { position: absolute; top: 0.2rem; left: 0.2rem; width: 1.1rem; height: 1.1rem; background: #fff; border-radius: 50%; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.2); }
.dev-toggle-label input:checked + .dev-toggle-track .dev-toggle-thumb[b-nadlkv18iw] { transform: translateX(1.5rem); }
.dev-toggle-text[b-nadlkv18iw] { font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); width: 4.5rem; }

/* Section header */
.dev-section-header[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); padding: 0.5rem 0; border-bottom: 1px solid var(--rg-border, #e2e8f0); margin-bottom: 0; }
.dev-section-header i[b-nadlkv18iw] { color: var(--rg-accent, #4f46e5); }
.dev-section-header small[b-nadlkv18iw] { margin-left: 0.5rem; font-weight: 400; font-size: 0.7rem; }

/* Info box */
.dev-info-box[b-nadlkv18iw] { display: flex; align-items: flex-start; gap: 0.5rem; background: rgba(37,99,235,0.06); border-left: 3px solid var(--rg-accent, #4f46e5); border-radius: 0 0.375rem 0.375rem 0; padding: 0.625rem 0.75rem; font-size: 0.78rem; color: var(--rg-text-secondary, #475569); margin-top: 0.75rem; }
.dev-info-box i[b-nadlkv18iw] { color: var(--rg-accent, #4f46e5); flex-shrink: 0; margin-top: 0.1rem; }

/* ── Chips de cuenta en la tabla ─────────────────────────────────────────── */
.dev-cuenta-chip[b-nadlkv18iw] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.12rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 600;
    white-space: nowrap;
}
.dev-cuenta-chip-ok[b-nadlkv18iw] {
    background: rgba(22,163,74,0.1);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.2);
}
[data-mode="dark"] .dev-cuenta-chip-ok[b-nadlkv18iw]  { color: #86efac; background: rgba(22,163,74,0.15); }
.dev-cuenta-chip-falta[b-nadlkv18iw] {
    background: rgba(220,38,38,0.08);
    color: #991b1b;
    border: 1px solid rgba(220,38,38,0.2);
}
[data-mode="dark"] .dev-cuenta-chip-falta[b-nadlkv18iw] { color: #fca5a5; background: rgba(220,38,38,0.15); }

/* Indicador completitud columna "Cuentas" */
.dev-ctb-status[b-nadlkv18iw] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.1rem 0.45rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    white-space: nowrap;
}
.dev-ctb-ok[b-nadlkv18iw]    { background: rgba(22,163,74,0.1);   color: #166534; border: 1px solid rgba(22,163,74,0.2); }
.dev-ctb-falta[b-nadlkv18iw] { background: rgba(220,38,38,0.08);  color: #991b1b; border: 1px solid rgba(220,38,38,0.2); }
.dev-ctb-na[b-nadlkv18iw]    { background: var(--rg-bg-subtle);    color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .dev-ctb-ok[b-nadlkv18iw]    { color: #86efac;  background: rgba(22,163,74,0.15); }
[data-mode="dark"] .dev-ctb-falta[b-nadlkv18iw] { color: #fca5a5;  background: rgba(220,38,38,0.15); }

/* Fila con configuración incompleta — borde rojo visible */
.dev-row-incompleto td[b-nadlkv18iw] {
    background: rgba(220,38,38,0.04) !important;
    border-top:    1.5px solid rgba(220,38,38,0.45) !important;
    border-bottom: 1.5px solid rgba(220,38,38,0.45) !important;
}
.dev-row-incompleto td:first-child[b-nadlkv18iw] {
    border-left: 3px solid #dc2626 !important;
    border-radius: 4px 0 0 4px;
}
.dev-row-incompleto td:last-child[b-nadlkv18iw] {
    border-right: 1.5px solid rgba(220,38,38,0.45) !important;
    border-radius: 0 4px 4px 0;
}
[data-mode="dark"] .dev-row-incompleto td[b-nadlkv18iw] {
    background: rgba(220,38,38,0.09) !important;
    border-top-color:    rgba(220,38,38,0.5) !important;
    border-bottom-color: rgba(220,38,38,0.5) !important;
}
[data-mode="dark"] .dev-row-incompleto td:first-child[b-nadlkv18iw] { border-left-color: #f87171 !important; }
[data-mode="dark"] .dev-row-incompleto td:last-child[b-nadlkv18iw]  { border-right-color: rgba(220,38,38,0.5) !important; }

/* Botón ojo ver cuentas */
.dev-btn-ver-cuentas[b-nadlkv18iw] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37,99,235,0.2);
    border-radius: 0.4rem;
    padding: 0.3rem 0.5rem;
    cursor: pointer;
    font-size: 0.82rem;
    transition: all 0.15s;
}
.dev-btn-ver-cuentas:hover[b-nadlkv18iw] { background: rgba(37,99,235,0.15); border-color: rgba(37,99,235,0.4); }
[data-mode="dark"] .dev-btn-ver-cuentas[b-nadlkv18iw] { background: rgba(37,99,235,0.12); color: #93c5fd; border-color: rgba(37,99,235,0.25); }
[data-mode="dark"] .dev-btn-ver-cuentas:hover[b-nadlkv18iw] { background: rgba(37,99,235,0.22); }

/* ── Modal ver cuentas (solo lectura) ────────────────────────────────────── */
.dev-cuentas-modal[b-nadlkv18iw] { max-width: 480px !important; }
.modal-body[b-nadlkv18iw] { padding: 0 !important; overflow-y: auto; flex: 1; }

.dev-cuentas-alerta[b-nadlkv18iw] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background: rgba(220,38,38,0.07);
    border-left: 4px solid #dc2626;
    padding: 0.65rem 1rem;
    font-size: 0.78rem;
    color: #991b1b;
    line-height: 1.5;
}
.dev-cuentas-alerta i[b-nadlkv18iw] { flex-shrink: 0; margin-top: 0.1rem; color: #dc2626; }
[data-mode="dark"] .dev-cuentas-alerta[b-nadlkv18iw] { background: rgba(220,38,38,0.12); color: #fca5a5; }
[data-mode="dark"] .dev-cuentas-alerta i[b-nadlkv18iw] { color: #fca5a5; }

.dev-cuentas-seccion[b-nadlkv18iw] {
    padding: 0.75rem 1.1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-cuentas-seccion:last-of-type[b-nadlkv18iw] { border-bottom: none; }

.dev-cuentas-seccion-titulo[b-nadlkv18iw] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted, #94a3b8);
    margin-bottom: 0.6rem;
}
.dev-cuentas-seccion-titulo i[b-nadlkv18iw] { color: var(--rg-accent, #2563eb); }

.dev-cuentas-fila[b-nadlkv18iw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
}

.dev-cuentas-campo[b-nadlkv18iw] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.5rem 0.7rem;
}
[data-mode="dark"] .dev-cuentas-campo[b-nadlkv18iw] { background: rgba(255,255,255,0.04); }

.dev-cuentas-label[b-nadlkv18iw] {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rg-text-muted, #94a3b8);
}

.dev-cuentas-valor[b-nadlkv18iw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.82rem;
    font-weight: 600;
}
.dev-cuentas-valor-ok[b-nadlkv18iw]    { color: var(--rg-text-primary, #1e293b); }
.dev-cuentas-valor-falta[b-nadlkv18iw] { color: #991b1b; font-size: 0.75rem; }
[data-mode="dark"] .dev-cuentas-valor-ok[b-nadlkv18iw]    { color: var(--rg-text-primary); }
[data-mode="dark"] .dev-cuentas-valor-falta[b-nadlkv18iw] { color: #fca5a5; }

.dev-cuentas-nota[b-nadlkv18iw] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 0.6rem 1.1rem;
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
    background: var(--rg-bg-subtle, #f8fafc);
    border-top: 1px solid var(--rg-border, #e2e8f0);
    line-height: 1.5;
}
.dev-cuentas-nota i[b-nadlkv18iw] { flex-shrink: 0; margin-top: 0.1rem; color: var(--rg-accent, #2563eb); }

/* Modal */
.modal-backdrop[b-nadlkv18iw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-nadlkv18iw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-nadlkv18iw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 560px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-header[b-nadlkv18iw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-nadlkv18iw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-nadlkv18iw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-nadlkv18iw] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-nadlkv18iw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-nadlkv18iw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-nadlkv18iw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-nadlkv18iw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-nadlkv18iw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-nadlkv18iw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-nadlkv18iw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

@media (max-width: 768px) {
    .crud-container[b-nadlkv18iw] { padding: 0.75rem; }
    .dev-switch-card[b-nadlkv18iw] { flex-direction: column; align-items: flex-start; }
    .form-row[b-nadlkv18iw] { flex-direction: column; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-nadlkv18iw] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-nadlkv18iw] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-nadlkv18iw] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-nadlkv18iw] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-nadlkv18iw] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-nadlkv18iw] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-nadlkv18iw] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-nadlkv18iw] { border-bottom: none; }
.help-section p[b-nadlkv18iw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-nadlkv18iw], .help-section ol[b-nadlkv18iw] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-nadlkv18iw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-nadlkv18iw] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-nadlkv18iw] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-nadlkv18iw] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-nadlkv18iw] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-nadlkv18iw] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-nadlkv18iw] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-nadlkv18iw] { padding-left: 1.1rem; }
.help-example li[b-nadlkv18iw] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-nadlkv18iw] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-nadlkv18iw]  { color: #1d4ed8; }
.help-cm[b-nadlkv18iw]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-nadlkv18iw] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-nadlkv18iw] { color: #fcd34d; }
.help-tip[b-nadlkv18iw] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-nadlkv18iw] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-nadlkv18iw] { background: rgba(37,99,235,0.12); }
.help-steps[b-nadlkv18iw] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-nadlkv18iw] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-nadlkv18iw] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-nadlkv18iw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-nadlkv18iw] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-nadlkv18iw] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-nadlkv18iw] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-nadlkv18iw] { background: rgba(255,255,255,0.04); }
.help-badge[b-nadlkv18iw] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-nadlkv18iw]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-nadlkv18iw]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-nadlkv18iw]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-nadlkv18iw] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-nadlkv18iw]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-nadlkv18iw]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-nadlkv18iw]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-nadlkv18iw]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-nadlkv18iw]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-nadlkv18iw]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-nadlkv18iw] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-nadlkv18iw]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-nadlkv18iw]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-nadlkv18iw]     { color: #c4b5fd; }

/* ── Tarjeta Hora Worker ─────────────────────────────────────────────────── */
.dev-hora-card[b-nadlkv18iw] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
    margin-bottom: 1rem;
    transition: opacity 0.2s;
}
.dev-hora-card.dev-hora-locked[b-nadlkv18iw] {
    opacity: 0.6;
    pointer-events: none;
}

.dev-hora-card-header[b-nadlkv18iw] {
    padding: 0.75rem 1.1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-hora-title-row[b-nadlkv18iw] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.dev-hora-icon[b-nadlkv18iw] {
    font-size: 1.25rem;
    color: var(--rg-accent, #2563eb);
    flex-shrink: 0;
}
.dev-hora-title[b-nadlkv18iw] {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
}
.dev-hora-sub[b-nadlkv18iw] {
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
}
.dev-hora-badge-ok[b-nadlkv18iw] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: rgba(22,163,74,0.1);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.25);
    border-radius: 1rem;
    padding: 0.15rem 0.55rem;
    font-size: 0.68rem;
    font-weight: 700;
}
[data-mode="dark"] .dev-hora-badge-ok[b-nadlkv18iw] { color: #86efac; background: rgba(22,163,74,0.15); }

.dev-hora-badge-locked[b-nadlkv18iw] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: rgba(100,116,139,0.1);
    color: var(--rg-text-muted, #94a3b8);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 1rem;
    padding: 0.15rem 0.55rem;
    font-size: 0.68rem;
    font-weight: 700;
}

.dev-hora-body[b-nadlkv18iw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    padding: 1rem 1.1rem;
}
@media (max-width: 640px) {
    .dev-hora-body[b-nadlkv18iw] { grid-template-columns: 1fr; }
}

/* Selector izquierdo */
.dev-hora-selector-wrap[b-nadlkv18iw] { display: flex; flex-direction: column; gap: 0.6rem; }
.dev-hora-label[b-nadlkv18iw] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-secondary, #475569);
}
.dev-hora-select-row[b-nadlkv18iw] { display: flex; gap: 0.5rem; align-items: center; }
.dev-hora-select[b-nadlkv18iw] {
    flex: 1;
    padding: 0.45rem 0.65rem;
    background: var(--rg-bg-input, #fff);
    color: var(--rg-text-primary, #1e293b);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    font-size: 0.88rem;
    font-weight: 700;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    cursor: pointer;
    outline: none;
    transition: border-color 0.15s;
}
.dev-hora-select:focus[b-nadlkv18iw] { border-color: var(--rg-accent, #2563eb); box-shadow: 0 0 0 2px rgba(37,99,235,0.15); }
.dev-hora-select:disabled[b-nadlkv18iw] { opacity: 0.55; cursor: not-allowed; }
.dev-hora-save-btn[b-nadlkv18iw] { white-space: nowrap; }

.dev-hora-note[b-nadlkv18iw] {
    display: flex;
    gap: 0.4rem;
    align-items: flex-start;
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
    background: rgba(37,99,235,0.05);
    border: 1px solid rgba(37,99,235,0.15);
    border-radius: 0.4rem;
    padding: 0.5rem 0.65rem;
    line-height: 1.5;
}
.dev-hora-note i[b-nadlkv18iw] { color: var(--rg-accent, #2563eb); flex-shrink: 0; margin-top: 0.1rem; }
[data-mode="dark"] .dev-hora-note[b-nadlkv18iw] { background: rgba(37,99,235,0.1); border-color: rgba(37,99,235,0.2); }

/* Preview derecho */
.dev-hora-preview[b-nadlkv18iw] {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    align-items: flex-start;
}
.dev-hora-clock[b-nadlkv18iw] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.6rem;
    padding: 0.5rem 1rem;
    font-size: 1.3rem;
    font-weight: 800;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    color: var(--rg-accent, #2563eb);
}
.dev-hora-clock i[b-nadlkv18iw] { font-size: 1.1rem; }
[data-mode="dark"] .dev-hora-clock[b-nadlkv18iw] {
    background: rgba(37,99,235,0.12);
    border-color: rgba(37,99,235,0.25);
    color: #93c5fd;
}

/* Timeline */
.dev-hora-timeline[b-nadlkv18iw] {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
}
.dev-hora-tl-item[b-nadlkv18iw] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.3rem 0;
    position: relative;
}
.dev-hora-tl-item:not(:last-child)[b-nadlkv18iw]::before {
    content: "";
    position: absolute;
    left: 0.34rem;
    top: 1rem;
    bottom: -0.3rem;
    width: 2px;
    background: var(--rg-border, #e2e8f0);
}
.dev-hora-tl-dot[b-nadlkv18iw] {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    background: var(--rg-border, #cbd5e1);
    flex-shrink: 0;
    margin-top: 0.2rem;
}
.dev-hora-tl-dot-active[b-nadlkv18iw] {
    background: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,0.2);
}
.dev-hora-tl-text[b-nadlkv18iw] {
    font-size: 0.72rem;
    color: var(--rg-text-secondary, #475569);
    line-height: 1.4;
}
.dev-hora-tl-active .dev-hora-tl-text[b-nadlkv18iw] { color: var(--rg-text-primary, #1e293b); font-weight: 600; }
.dev-hora-tl-text small[b-nadlkv18iw] { font-size: 0.65rem; color: var(--rg-text-muted, #94a3b8); }

/* Etiqueta condicional para items de la línea de tiempo (ej: "si es último día del mes") */
.dev-hora-tl-cond[b-nadlkv18iw] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rg-accent, #2563eb);
    background: rgba(37,99,235,0.12);
    padding: 0.1rem 0.45rem;
    border-radius: 1rem;
    margin-left: 0.3rem;
}
[data-mode="dark"] .dev-hora-tl-cond[b-nadlkv18iw] { color: #93c5fd; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprDevengoAuditoria.razor.rz.scp.css */
/* ============================================================
   FrmprDevengoAuditoria — Estilos CRUD + Auditoría Devengo V2
   Base: Frmclientes.razor.css — SOLO tokens --rg-*
   ============================================================ */

.crud-container[b-vu2kexxl81] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vu2kexxl81 0.3s ease-out; }
@keyframes slideUp-b-vu2kexxl81 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vu2kexxl81] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vu2kexxl81] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vu2kexxl81] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vu2kexxl81] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vu2kexxl81] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vu2kexxl81] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vu2kexxl81] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vu2kexxl81] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vu2kexxl81] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vu2kexxl81] { filter: brightness(1.1); }
.btn-outline[b-vu2kexxl81] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vu2kexxl81] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-vu2kexxl81] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vu2kexxl81] { background: rgba(34,197,94,0.1); color: #065f46; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-vu2kexxl81]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-vu2kexxl81] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-vu2kexxl81] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-vu2kexxl81]   { color: #fca5a5; }

/* Grid */
.crud-grid-wrapper[b-vu2kexxl81] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vu2kexxl81] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vu2kexxl81] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vu2kexxl81] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vu2kexxl81] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vu2kexxl81] { background: var(--rg-bg-hover, #f8fafc); }

/* Loading / Empty */
.crud-loading[b-vu2kexxl81], .crud-empty-state[b-vu2kexxl81] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vu2kexxl81] { font-size: 2rem; }
.crud-spinner[b-vu2kexxl81] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vu2kexxl81 0.6s linear infinite; }
@keyframes spin-b-vu2kexxl81 { to { transform: rotate(360deg); } }
.spin[b-vu2kexxl81] { animation: spin-b-vu2kexxl81 0.8s linear infinite; }

/* Utilities */
.font-mono[b-vu2kexxl81] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vu2kexxl81] { text-align: center; }
.text-right[b-vu2kexxl81] { text-align: right; }
.text-muted[b-vu2kexxl81] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* ── Paneles de auditoría ───────────────────────────────────────────────── */

.dev-audit-panel[b-vu2kexxl81] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    margin-bottom: 1rem;
    overflow: hidden;
}

.dev-audit-header[b-vu2kexxl81] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    gap: 0.75rem;
    flex-wrap: wrap;
}

.dev-audit-header-left[b-vu2kexxl81] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dev-audit-title[b-vu2kexxl81] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
}

.dev-audit-desc[b-vu2kexxl81] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0.625rem 1.1rem 0.75rem;
    line-height: 1.5;
}

.dev-audit-desc code[b-vu2kexxl81] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    padding: 0.1rem 0.35rem;
    border-radius: 0.25rem;
    border: 1px solid var(--rg-border, #e2e8f0);
}

.dev-audit-grid-wrapper[b-vu2kexxl81] {
    margin: 0 1.1rem 1rem;
    max-height: 280px;
}

/* ── Badges de conteo ────────────────────────────────────────────────────── */

.dev-audit-badge[b-vu2kexxl81] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}

.dev-audit-badge-red[b-vu2kexxl81] {
    background: rgba(239,68,68,0.12);
    color: #b91c1c;
    border: 1px solid rgba(239,68,68,0.3);
}

.dev-audit-badge-yellow[b-vu2kexxl81] {
    background: rgba(245,158,11,0.12);
    color: #92400e;
    border: 1px solid rgba(245,158,11,0.3);
}

.dev-audit-badge-orange[b-vu2kexxl81] {
    background: rgba(249,115,22,0.12);
    color: #9a3412;
    border: 1px solid rgba(249,115,22,0.3);
}

[data-mode="dark"] .dev-audit-badge-red[b-vu2kexxl81]    { color: #fca5a5; }
[data-mode="dark"] .dev-audit-badge-yellow[b-vu2kexxl81] { color: #fde68a; }
[data-mode="dark"] .dev-audit-badge-orange[b-vu2kexxl81] { color: #fdba74; }

/* ── Chip "Sin hallazgos" ─────────────────────────────────────────────── */

.dev-ok-chip[b-vu2kexxl81] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0 1.1rem 1rem;
    padding: 0.35rem 0.85rem;
    border-radius: 1rem;
    font-size: 0.78rem;
    font-weight: 600;
    background: rgba(34,197,94,0.12);
    color: #065f46;
    border: 1px solid rgba(34,197,94,0.3);
}

[data-mode="dark"] .dev-ok-chip[b-vu2kexxl81] { color: #86efac; }

/* ── Monto en rojo ──────────────────────────────────────────────────────── */

.dev-monto-rojo[b-vu2kexxl81] {
    color: var(--rg-danger, #ef4444);
    font-weight: 700;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.76rem;
}

/* ── Celda cliente ──────────────────────────────────────────────────────── */

.dev-cliente-cell[b-vu2kexxl81] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.dev-cliente-id[b-vu2kexxl81] {
    font-size: 0.65rem;
    font-weight: 600;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    color: var(--rg-text-muted, #94a3b8);
}

/* ── Badge producto inactivo ────────────────────────────────────────────── */

.dev-badge-inactivo[b-vu2kexxl81] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0.45rem;
    background: rgba(249,115,22,0.1);
    color: #9a3412;
    border-radius: 0.375rem;
    font-size: 0.72rem;
    font-weight: 600;
    border: 1px solid rgba(249,115,22,0.25);
}

[data-mode="dark"] .dev-badge-inactivo[b-vu2kexxl81] { color: #fdba74; }

/* ── Responsive ─────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    .crud-container[b-vu2kexxl81] { padding: 0.75rem; }
    .crud-header[b-vu2kexxl81] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vu2kexxl81] { font-size: 1.1rem; }
    .btn-text[b-vu2kexxl81] { display: none; }
    .dev-audit-grid-wrapper[b-vu2kexxl81] { margin: 0 0.5rem 0.75rem; max-height: 220px; }
    .dev-audit-header[b-vu2kexxl81] { flex-direction: column; align-items: flex-start; }
    .dev-audit-desc[b-vu2kexxl81] { margin-left: 0.75rem; margin-right: 0.75rem; }
    .dev-ok-chip[b-vu2kexxl81] { margin-left: 0.75rem; }
}

/* ── Modal ───────────────────────────────────────────────────────────────── */
.modal-backdrop[b-vu2kexxl81] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-vu2kexxl81] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vu2kexxl81] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-header[b-vu2kexxl81] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vu2kexxl81] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-vu2kexxl81] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vu2kexxl81] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-vu2kexxl81] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-vu2kexxl81] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-vu2kexxl81] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-vu2kexxl81] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-vu2kexxl81] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-vu2kexxl81] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-vu2kexxl81] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-vu2kexxl81] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-vu2kexxl81] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-vu2kexxl81] { border-bottom: none; }
.help-section p[b-vu2kexxl81] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-vu2kexxl81], .help-section ol[b-vu2kexxl81] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-vu2kexxl81] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-vu2kexxl81] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-vu2kexxl81] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-vu2kexxl81] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-vu2kexxl81] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-vu2kexxl81] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-vu2kexxl81] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-vu2kexxl81] { padding-left: 1.1rem; }
.help-example li[b-vu2kexxl81] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-vu2kexxl81] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-vu2kexxl81]  { color: #1d4ed8; }
.help-cm[b-vu2kexxl81]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-vu2kexxl81] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-vu2kexxl81] { color: #fcd34d; }
.help-tip[b-vu2kexxl81] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-vu2kexxl81] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-vu2kexxl81] { background: rgba(37,99,235,0.12); }
.help-steps[b-vu2kexxl81] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-vu2kexxl81] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-vu2kexxl81] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-vu2kexxl81] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-vu2kexxl81] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-vu2kexxl81] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-vu2kexxl81] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-vu2kexxl81] { background: rgba(255,255,255,0.04); }
.help-badge[b-vu2kexxl81] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-vu2kexxl81]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-vu2kexxl81]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-vu2kexxl81]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-vu2kexxl81] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-vu2kexxl81]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-vu2kexxl81]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-vu2kexxl81]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-vu2kexxl81]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-vu2kexxl81]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-vu2kexxl81]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-vu2kexxl81] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-vu2kexxl81]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-vu2kexxl81]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-vu2kexxl81]     { color: #c4b5fd; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprDevengoEjecutar.razor.rz.scp.css */
/* ============================================================
   FrmprDevengoEjecutar — Ejecutar Backfill Devengo V2
   ============================================================ */

/* ── Indicador de progreso animado ───────────────────────────────────────── */

.dev-progress-wrap[b-9m1im4kpil] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    padding: 1.75rem 1.25rem 1.5rem;
    text-align: center;
    animation: devFadeIn-b-9m1im4kpil 0.3s ease;
}
@keyframes devFadeIn-b-9m1im4kpil { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Ícono central con anillos de pulso */
.dev-progress-icon[b-9m1im4kpil] {
    position: relative;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dev-pulse-ring[b-9m1im4kpil] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(37,99,235,0.35);
    animation: devPulse-b-9m1im4kpil 2s ease-out infinite;
}
.dev-pulse-ring-2[b-9m1im4kpil] {
    animation-delay: 0.75s;
}
@keyframes devPulse-b-9m1im4kpil {
    0%   { transform: scale(1);    opacity: 0.8; }
    70%  { transform: scale(1.55); opacity: 0;   }
    100% { transform: scale(1.55); opacity: 0;   }
}

.dev-progress-glyph[b-9m1im4kpil] {
    font-size: 2rem;
    color: var(--rg-accent, #2563eb);
    animation: devGear-b-9m1im4kpil 3s linear infinite;
    position: relative;
    z-index: 1;
}
@keyframes devGear-b-9m1im4kpil { to { transform: rotate(360deg); } }

/* Textos */
.dev-progress-title[b-9m1im4kpil] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    background: linear-gradient(90deg, #1a3a5c, #2563eb, #1a3a5c);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: devShine-b-9m1im4kpil 2.5s linear infinite;
}
@keyframes devShine-b-9m1im4kpil { to { background-position: 200% center; } }

.dev-progress-subtitle[b-9m1im4kpil] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
    margin-top: -0.4rem;
}

/* Contador */
.dev-progress-timer[b-9m1im4kpil] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 2rem;
    padding: 0.3rem 0.85rem;
    font-size: 0.88rem;
    font-weight: 700;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    color: var(--rg-accent, #2563eb);
}
.dev-progress-timer i[b-9m1im4kpil] { font-size: 0.85rem; }

/* Fases */
.dev-phases[b-9m1im4kpil] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    text-align: left;
}

.dev-phase[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    transition: all 0.4s ease;
    background: var(--rg-bg-subtle, #f8fafc);
}
.dev-phase.pending[b-9m1im4kpil] {
    opacity: 0.4;
    border-color: transparent;
}
.dev-phase.active[b-9m1im4kpil] {
    background: rgba(37,99,235,0.07);
    border-color: rgba(37,99,235,0.25);
    opacity: 1;
}
.dev-phase.done[b-9m1im4kpil] {
    background: rgba(22,163,74,0.06);
    border-color: rgba(22,163,74,0.2);
    opacity: 1;
}

/* Punto indicador */
.dev-phase-dot[b-9m1im4kpil] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--rg-border, #e2e8f0);
    transition: all 0.4s ease;
}
.dev-phase.active .dev-phase-dot[b-9m1im4kpil] {
    background: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 3px rgba(37,99,235,0.25);
    animation: devDotPulse-b-9m1im4kpil 1s ease infinite;
}
.dev-phase.done .dev-phase-dot[b-9m1im4kpil] { background: #16a34a; }
@keyframes devDotPulse-b-9m1im4kpil {
    0%, 100% { box-shadow: 0 0 0 3px rgba(37,99,235,0.25); }
    50%       { box-shadow: 0 0 0 6px rgba(37,99,235,0.1);  }
}

.dev-phase-info[b-9m1im4kpil] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}
.dev-phase-label[b-9m1im4kpil] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-primary, #1e293b);
}
.dev-phase.active .dev-phase-label[b-9m1im4kpil] { color: var(--rg-accent, #2563eb); }
.dev-phase.done   .dev-phase-label[b-9m1im4kpil] { color: #16a34a; }
.dev-phase-desc[b-9m1im4kpil] {
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
}
.dev-phase-check[b-9m1im4kpil] {
    color: #16a34a;
    font-size: 0.9rem;
    flex-shrink: 0;
}

/* Barra de progreso indeterminada */
.dev-progress-bar-wrap[b-9m1im4kpil] { width: 100%; }
.dev-progress-bar-track[b-9m1im4kpil] {
    width: 100%;
    height: 5px;
    background: var(--rg-border, #e2e8f0);
    border-radius: 3px;
    overflow: hidden;
}
.dev-progress-bar-fill[b-9m1im4kpil] {
    height: 100%;
    width: 40%;
    background: linear-gradient(90deg, #1a3a5c, #2563eb, #60a5fa);
    border-radius: 3px;
    animation: devBar-b-9m1im4kpil 1.8s ease-in-out infinite;
}
@keyframes devBar-b-9m1im4kpil {
    0%   { transform: translateX(-120%); }
    100% { transform: translateX(300%);  }
}

.dev-progress-note[b-9m1im4kpil] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    font-style: italic;
}

/* Tema oscuro */
[data-mode="dark"] .dev-progress-title[b-9m1im4kpil] {
    background: linear-gradient(90deg, #93c5fd, #bfdbfe, #93c5fd);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    animation: devShine-b-9m1im4kpil 2.5s linear infinite;
}
[data-mode="dark"] .dev-progress-timer[b-9m1im4kpil] {
    background: rgba(37,99,235,0.15);
    border-color: rgba(37,99,235,0.3);
    color: #93c5fd;
}
[data-mode="dark"] .dev-phase[b-9m1im4kpil]       { background: rgba(255,255,255,0.03); }
[data-mode="dark"] .dev-phase.active[b-9m1im4kpil] { background: rgba(37,99,235,0.12); border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .dev-phase.done[b-9m1im4kpil]   { background: rgba(22,163,74,0.1);  border-color: rgba(22,163,74,0.25); }
[data-mode="dark"] .dev-phase.done .dev-phase-label[b-9m1im4kpil] { color: #86efac; }
[data-mode="dark"] .dev-phase-check[b-9m1im4kpil]  { color: #86efac; }


.crud-container[b-9m1im4kpil] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9m1im4kpil 0.3s ease-out; }
@keyframes slideUp-b-9m1im4kpil { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-9m1im4kpil] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9m1im4kpil] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9m1im4kpil] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9m1im4kpil] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9m1im4kpil] { display: flex; gap: 0.5rem; }

.btn-crud[b-9m1im4kpil] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9m1im4kpil] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9m1im4kpil] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9m1im4kpil] { filter: brightness(1.1); }
.btn-outline[b-9m1im4kpil] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9m1im4kpil] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9m1im4kpil] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9m1im4kpil] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9m1im4kpil] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-9m1im4kpil] { background: rgba(22,163,74,0.15); color: #86efac; border-color: rgba(22,163,74,0.3); }
[data-mode="dark"] .crud-alert.error[b-9m1im4kpil] { background: rgba(220,38,38,0.15); color: #fca5a5; border-color: rgba(220,38,38,0.3); }

.crud-spinner[b-9m1im4kpil] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9m1im4kpil 0.6s linear infinite; }
.crud-spinner-sm[b-9m1im4kpil] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9m1im4kpil 0.6s linear infinite; }
@keyframes spin-b-9m1im4kpil { to { transform: rotate(360deg); } }
.spin[b-9m1im4kpil] { animation: spin-b-9m1im4kpil 0.8s linear infinite; }
.crud-loading[b-9m1im4kpil], .crud-empty-state[b-9m1im4kpil] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9m1im4kpil] { font-size: 2rem; }

/* Layout 2 columnas */
.dev-exec-layout[b-9m1im4kpil] { display: grid; grid-template-columns: 320px 1fr; gap: 1rem; align-items: start; }

/* Panel compartido */
.dev-exec-panel[b-9m1im4kpil], .dev-log-panel[b-9m1im4kpil] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.75rem; overflow: hidden; }
.dev-panel-header[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; background: var(--rg-bg-subtle, #f8fafc); border-bottom: 1px solid var(--rg-border, #e2e8f0); font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); }
.dev-panel-header i[b-9m1im4kpil] { color: var(--rg-accent, #4f46e5); }
.dev-log-count[b-9m1im4kpil] { margin-left: auto; font-size: 0.72rem; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 1rem; padding: 0.1rem 0.5rem; color: var(--rg-text-muted, #94a3b8); }

/* Form panel */
.dev-form-body[b-9m1im4kpil] { padding: 1rem; display: flex; flex-direction: column; gap: 0.6rem; }
.form-group[b-9m1im4kpil] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-9m1im4kpil] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9m1im4kpil], .form-group select[b-9m1im4kpil] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9m1im4kpil], .form-group select:focus[b-9m1im4kpil] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* ── Date inputs — dark mode ─────────────────────────────────────────────── */
/* El navegador ignora background/color en input[type=date] en dark mode sin color-scheme */
.form-group input[type="date"][b-9m1im4kpil] { color-scheme: light; }
[data-mode="dark"] .form-group input[type="date"][b-9m1im4kpil] {
    color-scheme: dark;
    background: rgba(37,99,235,0.12);
    color: #93c5fd;
    border-color: rgba(37,99,235,0.45);
}
[data-mode="dark"] .form-group input[type="date"]:focus[b-9m1im4kpil] {
    border-color: #60a5fa;
    box-shadow: 0 0 0 2px rgba(37,99,235,0.25);
}
[data-mode="dark"] .form-group input[type="date"][b-9m1im4kpil]::-webkit-calendar-picker-indicator {
    filter: invert(0.7) sepia(1) saturate(3) hue-rotate(180deg);
    cursor: pointer;
}
.form-check-group[b-9m1im4kpil] { display: flex; align-items: center; }
.form-check[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9m1im4kpil] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

.dev-exec-actions[b-9m1im4kpil] { padding-top: 0.25rem; }
.dev-exec-btn[b-9m1im4kpil] { width: 100%; justify-content: center; padding: 0.625rem 1rem; }

/* Resultado box */
.dev-result-box[b-9m1im4kpil] { border-radius: 0.5rem; padding: 0.75rem 1rem; margin-top: 0.5rem; }
.dev-result-box.success[b-9m1im4kpil] { background: rgba(22,163,74,0.1);  border: 1px solid rgba(22,163,74,0.3); }
.dev-result-box.error[b-9m1im4kpil]   { background: rgba(220,38,38,0.08); border: 1px solid rgba(220,38,38,0.25); }
.dev-result-box.warn[b-9m1im4kpil]    { background: rgba(217,119,6,0.08); border: 1px solid rgba(217,119,6,0.3); }
.dev-result-title[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; font-weight: 700; margin-bottom: 0.25rem; }
.dev-result-box.success .dev-result-title[b-9m1im4kpil] { color: #166534; }
.dev-result-box.error   .dev-result-title[b-9m1im4kpil] { color: #991b1b; }
.dev-result-box.warn    .dev-result-title[b-9m1im4kpil] { color: #92400e; }
[data-mode="dark"] .dev-result-box.success .dev-result-title[b-9m1im4kpil] { color: #86efac; }
[data-mode="dark"] .dev-result-box.error   .dev-result-title[b-9m1im4kpil] { color: #fca5a5; }
[data-mode="dark"] .dev-result-box.warn    .dev-result-title[b-9m1im4kpil] { color: #fcd34d; }
.dev-result-msg[b-9m1im4kpil]   { font-size: 0.78rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.35rem; }
.dev-result-stats[b-9m1im4kpil] { display: flex; gap: 1rem; font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.error-text[b-9m1im4kpil] { color: #dc2626; }

/* ── Tabla de advertencia — préstamos con fechas inválidas ───────────────── */
.dev-warn-box[b-9m1im4kpil] {
    margin-top: 0.75rem;
    border: 1px solid rgba(217,119,6,0.35);
    border-radius: 0.5rem;
    overflow: hidden;
    animation: devFadeIn-b-9m1im4kpil 0.25s ease;
}
.dev-warn-header[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(217,119,6,0.12);
    padding: 0.5rem 0.75rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #92400e;
}
[data-mode="dark"] .dev-warn-header[b-9m1im4kpil] { color: #fcd34d; background: rgba(217,119,6,0.18); }
.dev-warn-header i[b-9m1im4kpil] { font-size: 0.85rem; }
.dev-warn-count[b-9m1im4kpil] {
    margin-left: auto;
    background: rgba(217,119,6,0.25);
    color: #92400e;
    border-radius: 1rem;
    padding: 0.05rem 0.5rem;
    font-size: 0.7rem;
}
[data-mode="dark"] .dev-warn-count[b-9m1im4kpil] { color: #fcd34d; }
.dev-warn-desc[b-9m1im4kpil] {
    font-size: 0.75rem;
    color: var(--rg-text-secondary, #475569);
    padding: 0.4rem 0.75rem 0.25rem;
    margin: 0;
    border-bottom: 1px solid rgba(217,119,6,0.2);
}
.dev-warn-table[b-9m1im4kpil] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.73rem;
}
.dev-warn-table th[b-9m1im4kpil] {
    background: var(--rg-bg-subtle, #f8fafc);
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted, #94a3b8);
    padding: 0.3rem 0.6rem;
    text-align: left;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-warn-table td[b-9m1im4kpil] {
    padding: 0.3rem 0.6rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
    vertical-align: middle;
}
.dev-warn-table tr:last-child td[b-9m1im4kpil] { border-bottom: none; }
.dev-warn-table .warn-date[b-9m1im4kpil] { color: #b45309; font-weight: 600; }
[data-mode="dark"] .dev-warn-table .warn-date[b-9m1im4kpil] { color: #fbbf24; }
.dev-warn-table .text-right[b-9m1im4kpil] { text-align: right; }
[data-mode="dark"] .dev-warn-table th[b-9m1im4kpil] { background: rgba(255,255,255,0.04); }

/* Log list */
.dev-log-list[b-9m1im4kpil] { display: flex; flex-direction: column; max-height: calc(100vh - 250px); overflow-y: auto; }
.dev-log-item[b-9m1im4kpil] { padding: 0.625rem 1rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); transition: background 0.12s; }
.dev-log-item:hover[b-9m1im4kpil] { background: var(--rg-bg-hover, #f8fafc); }
.dev-log-item.ok[b-9m1im4kpil] { border-left: 3px solid #16a34a; }
.dev-log-item.err[b-9m1im4kpil] { border-left: 3px solid #dc2626; }
.dev-log-header[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.2rem; }
.dev-log-fase[b-9m1im4kpil] { font-size: 0.78rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.dev-log-fecha[b-9m1im4kpil] { margin-left: auto; font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); font-family: monospace; }
.dev-log-stats[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.75rem; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); }
.dev-log-tag[b-9m1im4kpil] { background: var(--rg-bg-subtle, #f1f5f9); border-radius: 0.25rem; padding: 0.05rem 0.35rem; font-size: 0.68rem; }
.dev-log-msg[b-9m1im4kpil] { font-size: 0.72rem; color: var(--rg-text-secondary, #475569); margin-top: 0.2rem; }
.badge[b-9m1im4kpil] { display: inline-flex; align-items: center; padding: 0.1rem 0.4rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 700; }
.badge-ok[b-9m1im4kpil] { background: rgba(22,163,74,0.12); color: #166534; }
.badge-err[b-9m1im4kpil] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .badge-ok[b-9m1im4kpil] { color: #86efac; }
[data-mode="dark"] .badge-err[b-9m1im4kpil] { color: #fca5a5; }
.dev-load-more[b-9m1im4kpil] { width: 100%; justify-content: center; border-radius: 0; border-top: 1px solid var(--rg-border); border-left: none; border-right: none; border-bottom: none; font-size: 0.75rem; }

@media (max-width: 768px) {
    .dev-exec-layout[b-9m1im4kpil] { grid-template-columns: 1fr; }
    .crud-container[b-9m1im4kpil] { padding: 0.75rem; }
}

/* ── Modal ───────────────────────────────────────────────────────────────── */
.modal-backdrop[b-9m1im4kpil] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-9m1im4kpil] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9m1im4kpil] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-header[b-9m1im4kpil] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9m1im4kpil] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-9m1im4kpil] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9m1im4kpil] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-9m1im4kpil] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-9m1im4kpil] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-9m1im4kpil] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-9m1im4kpil] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-9m1im4kpil] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-9m1im4kpil] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-9m1im4kpil] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-9m1im4kpil] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-9m1im4kpil] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-9m1im4kpil] { border-bottom: none; }
.help-section p[b-9m1im4kpil] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-9m1im4kpil], .help-section ol[b-9m1im4kpil] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-9m1im4kpil] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-9m1im4kpil] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-9m1im4kpil] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-9m1im4kpil] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-9m1im4kpil] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-9m1im4kpil] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-9m1im4kpil] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-9m1im4kpil] { padding-left: 1.1rem; }
.help-example li[b-9m1im4kpil] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-9m1im4kpil] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-9m1im4kpil]  { color: #1d4ed8; }
.help-cm[b-9m1im4kpil]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-9m1im4kpil] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-9m1im4kpil] { color: #fcd34d; }
.help-tip[b-9m1im4kpil] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-9m1im4kpil] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-9m1im4kpil] { background: rgba(37,99,235,0.12); }
.help-steps[b-9m1im4kpil] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-9m1im4kpil] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-9m1im4kpil] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-9m1im4kpil] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-9m1im4kpil] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-9m1im4kpil] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-9m1im4kpil] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-9m1im4kpil] { background: rgba(255,255,255,0.04); }
.help-badge[b-9m1im4kpil] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-9m1im4kpil]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-9m1im4kpil]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-9m1im4kpil]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-9m1im4kpil] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-9m1im4kpil]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-9m1im4kpil]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-9m1im4kpil]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-9m1im4kpil]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-9m1im4kpil]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-9m1im4kpil]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-9m1im4kpil] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-9m1im4kpil]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-9m1im4kpil]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-9m1im4kpil]     { color: #c4b5fd; }

/* ── Verificación de configuración contable ──────────────────────────────── */
.dev-config-check[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.75rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted, #94a3b8);
}

/* Panel de bloqueo — se muestra cuando hay productos sin cuentas */
.dev-config-bloqueado[b-9m1im4kpil] {
    border: 1px solid rgba(220,38,38,0.3);
    border-radius: 0.6rem;
    overflow: hidden;
    margin-bottom: 0.75rem;
    animation: devFadeIn-b-9m1im4kpil 0.25s ease;
}

.dev-config-bloqueado-header[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(220,38,38,0.1);
    padding: 0.55rem 0.85rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #991b1b;
    border-bottom: 1px solid rgba(220,38,38,0.2);
}
[data-mode="dark"] .dev-config-bloqueado-header[b-9m1im4kpil] {
    background: rgba(220,38,38,0.18);
    color: #fca5a5;
}
.dev-config-bloqueado-header i[b-9m1im4kpil] { font-size: 0.9rem; }

.dev-config-bloqueado-desc[b-9m1im4kpil] {
    font-size: 0.75rem;
    color: var(--rg-text-secondary, #475569);
    padding: 0.5rem 0.85rem 0.25rem;
    margin: 0;
    line-height: 1.5;
}

.dev-config-bloqueado-lista-title[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #b45309;
    padding: 0.3rem 0.85rem 0.2rem;
}
[data-mode="dark"] .dev-config-bloqueado-lista-title[b-9m1im4kpil] { color: #fbbf24; }
.dev-config-bloqueado-lista-title i[b-9m1im4kpil] { font-size: 0.75rem; }

.dev-config-prod-lista[b-9m1im4kpil] {
    display: flex;
    flex-direction: column;
    gap: 0;
    max-height: 220px;
    overflow-y: auto;
    padding: 0 0.85rem 0.5rem;
}

.dev-config-prod-item[b-9m1im4kpil] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.dev-config-prod-item:last-child[b-9m1im4kpil] { border-bottom: none; }

.dev-config-prod-nombre[b-9m1im4kpil] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: var(--rg-text-primary, #1e293b);
    font-weight: 600;
}
.dev-config-prod-id[b-9m1im4kpil] {
    font-size: 0.68rem;
    color: var(--rg-text-muted, #94a3b8);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

.dev-config-prod-cuentas[b-9m1im4kpil] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Badges de estado de cuenta */
.dev-cuenta-badge[b-9m1im4kpil] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.1rem 0.45rem;
    border-radius: 1rem;
    font-size: 0.64rem;
    font-weight: 600;
    white-space: nowrap;
}
.dev-cuenta-falta[b-9m1im4kpil] {
    background: rgba(220,38,38,0.1);
    color: #991b1b;
    border: 1px solid rgba(220,38,38,0.25);
}
[data-mode="dark"] .dev-cuenta-falta[b-9m1im4kpil] {
    color: #fca5a5;
    background: rgba(220,38,38,0.18);
    border-color: rgba(220,38,38,0.3);
}
.dev-cuenta-ok[b-9m1im4kpil] {
    background: rgba(22,163,74,0.1);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.2);
}
[data-mode="dark"] .dev-cuenta-ok[b-9m1im4kpil] {
    color: #86efac;
    background: rgba(22,163,74,0.15);
    border-color: rgba(22,163,74,0.25);
}

.dev-config-bloqueado-footer[b-9m1im4kpil] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    padding: 0.5rem 0.85rem 0.65rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
}
[data-mode="dark"] .dev-config-bloqueado-footer[b-9m1im4kpil] { background: rgba(255,255,255,0.03); }
.dev-config-bloqueado-footer .btn-crud[b-9m1im4kpil] { font-size: 0.72rem; padding: 0.3rem 0.65rem; }

/* Botón de tamaño pequeño */
.btn-sm[b-9m1im4kpil] { font-size: 0.72rem !important; padding: 0.3rem 0.65rem !important; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprDevengoEstadoV2.razor.rz.scp.css */
/* ============================================================
   FrmprDevengoEstadoV2 — Estado Interés Devengado
   Estilos auto-contenidos (Blazor CSS Isolation)
   Todos los colores via tokens --rg-*
   ============================================================ */

.crud-container[b-rok7yb86x1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rok7yb86x1 0.3s ease-out; }
@keyframes slideUp-b-rok7yb86x1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ── */
.crud-header[b-rok7yb86x1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rok7yb86x1] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-rok7yb86x1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-rok7yb86x1] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-rok7yb86x1] { display: flex; gap: 0.5rem; }

/* ── Buttons ── */
.btn-crud[b-rok7yb86x1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rok7yb86x1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rok7yb86x1] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rok7yb86x1] { filter: brightness(1.1); }
.btn-outline[b-rok7yb86x1] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-rok7yb86x1] { background: var(--rg-bg-hover); }
.btn-danger[b-rok7yb86x1] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-rok7yb86x1] { filter: brightness(1.1); }
.btn-icon[b-rok7yb86x1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rok7yb86x1] { color: var(--rg-accent); }
.btn-edit:hover[b-rok7yb86x1] { background: rgba(79, 70, 229, 0.1); }
.view-toggle[b-rok7yb86x1] { padding: 0.5rem 0.65rem; }
.active-toggle[b-rok7yb86x1] { background: var(--rg-bg-subtle); border-color: var(--rg-primary); color: var(--rg-primary); }

/* ── Alert ── */
.crud-alert[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rok7yb86x1] { background: rgba(34, 197, 94, 0.1); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-rok7yb86x1]   { background: rgba(239, 68, 68, 0.1); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-rok7yb86x1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-rok7yb86x1]   { color: #fca5a5; }
.crud-alert-close[b-rok7yb86x1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── KPI Row ── */
.dev-kpi-row[b-rok7yb86x1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1rem; }
.dev-kpi-card[b-rok7yb86x1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.875rem 1rem; display: flex; flex-direction: column; gap: 0.25rem; position: relative; overflow: hidden; }
.dev-kpi-card[b-rok7yb86x1]::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 4px 0 0 4px; }
.dev-kpi-blue[b-rok7yb86x1]::before   { background: var(--rg-primary); }
.dev-kpi-green[b-rok7yb86x1]::before  { background: var(--rg-success); }
.dev-kpi-orange[b-rok7yb86x1]::before { background: var(--rg-warning); }
.dev-kpi-gray[b-rok7yb86x1]::before   { background: var(--rg-text-muted); }
.dev-kpi-label[b-rok7yb86x1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.dev-kpi-value[b-rok7yb86x1] { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); }

/* ── Filtros bar ── */
.dev-filtros-bar[b-rok7yb86x1] { display: flex; gap: 0.5rem; align-items: stretch; margin-bottom: 0.75rem; flex-wrap: wrap; }
.dev-filtros-bar .form-group[b-rok7yb86x1] { margin-bottom: 0; }
.dev-filtros-bar select[b-rok7yb86x1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-card); outline: none; height: 100%; transition: border-color 0.15s; }
.dev-filtros-bar select:focus[b-rok7yb86x1] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ── Search bar ── */
.crud-search-bar[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-rok7yb86x1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-rok7yb86x1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-rok7yb86x1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-rok7yb86x1] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* ── Grid ── */
.crud-grid-wrapper[b-rok7yb86x1] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 380px); }
.crud-table[b-rok7yb86x1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rok7yb86x1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rok7yb86x1] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rok7yb86x1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-rok7yb86x1] { background: var(--rg-bg-hover); }
.col-actions[b-rok7yb86x1] { width: 80px; text-align: center; white-space: nowrap; }
.text-right[b-rok7yb86x1]  { text-align: right; }
.text-center[b-rok7yb86x1] { text-align: center; }

/* ── Cliente cell ── */
.dev-cliente-cell[b-rok7yb86x1] { display: flex; flex-direction: column; gap: 0.1rem; }
.dev-cliente-id[b-rok7yb86x1]   { font-size: 0.68rem; color: var(--rg-text-muted); }
.dev-cliente-nombre[b-rok7yb86x1] { font-size: 0.78rem; color: var(--rg-text-primary); font-weight: 500; }

/* ── Cards ── */
.crud-cards-wrapper[b-rok7yb86x1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 380px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rok7yb86x1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rok7yb86x1] { border-color: var(--rg-accent); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rok7yb86x1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rok7yb86x1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted); }
.card-badges[b-rok7yb86x1] { display: flex; gap: 0.35rem; flex-shrink: 0; flex-wrap: wrap; }
.card-title[b-rok7yb86x1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rok7yb86x1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rok7yb86x1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rok7yb86x1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rok7yb86x1] { font-size: 0.78rem; color: var(--rg-text-primary); }
.card-actions[b-rok7yb86x1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border); }
.client-card-photo[b-rok7yb86x1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-subtle); display: flex; align-items: center; justify-content: center; color: var(--rg-accent); font-size: 1.25rem; flex-shrink: 0; }

/* ── Badges ── */
.badge[b-rok7yb86x1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rok7yb86x1] { background: rgba(34, 197, 94, 0.15); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.badge-no[b-rok7yb86x1]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-rok7yb86x1] { color: #86efac; }

/* Tipo tabla */
.dev-tipo-lc[b-rok7yb86x1] { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; border: 1px solid rgba(59, 130, 246, 0.3); }
.dev-tipo-n[b-rok7yb86x1]  { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
[data-mode="dark"] .dev-tipo-lc[b-rok7yb86x1] { color: #93c5fd; }
[data-mode="dark"] .dev-tipo-n[b-rok7yb86x1]  { color: var(--rg-text-muted); }

/* Pendiente */
.dev-badge-pendiente[b-rok7yb86x1] { background: rgba(249, 115, 22, 0.15); color: #c2410c; border: 1px solid rgba(249, 115, 22, 0.3); }
[data-mode="dark"] .dev-badge-pendiente[b-rok7yb86x1] { color: #fdba74; }

/* Días bucket */
.dev-dias-ok[b-rok7yb86x1]     { background: rgba(34, 197, 94, 0.15); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-dias-warn[b-rok7yb86x1]   { background: rgba(234, 179, 8, 0.15); color: #854d0e; border: 1px solid rgba(234, 179, 8, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-dias-alert[b-rok7yb86x1]  { background: rgba(249, 115, 22, 0.15); color: #c2410c; border: 1px solid rgba(249, 115, 22, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-dias-danger[b-rok7yb86x1] { background: rgba(239, 68, 68, 0.15); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
[data-mode="dark"] .dev-dias-ok[b-rok7yb86x1]     { color: #86efac; }
[data-mode="dark"] .dev-dias-warn[b-rok7yb86x1]   { color: #fde68a; }
[data-mode="dark"] .dev-dias-alert[b-rok7yb86x1]  { color: #fdba74; }
[data-mode="dark"] .dev-dias-danger[b-rok7yb86x1] { color: #fca5a5; }

/* ── Utilities ── */
.font-mono[b-rok7yb86x1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-rok7yb86x1] { color: var(--rg-text-muted); font-size: 0.78rem; }

/* ── Loading / Empty ── */
.crud-loading[b-rok7yb86x1], .crud-empty-state[b-rok7yb86x1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-rok7yb86x1] { font-size: 2rem; }
.crud-spinner[b-rok7yb86x1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-rok7yb86x1 0.6s linear infinite; }
@keyframes spin-b-rok7yb86x1 { to { transform: rotate(360deg); } }
.spin[b-rok7yb86x1] { animation: spin-b-rok7yb86x1 0.8s linear infinite; }

/* ── Cargar más ── */
.dev-load-more-row[b-rok7yb86x1] { display: flex; justify-content: center; padding: 0.75rem 0; }

/* ── Drill summary ── */
.dev-drill-summary[b-rok7yb86x1] { display: flex; gap: 1.5rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; color: var(--rg-text-secondary); }

/* ── Modal ── */
.modal-backdrop[b-rok7yb86x1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rok7yb86x1 0.15s ease-out; }
.modal-container[b-rok7yb86x1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rok7yb86x1] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rok7yb86x1 0.2s ease-out; }
.modal-lg[b-rok7yb86x1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rok7yb86x1] { max-width: 420px; }
@keyframes fadeIn-b-rok7yb86x1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rok7yb86x1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-rok7yb86x1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-rok7yb86x1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-rok7yb86x1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rok7yb86x1] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-rok7yb86x1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rok7yb86x1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Form ── */
.form-group[b-rok7yb86x1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-rok7yb86x1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rok7yb86x1], .form-group select[b-rok7yb86x1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rok7yb86x1], .form-group select:focus[b-rok7yb86x1] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ── Responsive ── */
@media (max-width: 900px) {
    .dev-kpi-row[b-rok7yb86x1] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .crud-container[b-rok7yb86x1] { padding: 0.75rem; }
    .crud-header[b-rok7yb86x1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rok7yb86x1] { font-size: 1.1rem; }
    .dev-kpi-row[b-rok7yb86x1] { grid-template-columns: repeat(2, 1fr); }
    .dev-filtros-bar[b-rok7yb86x1] { flex-direction: column; }
    .modal-dialog[b-rok7yb86x1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rok7yb86x1] { width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rok7yb86x1] { padding: 0.75rem; }
    .crud-grid-wrapper[b-rok7yb86x1] { max-height: calc(100vh - 460px); }
    .crud-cards-wrapper[b-rok7yb86x1] { grid-template-columns: 1fr; max-height: calc(100vh - 460px); }
}
@media (max-width: 480px) {
    .dev-kpi-row[b-rok7yb86x1] { grid-template-columns: 1fr 1fr; }
    .card-details[b-rok7yb86x1] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-rok7yb86x1] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-rok7yb86x1] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-rok7yb86x1] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-rok7yb86x1] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-rok7yb86x1] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-rok7yb86x1] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-rok7yb86x1] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-rok7yb86x1] { border-bottom: none; }
.help-section p[b-rok7yb86x1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-rok7yb86x1], .help-section ol[b-rok7yb86x1] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-rok7yb86x1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-rok7yb86x1] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-rok7yb86x1] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-rok7yb86x1] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-rok7yb86x1] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-rok7yb86x1] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-rok7yb86x1] { padding-left: 1.1rem; }
.help-example li[b-rok7yb86x1] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-rok7yb86x1] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-rok7yb86x1]  { color: #1d4ed8; }
.help-cm[b-rok7yb86x1]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-rok7yb86x1] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-rok7yb86x1] { color: #fcd34d; }
.help-tip[b-rok7yb86x1] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-rok7yb86x1] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-rok7yb86x1] { background: rgba(37,99,235,0.12); }
.help-steps[b-rok7yb86x1] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-rok7yb86x1] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-rok7yb86x1] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-rok7yb86x1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-rok7yb86x1] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-rok7yb86x1] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-rok7yb86x1] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-rok7yb86x1] { background: rgba(255,255,255,0.04); }
.help-badge[b-rok7yb86x1] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-rok7yb86x1]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-rok7yb86x1]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-rok7yb86x1]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-rok7yb86x1] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-rok7yb86x1]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-rok7yb86x1]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-rok7yb86x1]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-rok7yb86x1]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-rok7yb86x1]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-rok7yb86x1]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-rok7yb86x1] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-rok7yb86x1]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-rok7yb86x1]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-rok7yb86x1]     { color: #c4b5fd; }

/* ── Resumen por Producto ───────────────────────────────────────────────── */
.dev-resumen-prod[b-rok7yb86x1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.75rem 1rem; margin-bottom: 1rem; }
.dev-resumen-prod-header[b-rok7yb86x1] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--rg-text-muted); margin-bottom: 0.6rem; }
.dev-resumen-prod-header i[b-rok7yb86x1] { color: var(--rg-accent); }
.dev-resumen-prod-grid[b-rok7yb86x1] { display: flex; flex-direction: column; gap: 0.35rem; }
.dev-resumen-prod-row[b-rok7yb86x1] { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0.45rem 0.65rem; background: var(--rg-bg-subtle); border-radius: 0.4rem; border: 1px solid var(--rg-border); font-size: 0.8rem; }
.dev-prod-nombre[b-rok7yb86x1] { font-weight: 600; color: var(--rg-text-primary); min-width: 140px; }
.dev-prod-stat[b-rok7yb86x1] { color: var(--rg-text-secondary); font-size: 0.78rem; }
.dev-prod-stat strong[b-rok7yb86x1] { color: var(--rg-text-primary); }
.dev-prod-pendiente[b-rok7yb86x1] { color: var(--rg-danger); }
.dev-prod-pendiente strong[b-rok7yb86x1] { color: var(--rg-danger); }
[data-mode="dark"] .dev-resumen-prod-row[b-rok7yb86x1] { background: rgba(255,255,255,0.03); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprEmularDevengo.razor.rz.scp.css */
/* ============================================================
   Emular Devengo — Estilos CRUD base (copia de Frmclientes) + específicos
   ============================================================ */

.crud-container[b-pbtdhvtz3r] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pbtdhvtz3r 0.3s ease-out; }
@keyframes slideUp-b-pbtdhvtz3r { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pbtdhvtz3r] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pbtdhvtz3r] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pbtdhvtz3r] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pbtdhvtz3r] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pbtdhvtz3r] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pbtdhvtz3r] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pbtdhvtz3r] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pbtdhvtz3r] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pbtdhvtz3r] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pbtdhvtz3r] { filter: brightness(1.1); }
.btn-outline[b-pbtdhvtz3r] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pbtdhvtz3r] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pbtdhvtz3r] { background: var(--rg-danger, #ef4444); color: #fff; }
.btn-danger:hover:not(:disabled)[b-pbtdhvtz3r] { filter: brightness(1.1); }
.btn-sm[b-pbtdhvtz3r] { padding: 0.3rem 0.7rem; font-size: 0.72rem; }
.btn-icon[b-pbtdhvtz3r] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }

/* Alert */
.crud-alert[b-pbtdhvtz3r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pbtdhvtz3r] { background: rgba(34,197,94,0.12); color: #065f46; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-pbtdhvtz3r] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-pbtdhvtz3r] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-pbtdhvtz3r] { color: #fca5a5; }
.crud-alert-close[b-pbtdhvtz3r] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Grid */
.crud-grid-wrapper[b-pbtdhvtz3r] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 380px); }
.crud-table[b-pbtdhvtz3r] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pbtdhvtz3r] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pbtdhvtz3r] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pbtdhvtz3r] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pbtdhvtz3r] { background: var(--rg-bg-hover, #f8fafc); }

/* Badges */
.badge[b-pbtdhvtz3r] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pbtdhvtz3r] { background: rgba(22,163,74,0.15); color: #065f46; }
.badge-no[b-pbtdhvtz3r] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #64748b); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-pbtdhvtz3r] { color: #86efac; }

/* Utilities */
.font-mono[b-pbtdhvtz3r] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pbtdhvtz3r] { text-align: center; }
.text-muted[b-pbtdhvtz3r] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Spin */
@keyframes spin-b-pbtdhvtz3r { to { transform: rotate(360deg); } }
.spin[b-pbtdhvtz3r] { display: inline-block; animation: spin-b-pbtdhvtz3r 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-pbtdhvtz3r] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pbtdhvtz3r 0.15s ease-out; }
.modal-container[b-pbtdhvtz3r] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pbtdhvtz3r] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pbtdhvtz3r 0.2s ease-out; }
.modal-lg[b-pbtdhvtz3r] { max-width: 760px; }
.modal-sm[b-pbtdhvtz3r] { max-width: 420px; }
@keyframes fadeIn-b-pbtdhvtz3r { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pbtdhvtz3r { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pbtdhvtz3r] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pbtdhvtz3r] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-pbtdhvtz3r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pbtdhvtz3r] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pbtdhvtz3r] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-pbtdhvtz3r] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-group[b-pbtdhvtz3r] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-pbtdhvtz3r] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pbtdhvtz3r], .form-group select[b-pbtdhvtz3r] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.4rem; font-size: 0.82rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pbtdhvtz3r], .form-group select:focus[b-pbtdhvtz3r] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-pbtdhvtz3r] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pbtdhvtz3r] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pbtdhvtz3r] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pbtdhvtz3r] { background:rgba(37,99,235,.25); }

/* ── Help modal content ──────────────────────────────────────────────── */
.help-icon-header[b-pbtdhvtz3r] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-pbtdhvtz3r] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-pbtdhvtz3r] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-pbtdhvtz3r] { border-bottom: none; }
.help-section p[b-pbtdhvtz3r] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-pbtdhvtz3r], .help-section ol[b-pbtdhvtz3r] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-pbtdhvtz3r] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-pbtdhvtz3r] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-pbtdhvtz3r] { color: var(--rg-accent,#2563eb); }
.help-tip[b-pbtdhvtz3r] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-pbtdhvtz3r] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-pbtdhvtz3r] { background: rgba(37,99,235,0.12); }
.help-steps[b-pbtdhvtz3r] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-pbtdhvtz3r] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-pbtdhvtz3r] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-pbtdhvtz3r] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* ── Emular Devengo — específico ────────────────────────────────────── */
.ed-card[b-pbtdhvtz3r] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:0.75rem; padding:1.25rem; margin-bottom:1rem; }
.ed-card h3[b-pbtdhvtz3r] { font-size:0.95rem; font-weight:700; color:var(--rg-text-primary); margin:0 0 0.75rem 0; display:flex; gap:0.4rem; align-items:center; }
.ed-card h3 i[b-pbtdhvtz3r] { color: var(--rg-accent); }
.ed-params[b-pbtdhvtz3r] { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:0.75rem 1rem; }
.ed-toggle[b-pbtdhvtz3r] { display:flex; align-items:flex-start; gap:0.6rem; padding:0.55rem 0.75rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border); border-radius:0.5rem; cursor:pointer; }
.ed-toggle input[b-pbtdhvtz3r] { cursor:pointer; margin-top:0.15rem; accent-color: var(--rg-accent); }
.ed-toggle div[b-pbtdhvtz3r] { font-size:0.82rem; color: var(--rg-text-primary); font-weight:600; line-height:1.2; }
.ed-toggle small[b-pbtdhvtz3r] { font-size:0.7rem; color:var(--rg-text-muted); display:block; font-weight:400; margin-top:0.15rem; }

.ed-collapse-btn[b-pbtdhvtz3r] { background:none; border:none; cursor:pointer; padding:0.35rem 0; font-size:0.8rem; font-weight:600; color: var(--rg-text-secondary); display:inline-flex; gap:0.4rem; align-items:center; }
.ed-collapse-btn:hover[b-pbtdhvtz3r] { color: var(--rg-accent); }

.ed-resumen[b-pbtdhvtz3r] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:0.75rem; margin-bottom:1rem; }
.ed-stat[b-pbtdhvtz3r] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0.5rem; padding:0.85rem 1rem; }
.ed-stat-label[b-pbtdhvtz3r] { font-size:0.72rem; text-transform:uppercase; color:var(--rg-text-muted); letter-spacing:0.04em; font-weight:600; }
.ed-stat-val[b-pbtdhvtz3r]   { font-size:1.4rem; font-weight:800; color:var(--rg-text-primary); margin-top:0.25rem; }
.ed-stat-sub[b-pbtdhvtz3r]   { font-size:0.72rem; color:var(--rg-text-secondary); margin-top:0.15rem; }
.ed-stat.stat-mora[b-pbtdhvtz3r]     { border-left-color:var(--rg-warning,#d97706); }
.ed-stat.stat-ahorros[b-pbtdhvtz3r]  { border-left-color:var(--rg-success,#16a34a); }
.ed-stat.stat-asientos[b-pbtdhvtz3r] { border-left-color:#7c3aed; }

.ed-tabs[b-pbtdhvtz3r] { display:flex; gap:0.25rem; background:var(--rg-bg-subtle); padding:0.3rem; border-radius:0.5rem; margin-bottom:0.75rem; flex-wrap:wrap; border:1px solid var(--rg-border); }
.ed-tab[b-pbtdhvtz3r]  { background:transparent; border:none; padding:0.45rem 0.85rem; border-radius:0.4rem; cursor:pointer; font-size:0.85rem; font-weight:600; color:var(--rg-text-secondary); display:inline-flex; gap:0.35rem; align-items:center; }
.ed-tab:hover[b-pbtdhvtz3r] { background:var(--rg-bg-hover); color:var(--rg-text-primary); }
.ed-tab.active[b-pbtdhvtz3r] { background:var(--rg-bg-card,#fff); color:var(--rg-accent,#2563eb); box-shadow:0 1px 3px rgba(0,0,0,0.08); }
.ed-tab-badge[b-pbtdhvtz3r] { background:var(--rg-bg-input); padding:0.05rem 0.45rem; border-radius:1rem; font-size:0.7rem; font-weight:700; border:1px solid var(--rg-border); }
.ed-tab.active .ed-tab-badge[b-pbtdhvtz3r] { background:rgba(37,99,235,0.15); color:var(--rg-accent); border-color: rgba(37,99,235,0.3); }

.ed-empty[b-pbtdhvtz3r] { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:2rem; color:var(--rg-text-muted); font-size:0.85rem; }

.ed-num[b-pbtdhvtz3r] { font-family:'Cascadia Code',monospace; text-align:right; }
.ed-badge-nuevo[b-pbtdhvtz3r]    { background:rgba(22,163,74,0.15); color:#166534; }
.ed-badge-faltante[b-pbtdhvtz3r] { background:rgba(220,38,38,0.15); color:#991b1b; }
.ed-badge-difiere[b-pbtdhvtz3r]  { background:rgba(217,119,6,0.15); color:#92400e; }
[data-mode="dark"] .ed-badge-nuevo[b-pbtdhvtz3r]    { color:#86efac; }
[data-mode="dark"] .ed-badge-faltante[b-pbtdhvtz3r] { color:#fca5a5; }
[data-mode="dark"] .ed-badge-difiere[b-pbtdhvtz3r]  { color:#fcd34d; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pbtdhvtz3r] { padding: 0.75rem; }
    .crud-header[b-pbtdhvtz3r] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pbtdhvtz3r] { font-size: 1.1rem; }
    .ed-resumen[b-pbtdhvtz3r] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pbtdhvtz3r] { width: 98%; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Devengo/FrmprMoraDevengoV2.razor.rz.scp.css */
/* ============================================================
   FrmprMoraDevengoV2 — Estado Mora Devengada
   Estilos auto-contenidos (Blazor CSS Isolation)
   Todos los colores via tokens --rg-*
   ============================================================ */

.crud-container[b-usrzucrwtf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-usrzucrwtf 0.3s ease-out; }
@keyframes slideUp-b-usrzucrwtf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ── */
.crud-header[b-usrzucrwtf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-usrzucrwtf] { font-size: 1.75rem; color: var(--rg-danger); }
.crud-title[b-usrzucrwtf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-usrzucrwtf] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-usrzucrwtf] { display: flex; gap: 0.5rem; }

/* ── Buttons ── */
.btn-crud[b-usrzucrwtf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-usrzucrwtf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-usrzucrwtf] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-usrzucrwtf] { filter: brightness(1.1); }
.btn-outline[b-usrzucrwtf] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-usrzucrwtf] { background: var(--rg-bg-hover); }
.btn-danger[b-usrzucrwtf] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-usrzucrwtf] { filter: brightness(1.1); }
.btn-icon[b-usrzucrwtf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-usrzucrwtf] { color: var(--rg-accent); }
.btn-edit:hover[b-usrzucrwtf] { background: rgba(79, 70, 229, 0.1); }
.view-toggle[b-usrzucrwtf] { padding: 0.5rem 0.65rem; }
.active-toggle[b-usrzucrwtf] { background: var(--rg-bg-subtle); border-color: var(--rg-primary); color: var(--rg-primary); }

/* ── Alert ── */
.crud-alert[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-usrzucrwtf] { background: rgba(34, 197, 94, 0.1); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-usrzucrwtf]   { background: rgba(239, 68, 68, 0.1); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-usrzucrwtf] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-usrzucrwtf]   { color: #fca5a5; }
.crud-alert-close[b-usrzucrwtf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── KPI Row ── */
.dev-kpi-row[b-usrzucrwtf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; margin-bottom: 1rem; }
.dev-kpi-card[b-usrzucrwtf] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.875rem 1rem; display: flex; flex-direction: column; gap: 0.25rem; position: relative; overflow: hidden; }
.dev-kpi-card[b-usrzucrwtf]::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 4px 0 0 4px; }
.dev-kpi-red[b-usrzucrwtf]::before       { background: var(--rg-danger); }
.dev-kpi-green[b-usrzucrwtf]::before     { background: var(--rg-success); }
.dev-kpi-orange[b-usrzucrwtf]::before    { background: var(--rg-warning); }
.dev-kpi-gray[b-usrzucrwtf]::before      { background: var(--rg-text-muted); }
.dev-kpi-red-alert[b-usrzucrwtf]::before { background: var(--rg-danger); }
.dev-kpi-red-alert[b-usrzucrwtf] { border-color: rgba(239, 68, 68, 0.4); }
.dev-kpi-label[b-usrzucrwtf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.dev-kpi-value[b-usrzucrwtf] { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); }
.dev-kpi-alerta[b-usrzucrwtf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-danger); display: flex; align-items: center; gap: 0.25rem; }

/* ── Filtros bar ── */
.dev-filtros-bar[b-usrzucrwtf] { display: flex; gap: 0.5rem; align-items: stretch; margin-bottom: 0.75rem; flex-wrap: wrap; }
.dev-filtros-bar .form-group[b-usrzucrwtf] { margin-bottom: 0; }
.dev-filtros-bar select[b-usrzucrwtf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-card); outline: none; height: 100%; transition: border-color 0.15s; }
.dev-filtros-bar select:focus[b-usrzucrwtf] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ── Search bar ── */
.crud-search-bar[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); }
.crud-search-btn[b-usrzucrwtf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-usrzucrwtf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-usrzucrwtf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-usrzucrwtf] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* ── Grid ── */
.crud-grid-wrapper[b-usrzucrwtf] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 440px); }
.crud-table[b-usrzucrwtf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-usrzucrwtf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-usrzucrwtf] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-usrzucrwtf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-usrzucrwtf] { background: var(--rg-bg-hover); }
.col-actions[b-usrzucrwtf] { width: 80px; text-align: center; white-space: nowrap; }
.text-right[b-usrzucrwtf]  { text-align: right; }
.text-center[b-usrzucrwtf] { text-align: center; }

/* Fila con mora pendiente */
.dev-row-pendiente[b-usrzucrwtf] { background: rgba(239, 68, 68, 0.03); }
.dev-row-pendiente:hover[b-usrzucrwtf] { background: rgba(239, 68, 68, 0.06) !important; }

/* ── Cliente cell ── */
.dev-cliente-cell[b-usrzucrwtf] { display: flex; flex-direction: column; gap: 0.1rem; }
.dev-cliente-id[b-usrzucrwtf]   { font-size: 0.68rem; color: var(--rg-text-muted); }
.dev-cliente-nombre[b-usrzucrwtf] { font-size: 0.78rem; color: var(--rg-text-primary); font-weight: 500; }
.dev-producto-hint[b-usrzucrwtf] { font-size: 0.67rem; color: var(--rg-text-muted); }

/* ── Cards ── */
.crud-cards-wrapper[b-usrzucrwtf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 440px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-usrzucrwtf] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-usrzucrwtf] { border-color: var(--rg-danger); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.dev-card-pendiente[b-usrzucrwtf] { border-left: 3px solid var(--rg-danger); }
.card-header-row[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-usrzucrwtf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-usrzucrwtf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted); }
.card-badges[b-usrzucrwtf] { display: flex; gap: 0.35rem; flex-shrink: 0; flex-wrap: wrap; }
.card-title[b-usrzucrwtf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-usrzucrwtf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-usrzucrwtf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-usrzucrwtf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-usrzucrwtf] { font-size: 0.78rem; color: var(--rg-text-primary); }
.card-actions[b-usrzucrwtf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border); }
.client-card-photo[b-usrzucrwtf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-subtle); display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0; }
.dev-mora-icon[b-usrzucrwtf] { color: var(--rg-danger); background: rgba(239, 68, 68, 0.1); }
.dev-pendiente-text[b-usrzucrwtf] { color: var(--rg-danger); font-weight: 700; }

/* ── Badges ── */
.badge[b-usrzucrwtf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-usrzucrwtf] { background: rgba(34, 197, 94, 0.15); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.badge-no[b-usrzucrwtf]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-usrzucrwtf] { color: #86efac; }

/* Tipo tabla */
.dev-tipo-lc[b-usrzucrwtf] { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; border: 1px solid rgba(59, 130, 246, 0.3); }
.dev-tipo-n[b-usrzucrwtf]  { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
[data-mode="dark"] .dev-tipo-lc[b-usrzucrwtf] { color: #93c5fd; }
[data-mode="dark"] .dev-tipo-n[b-usrzucrwtf]  { color: var(--rg-text-muted); }

/* Pendiente */
.dev-badge-pendiente[b-usrzucrwtf] { background: rgba(249, 115, 22, 0.15); color: #c2410c; border: 1px solid rgba(249, 115, 22, 0.3); }
[data-mode="dark"] .dev-badge-pendiente[b-usrzucrwtf] { color: #fdba74; }

/* Sin devengo — alerta roja */
.dev-badge-sin-devengo[b-usrzucrwtf] { background: rgba(239, 68, 68, 0.15); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .dev-badge-sin-devengo[b-usrzucrwtf] { color: #fca5a5; }

/* Bucket días de mora */
.dev-bucket-ok[b-usrzucrwtf]       { background: rgba(34, 197, 94, 0.15); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-bucket-warn[b-usrzucrwtf]     { background: rgba(234, 179, 8, 0.15); color: #854d0e; border: 1px solid rgba(234, 179, 8, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-bucket-alert[b-usrzucrwtf]    { background: rgba(249, 115, 22, 0.15); color: #c2410c; border: 1px solid rgba(249, 115, 22, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-bucket-danger[b-usrzucrwtf]   { background: rgba(239, 68, 68, 0.15); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 600; }
.dev-bucket-critical[b-usrzucrwtf] { background: rgba(127, 29, 29, 0.2); color: #7f1d1d; border: 1px solid rgba(127, 29, 29, 0.4); border-radius: 1rem; padding: 0.1rem 0.45rem; font-size: 0.68rem; font-weight: 700; }
[data-mode="dark"] .dev-bucket-ok[b-usrzucrwtf]       { color: #86efac; }
[data-mode="dark"] .dev-bucket-warn[b-usrzucrwtf]     { color: #fde68a; }
[data-mode="dark"] .dev-bucket-alert[b-usrzucrwtf]    { color: #fdba74; }
[data-mode="dark"] .dev-bucket-danger[b-usrzucrwtf]   { color: #fca5a5; }
[data-mode="dark"] .dev-bucket-critical[b-usrzucrwtf] { color: #fca5a5; border-color: rgba(239, 68, 68, 0.5); }

/* ── Utilities ── */
.font-mono[b-usrzucrwtf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-usrzucrwtf] { color: var(--rg-text-muted); font-size: 0.78rem; }

/* ── Loading / Empty ── */
.crud-loading[b-usrzucrwtf], .crud-empty-state[b-usrzucrwtf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-usrzucrwtf] { font-size: 2rem; }
.crud-spinner[b-usrzucrwtf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-danger); border-radius: 50%; animation: spin-b-usrzucrwtf 0.6s linear infinite; }
@keyframes spin-b-usrzucrwtf { to { transform: rotate(360deg); } }
.spin[b-usrzucrwtf] { animation: spin-b-usrzucrwtf 0.8s linear infinite; }

/* ── Cargar más ── */
.dev-load-more-row[b-usrzucrwtf] { display: flex; justify-content: center; padding: 0.75rem 0; }

/* ── Drill summary ── */
.dev-drill-summary[b-usrzucrwtf] { display: flex; gap: 1.5rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; color: var(--rg-text-secondary); flex-wrap: wrap; }

/* ── Modal ── */
.modal-backdrop[b-usrzucrwtf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-usrzucrwtf 0.15s ease-out; }
.modal-container[b-usrzucrwtf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-usrzucrwtf] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-usrzucrwtf 0.2s ease-out; }
.modal-lg[b-usrzucrwtf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-usrzucrwtf] { max-width: 420px; }
@keyframes fadeIn-b-usrzucrwtf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-usrzucrwtf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-usrzucrwtf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-usrzucrwtf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-usrzucrwtf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-usrzucrwtf] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-usrzucrwtf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-usrzucrwtf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Form ── */
.form-group[b-usrzucrwtf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-usrzucrwtf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-usrzucrwtf], .form-group select[b-usrzucrwtf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-usrzucrwtf], .form-group select:focus[b-usrzucrwtf] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ── Responsive ── */
@media (max-width: 900px) {
    .dev-kpi-row[b-usrzucrwtf] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .crud-container[b-usrzucrwtf] { padding: 0.75rem; }
    .crud-header[b-usrzucrwtf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-usrzucrwtf] { font-size: 1.1rem; }
    .dev-kpi-row[b-usrzucrwtf] { grid-template-columns: repeat(2, 1fr); }
    .dev-filtros-bar[b-usrzucrwtf] { flex-direction: column; }
    .modal-dialog[b-usrzucrwtf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-usrzucrwtf] { width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-usrzucrwtf] { padding: 0.75rem; }
    .crud-grid-wrapper[b-usrzucrwtf] { max-height: calc(100vh - 520px); }
    .crud-cards-wrapper[b-usrzucrwtf] { grid-template-columns: 1fr; max-height: calc(100vh - 520px); }
}
@media (max-width: 480px) {
    .dev-kpi-row[b-usrzucrwtf] { grid-template-columns: 1fr 1fr; }
    .card-details[b-usrzucrwtf] { flex-direction: column; gap: 0.35rem; }
    .dev-drill-summary[b-usrzucrwtf] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────────── */
.btn-help[b-usrzucrwtf] { background: rgba(37,99,235,0.08); color: var(--rg-accent,#2563eb); border: 1px solid rgba(37,99,235,0.25); padding: 0.45rem 0.65rem; border-radius: 0.5rem; font-size: 0.9rem; cursor: pointer; transition: all 0.15s; display: inline-flex; align-items: center; }
.btn-help:hover[b-usrzucrwtf] { background: rgba(37,99,235,0.16); border-color: rgba(37,99,235,0.5); }
[data-mode="dark"] .btn-help[b-usrzucrwtf] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }
[data-mode="dark"] .btn-help:hover[b-usrzucrwtf] { background: rgba(37,99,235,0.25); }

/* ── Modal Ayuda — contenido ─────────────────────────────────────────────── */
.help-icon-header[b-usrzucrwtf] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-usrzucrwtf] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-usrzucrwtf] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-usrzucrwtf] { border-bottom: none; }
.help-section p[b-usrzucrwtf] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-usrzucrwtf], .help-section ol[b-usrzucrwtf] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-usrzucrwtf] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-usrzucrwtf] { color: var(--rg-accent,#2563eb); }
.help-grid-2[b-usrzucrwtf] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 0.5rem; }
.help-example[b-usrzucrwtf] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-usrzucrwtf] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-usrzucrwtf] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example ul[b-usrzucrwtf] { padding-left: 1.1rem; }
.help-example li[b-usrzucrwtf] { font-size: 0.82rem; margin-bottom: 0.15rem; }
.help-example-title[b-usrzucrwtf] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-ci[b-usrzucrwtf]  { color: #1d4ed8; }
.help-cm[b-usrzucrwtf]  { color: #b45309; }
[data-mode="dark"] .help-ci[b-usrzucrwtf] { color: #93c5fd; }
[data-mode="dark"] .help-cm[b-usrzucrwtf] { color: #fcd34d; }
.help-tip[b-usrzucrwtf] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-usrzucrwtf] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-usrzucrwtf] { background: rgba(37,99,235,0.12); }
.help-steps[b-usrzucrwtf] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-usrzucrwtf] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-usrzucrwtf] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-usrzucrwtf] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-usrzucrwtf] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-usrzucrwtf] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-usrzucrwtf] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-usrzucrwtf] { background: rgba(255,255,255,0.04); }
.help-badge[b-usrzucrwtf] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-usrzucrwtf]     { background: rgba(22,163,74,0.12);  color: #166534; }
.help-badge-warn[b-usrzucrwtf]   { background: rgba(217,119,6,0.12);  color: #92400e; }
.help-badge-alert[b-usrzucrwtf]  { background: rgba(234,88,12,0.12);  color: #9a3412; }
.help-badge-danger[b-usrzucrwtf] { background: rgba(220,38,38,0.12);  color: #991b1b; }
.help-badge-lc[b-usrzucrwtf]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-ci[b-usrzucrwtf]     { background: rgba(37,99,235,0.12);  color: #1e40af; }
.help-badge-cm[b-usrzucrwtf]     { background: rgba(124,58,237,0.12); color: #5b21b6; }
[data-mode="dark"] .help-badge-ok[b-usrzucrwtf]     { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-usrzucrwtf]   { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-usrzucrwtf]  { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-usrzucrwtf] { color: #fca5a5; }
[data-mode="dark"] .help-badge-lc[b-usrzucrwtf]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-ci[b-usrzucrwtf]     { color: #93c5fd; }
[data-mode="dark"] .help-badge-cm[b-usrzucrwtf]     { color: #c4b5fd; }

/* ── Resumen por Producto ───────────────────────────────────────────────── */
.dev-resumen-prod[b-usrzucrwtf] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; padding: 0.75rem 1rem; margin-bottom: 1rem; }
.dev-resumen-prod-header[b-usrzucrwtf] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--rg-text-muted); margin-bottom: 0.6rem; }
.dev-resumen-prod-header i[b-usrzucrwtf] { color: var(--rg-danger); }
.dev-resumen-prod-grid[b-usrzucrwtf] { display: flex; flex-direction: column; gap: 0.35rem; }
.dev-resumen-prod-row[b-usrzucrwtf] { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem 1.25rem; padding: 0.45rem 0.65rem; background: var(--rg-bg-subtle); border-radius: 0.4rem; border: 1px solid var(--rg-border); font-size: 0.8rem; }
.dev-prod-nombre[b-usrzucrwtf] { font-weight: 600; color: var(--rg-text-primary); min-width: 140px; }
.dev-prod-stat[b-usrzucrwtf] { color: var(--rg-text-secondary); font-size: 0.78rem; }
.dev-prod-stat strong[b-usrzucrwtf] { color: var(--rg-text-primary); }
.dev-prod-pendiente[b-usrzucrwtf] { color: var(--rg-danger); }
.dev-prod-pendiente strong[b-usrzucrwtf] { color: var(--rg-danger); }
.dev-prod-sin-devengo[b-usrzucrwtf] { color: var(--rg-danger); }
.dev-prod-sin-devengo strong[b-usrzucrwtf] { color: var(--rg-danger); }
[data-mode="dark"] .dev-resumen-prod-row[b-usrzucrwtf] { background: rgba(255,255,255,0.03); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/EBITDA/DwAuditoria.razor.rz.scp.css */
/* ============================================================
   DwAuditoria — Historial de jobs y salud del Data Warehouse
   ============================================================ */

.crud-container[b-myazfntuyq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-myazfntuyq 0.3s ease-out; }
@keyframes slideUp-b-myazfntuyq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-myazfntuyq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-myazfntuyq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-myazfntuyq] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-myazfntuyq]  { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-myazfntuyq] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-myazfntuyq] { display: flex; gap: 0.5rem; }

.btn-crud[b-myazfntuyq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-myazfntuyq] { opacity: 0.6; cursor: not-allowed; }
.btn-outline[b-myazfntuyq] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-myazfntuyq] { background: var(--rg-bg-hover); }

/* ── Health cards ──────────────────────────────────────────────────── */
.da-health-row[b-myazfntuyq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.da-health-card[b-myazfntuyq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-radius: 0.625rem;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
}

.da-health-card i[b-myazfntuyq] {
    font-size: 1.6rem;
    flex-shrink: 0;
}

.da-health-card > div[b-myazfntuyq] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.da-health-label[b-myazfntuyq] {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    font-weight: 600;
}

.da-health-val[b-myazfntuyq] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Estado de card */
.da-ok[b-myazfntuyq]  { border-left: 3px solid var(--rg-success, #16a34a); }
.da-ok  i[b-myazfntuyq] { color: var(--rg-success, #16a34a); }

.da-err[b-myazfntuyq] { border-left: 3px solid var(--rg-danger, #dc2626); }
.da-err i[b-myazfntuyq] { color: var(--rg-danger, #dc2626); }

.da-running[b-myazfntuyq] { border-left: 3px solid var(--rg-accent); }
.da-running i[b-myazfntuyq] { color: var(--rg-accent); }

.da-neutral[b-myazfntuyq] { border-left: 3px solid var(--rg-border); }
.da-neutral i[b-myazfntuyq] { color: var(--rg-text-muted); }

.da-info[b-myazfntuyq] { border-left: 3px solid var(--rg-info, #0891b2); }
.da-info i[b-myazfntuyq] { color: var(--rg-info, #0891b2); }

/* ── Badge de estado ────────────────────────────────────────────────── */
.da-badge[b-myazfntuyq] {
    display: inline-block;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    margin-left: 0.4rem;
    vertical-align: middle;
}

.da-badge-ok[b-myazfntuyq] {
    background: rgba(22,163,74,0.12);
    color: #15803d;
    border: 1px solid rgba(22,163,74,0.3);
}
[data-mode="dark"] .da-badge-ok[b-myazfntuyq] { color: #86efac; }

.da-badge-err[b-myazfntuyq] {
    background: rgba(220,38,38,0.12);
    color: #b91c1c;
    border: 1px solid rgba(220,38,38,0.3);
}
[data-mode="dark"] .da-badge-err[b-myazfntuyq] { color: #fca5a5; }

.da-badge-run[b-myazfntuyq] {
    background: rgba(79,70,229,0.12);
    color: var(--rg-accent);
    border: 1px solid rgba(79,70,229,0.3);
}

.da-badge-neu[b-myazfntuyq] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    border: 1px solid var(--rg-border);
}

/* ── Panel de error del último job ─────────────────────────────────── */
.da-error-panel[b-myazfntuyq] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: rgba(220,38,38,0.07);
    border: 1px solid rgba(220,38,38,0.3);
    margin-bottom: 1rem;
    font-size: 0.82rem;
}

.da-error-panel i[b-myazfntuyq] { color: var(--rg-danger, #dc2626); font-size: 1.1rem; flex-shrink: 0; margin-top: 0.15rem; }
.da-error-panel > div[b-myazfntuyq] { display: flex; flex-direction: column; gap: 0.2rem; }
.da-error-panel strong[b-myazfntuyq] { font-size: 0.82rem; color: var(--rg-text-primary); }
.da-error-panel span[b-myazfntuyq]   { color: var(--rg-text-secondary); font-size: 0.78rem; }

[data-mode="dark"] .da-error-panel[b-myazfntuyq] { background: rgba(220,38,38,0.1); }

/* ── Título de sección ──────────────────────────────────────────────── */
.da-section-title[b-myazfntuyq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.75rem;
}

.da-section-title i[b-myazfntuyq] { color: var(--rg-accent); }

.da-section-badge[b-myazfntuyq] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    border: 1px solid var(--rg-border);
    border-radius: 1rem;
    padding: 0.1rem 0.55rem;
    font-size: 0.68rem;
    font-weight: 600;
}

/* ── Grid de historial ──────────────────────────────────────────────── */
.crud-grid-wrapper[b-myazfntuyq] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 360px);
}

.crud-table[b-myazfntuyq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-myazfntuyq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-myazfntuyq] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.55rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}
.crud-table td[b-myazfntuyq] {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.crud-table tbody tr:hover[b-myazfntuyq] { background: var(--rg-bg-hover); }

/* Fila de error inline */
.da-row-err > td[b-myazfntuyq] { background: rgba(220,38,38,0.04); }
[data-mode="dark"] .da-row-err > td[b-myazfntuyq] { background: rgba(220,38,38,0.08); }

.da-error-row[b-myazfntuyq] { }
.da-error-cell[b-myazfntuyq] {
    background: rgba(220,38,38,0.06);
    color: var(--rg-danger, #dc2626);
    font-size: 0.75rem;
    padding: 0.35rem 1.25rem !important;
    border-bottom: 1px solid rgba(220,38,38,0.2);
}
[data-mode="dark"] .da-error-cell[b-myazfntuyq] { background: rgba(220,38,38,0.1); }

/* ── Columnas de la tabla ───────────────────────────────────────────── */
.da-fecha[b-myazfntuyq]   { font-size: 0.75rem; white-space: nowrap; }
.da-servidor[b-myazfntuyq] { font-size: 0.75rem; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.da-job-nombre[b-myazfntuyq] { font-size: 0.78rem; font-weight: 600; color: var(--rg-text-primary); }
.da-nombre-inicial[b-myazfntuyq] { color: var(--rg-accent); }

.text-right[b-myazfntuyq] { text-align: right; }
.text-muted[b-myazfntuyq] { color: var(--rg-text-muted); font-size: 0.75rem; }
.font-mono[b-myazfntuyq]  { font-family: 'Cascadia Code','Fira Code',monospace; }

/* ── Loading / empty ─────────────────────────────────────────────────── */
.crud-loading[b-myazfntuyq], .crud-empty-state[b-myazfntuyq] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 3rem; gap: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-empty-state i[b-myazfntuyq] { font-size: 2.5rem; }
.crud-spinner[b-myazfntuyq] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: spin-b-myazfntuyq 0.6s linear infinite;
}

@keyframes spin-b-myazfntuyq { to { transform: rotate(360deg); } }
.spin[b-myazfntuyq] { animation: spin-b-myazfntuyq 0.8s linear infinite; display: inline-block; }

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-myazfntuyq] { padding: 0.75rem; }
    .crud-header[b-myazfntuyq] { flex-direction: column; align-items: flex-start; }
    .da-health-row[b-myazfntuyq] { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
    .da-health-row[b-myazfntuyq] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/EBITDA/EbitdaClasificacionCuentas.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════
   EbitdaClasificacionCuentas.razor.css — Tema claro + oscuro
   ═══════════════════════════════════════════════════════════════════ */

/* ── Layout base (crud-container) ────────────────────────────────── */
.crud-container[b-4tb8rpwdof]   { padding: 1.5rem; }
.crud-header[b-4tb8rpwdof]      { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: .5rem; }
.crud-header-left[b-4tb8rpwdof] { display: flex; align-items: center; gap: .75rem; }
.crud-header-icon[b-4tb8rpwdof] { font-size: 1.6rem; color: var(--rg-primary); }
.crud-title[b-4tb8rpwdof]       { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-4tb8rpwdof]    { font-size: .8rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-4tb8rpwdof] { display: flex; gap: .5rem; flex-wrap: wrap; }

/* ── Alert ────────────────────────────────────────────────────────── */
.crud-alert[b-4tb8rpwdof]         { display: flex; align-items: center; gap: .5rem; padding: .65rem 1rem;
                      border-radius: .5rem; margin-bottom: .75rem; font-size: .85rem; }
.crud-alert.success[b-4tb8rpwdof] { background: rgba(22,163,74,.1); color: #166534; border: 1px solid rgba(22,163,74,.25); }
.crud-alert.error[b-4tb8rpwdof]   { background: rgba(220,38,38,.1); color: #991b1b; border: 1px solid rgba(220,38,38,.25); }
.crud-alert-close[b-4tb8rpwdof]   { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; }
[data-mode="dark"] .crud-alert.success[b-4tb8rpwdof] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-4tb8rpwdof]   { color: #fca5a5; }

/* ── Loading / Empty ─────────────────────────────────────────────── */
.crud-loading[b-4tb8rpwdof]  { display: flex; align-items: center; gap: .75rem; padding: 2rem; color: var(--rg-text-secondary); }
.crud-spinner[b-4tb8rpwdof]  { width: 22px; height: 22px; border: 3px solid var(--rg-border);
                 border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-b-4tb8rpwdof .7s linear infinite; }
.crud-empty-state[b-4tb8rpwdof] { display: flex; flex-direction: column; align-items: center; justify-content: center;
                    gap: .75rem; padding: 3rem 1rem; }
@keyframes spin-b-4tb8rpwdof { to { transform: rotate(360deg); } }
.spin[b-4tb8rpwdof] { animation: spin-b-4tb8rpwdof .7s linear infinite; display: inline-block; }
.rg-slide-up[b-4tb8rpwdof] { animation: slideUp-b-4tb8rpwdof .25s ease-out; }
@keyframes slideUp-b-4tb8rpwdof { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

/* ── Stats bar ────────────────────────────────────────────────────── */
.ec-stats-bar[b-4tb8rpwdof]    { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
                   background: var(--rg-bg-card); border: 1px solid var(--rg-border);
                   border-radius: .65rem; padding: .65rem 1rem; margin-bottom: .85rem; }
.ec-stats-item[b-4tb8rpwdof]   { display: flex; flex-direction: column; gap: .1rem; }
.ec-stats-val[b-4tb8rpwdof]    { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary); }
.ec-stats-lbl[b-4tb8rpwdof]    { font-size: .7rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: .04em; }
.ec-val-ok[b-4tb8rpwdof]       { color: #16a34a; }
.ec-val-pending[b-4tb8rpwdof]  { color: #d97706; }
[data-mode="dark"] .ec-val-ok[b-4tb8rpwdof]      { color: #86efac; }
[data-mode="dark"] .ec-val-pending[b-4tb8rpwdof] { color: #fcd34d; }
.ec-stats-sep[b-4tb8rpwdof]    { width: 1px; height: 28px; background: var(--rg-border); }
.ec-progress-item[b-4tb8rpwdof] { flex-direction: row; align-items: center; gap: .4rem; }
.ec-mini-progress[b-4tb8rpwdof] { width: 80px; height: 5px; background: var(--rg-border); border-radius: 3px; overflow: hidden; }
.ec-mini-fill[b-4tb8rpwdof]    { height: 100%; background: #16a34a; border-radius: 3px; transition: width .6s ease; }
[data-mode="dark"] .ec-mini-fill[b-4tb8rpwdof] { background: #86efac; }
.ec-badge-rubro[b-4tb8rpwdof]  { background: rgba(26,58,92,.12); color: var(--rg-primary); border: 1px solid rgba(26,58,92,.25);
                   border-radius: 10px; padding: .15rem .6rem; font-size: .72rem; font-weight: 700; }
[data-mode="dark"] .ec-badge-rubro[b-4tb8rpwdof] { background: rgba(96,165,250,.15); color: #93c5fd; border-color: rgba(96,165,250,.3); }

/* ── Filter / search bar ─────────────────────────────────────────── */
.ec-filter-bar[b-4tb8rpwdof]   { margin-bottom: .75rem; }
.crud-search-bar[b-4tb8rpwdof] { display: flex; align-items: center; background: var(--rg-bg-card);
                   border: 1px solid var(--rg-border); border-radius: .55rem; overflow: hidden;
                   margin-bottom: .5rem; }
.crud-search-btn[b-4tb8rpwdof] { padding: .5rem .75rem; background: none; border: none; color: var(--rg-text-muted); cursor: pointer; }
.crud-search-btn:hover[b-4tb8rpwdof] { color: var(--rg-primary); }
.crud-search-bar input[b-4tb8rpwdof] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary);
                          font-size: .85rem; padding: .5rem .25rem; outline: none; }
.crud-search-bar input[b-4tb8rpwdof]::placeholder { color: var(--rg-text-muted); }
.crud-search-clear[b-4tb8rpwdof] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: .25rem .5rem; }
.crud-count[b-4tb8rpwdof]      { padding: .25rem .75rem; font-size: .72rem; color: var(--rg-text-muted); white-space: nowrap; }

/* ── Chips de filtro ─────────────────────────────────────────────── */
.ec-chip-row[b-4tb8rpwdof]     { display: flex; gap: .35rem; flex-wrap: wrap; }
.ec-chip[b-4tb8rpwdof]         { padding: .25rem .7rem; border-radius: 10px; font-size: .75rem; font-weight: 500;
                   border: 1.5px solid var(--rg-border); background: var(--rg-bg-card);
                   color: var(--rg-text-secondary); cursor: pointer; transition: all .15s ease; }
.ec-chip:hover[b-4tb8rpwdof]   { border-color: var(--rg-primary); color: var(--rg-primary); }
.ec-chip.active[b-4tb8rpwdof]  { border-color: var(--rg-primary); background: rgba(26,58,92,.1); color: var(--rg-primary); font-weight: 600; }
[data-mode="dark"] .ec-chip.active[b-4tb8rpwdof] { background: rgba(96,165,250,.15); color: #93c5fd; border-color: #60a5fa; }

/* ── Grid / tabla ────────────────────────────────────────────────── */
.crud-grid-wrapper[b-4tb8rpwdof] { overflow-x: auto; border: 1px solid var(--rg-border); border-radius: .65rem; }
.crud-table[b-4tb8rpwdof]        { width: 100%; border-collapse: collapse; font-size: .83rem; }
.crud-table thead th[b-4tb8rpwdof] { background: var(--rg-bg-subtle); padding: .55rem .75rem;
                        font-weight: 600; font-size: .72rem; text-transform: uppercase;
                        letter-spacing: .04em; color: var(--rg-text-muted);
                        border-bottom: 2px solid var(--rg-border); text-align: left; }
.crud-table tbody tr[b-4tb8rpwdof] { border-bottom: 1px solid var(--rg-border); transition: background .12s ease; }
.crud-table tbody tr:hover[b-4tb8rpwdof] { background: var(--rg-bg-hover); }
.crud-table tbody tr:last-child[b-4tb8rpwdof] { border-bottom: none; }
.crud-table td[b-4tb8rpwdof] { padding: .45rem .75rem; vertical-align: middle; color: var(--rg-text-primary); background: var(--rg-bg-card); }
.text-center[b-4tb8rpwdof]   { text-align: center !important; }
.font-mono[b-4tb8rpwdof]     { font-family: 'Cascadia Code','Fira Code',monospace; font-size: .8rem; color: var(--rg-text-secondary); }

/* ── Fila con cambio pendiente ────────────────────────────────────── */
.ec-row-changed td[b-4tb8rpwdof] { background: rgba(217,119,6,.06) !important; }
[data-mode="dark"] .ec-row-changed td[b-4tb8rpwdof] { background: rgba(217,119,6,.12) !important; }

/* ── Nombre de cuenta ────────────────────────────────────────────── */
.ec-cuenta-nombre[b-4tb8rpwdof] { color: var(--rg-text-primary); font-weight: 500; }

/* ── Origen badge ────────────────────────────────────────────────── */
.ec-badge-origen[b-4tb8rpwdof] { display: inline-block; padding: .1rem .4rem; border-radius: 4px;
                   font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.ec-badge-origen.debit[b-4tb8rpwdof] { background: rgba(37,99,235,.1); color: #1d4ed8; }
.ec-badge-origen.cred[b-4tb8rpwdof]  { background: rgba(124,58,237,.1); color: #6d28d9; }
[data-mode="dark"] .ec-badge-origen.debit[b-4tb8rpwdof] { color: #93c5fd; }
[data-mode="dark"] .ec-badge-origen.cred[b-4tb8rpwdof]  { color: #c4b5fd; }

/* ── Dropdown de categoría ────────────────────────────────────────── */
.ec-cat-select[b-4tb8rpwdof] { width: 100%; padding: .3rem .5rem; border-radius: .4rem;
                 border: 1.5px solid var(--rg-border); background: var(--rg-bg-input);
                 color: var(--rg-text-primary); font-size: .8rem; cursor: pointer;
                 transition: border-color .15s ease; }
.ec-cat-select:focus[b-4tb8rpwdof]     { border-color: var(--rg-primary); outline: none; }
.ec-cat-select.has-val[b-4tb8rpwdof]   { border-color: rgba(22,163,74,.5); }
[data-mode="dark"] .ec-cat-select.has-val[b-4tb8rpwdof] { border-color: rgba(134,239,172,.4); }

/* ── Checkbox no recurrente ──────────────────────────────────────── */
.ec-norecurrente[b-4tb8rpwdof] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--rg-primary); }

/* ── Badges de estado ────────────────────────────────────────────── */
.badge[b-4tb8rpwdof]       { display: inline-block; padding: .1rem .45rem; border-radius: 10px;
               font-size: .7rem; font-weight: 700; }
.badge-yes[b-4tb8rpwdof]   { background: rgba(22,163,74,.12); color: #16a34a; }
.badge-no[b-4tb8rpwdof]    { background: rgba(100,116,139,.12); color: var(--rg-text-muted); }
[data-mode="dark"] .badge-yes[b-4tb8rpwdof] { color: #86efac; }

/* ── Paginación ──────────────────────────────────────────────────── */
.ec-pagination[b-4tb8rpwdof] { display: flex; align-items: center; justify-content: center;
                 gap: .75rem; padding: .75rem 0; }
.ec-page-info[b-4tb8rpwdof]  { font-size: .82rem; color: var(--rg-text-secondary); }

/* ── Botones estándar ────────────────────────────────────────────── */
.btn-crud[b-4tb8rpwdof]      { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1.1rem;
                 border-radius: .5rem; font-size: .85rem; font-weight: 600; cursor: pointer;
                 border: 1.5px solid transparent; transition: all .18s ease; }
.btn-crud:disabled[b-4tb8rpwdof] { opacity: .5; cursor: not-allowed; }
.btn-sm[b-4tb8rpwdof]        { padding: .3rem .65rem; font-size: .8rem; }
.btn-primary[b-4tb8rpwdof]   { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }
.btn-primary:hover:not(:disabled)[b-4tb8rpwdof] { filter: brightness(1.12); }
.btn-outline[b-4tb8rpwdof]   { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-4tb8rpwdof] { background: var(--rg-bg-hover); border-color: var(--rg-primary); color: var(--rg-primary); }
.ec-btn-auto[b-4tb8rpwdof]   { border-color: rgba(234,179,8,.5); color: #92400e; }
.ec-btn-auto:hover:not(:disabled)[b-4tb8rpwdof] { background: rgba(234,179,8,.08); }
[data-mode="dark"] .ec-btn-auto[b-4tb8rpwdof] { color: #fde68a; border-color: rgba(234,179,8,.4); }

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-header[b-4tb8rpwdof]      { flex-direction: column; align-items: flex-start; }
    .ec-stats-bar[b-4tb8rpwdof]     { gap: .6rem; }
    .ec-stats-sep[b-4tb8rpwdof]     { display: none; }
    .ec-cat-select[b-4tb8rpwdof]    { font-size: .75rem; }
}

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-4tb8rpwdof]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-4tb8rpwdof] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-4tb8rpwdof]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-4tb8rpwdof]        { max-width:720px; }
.modal-header[b-4tb8rpwdof]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-4tb8rpwdof] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-4tb8rpwdof]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-4tb8rpwdof] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-4tb8rpwdof]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-4tb8rpwdof]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-4tb8rpwdof]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-4tb8rpwdof]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-4tb8rpwdof] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-4tb8rpwdof]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-4tb8rpwdof] { color:var(--rg-primary); }
.btn-help[b-4tb8rpwdof]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-4tb8rpwdof]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/EBITDA/EbitdaConfigEmpresa.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════
   EbitdaConfigEmpresa.razor.css — Tema claro + oscuro (--rg-* tokens)
   ═══════════════════════════════════════════════════════════════════ */

/* ── Contenedor / Header (hereda crud-container de app.css) ─────────── */
.crud-container[b-36hhnscknw]   { padding: 1.5rem; }
.crud-header[b-36hhnscknw]      { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.crud-header-left[b-36hhnscknw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-36hhnscknw] { font-size: 1.6rem; color: var(--rg-primary); }
.crud-title[b-36hhnscknw]       { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-36hhnscknw]    { font-size: 0.8rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-36hhnscknw] { display: flex; gap: 0.5rem; }

/* ── Alert ───────────────────────────────────────────────────────────── */
.crud-alert[b-36hhnscknw]         { display: flex; align-items: center; gap: 0.5rem; padding: 0.65rem 1rem;
                      border-radius: 0.5rem; margin-bottom: 1rem; font-size: 0.85rem; }
.crud-alert.success[b-36hhnscknw] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.25); }
.crud-alert.error[b-36hhnscknw]   { background: rgba(220,38,38,0.1); color: #991b1b; border: 1px solid rgba(220,38,38,0.25); }
.crud-alert-close[b-36hhnscknw]   { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; }
[data-mode="dark"] .crud-alert.success[b-36hhnscknw] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-36hhnscknw]   { color: #fca5a5; }

/* ── Loading ────────────────────────────────────────────────────────── */
.crud-loading[b-36hhnscknw]  { display: flex; align-items: center; gap: 0.75rem; padding: 2rem; color: var(--rg-text-secondary); font-size: 0.9rem; }
.crud-spinner[b-36hhnscknw]  { width: 24px; height: 24px; border: 3px solid var(--rg-border);
                 border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-b-36hhnscknw 0.7s linear infinite; }
@keyframes spin-b-36hhnscknw { to { transform: rotate(360deg); } }
.spin[b-36hhnscknw] { animation: spin-b-36hhnscknw 0.7s linear infinite; display: inline-block; }
.rg-slide-up[b-36hhnscknw] { animation: slideUp-b-36hhnscknw 0.25s ease-out; }
@keyframes slideUp-b-36hhnscknw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Stats grid ─────────────────────────────────────────────────────── */
.ecfg-stats-grid[b-36hhnscknw]   { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.75rem; margin-bottom: 1.25rem; }
.ecfg-stat-card[b-36hhnscknw]    { background: var(--rg-bg-card); border: 1px solid var(--rg-border);
                     border-radius: 0.75rem; padding: 1rem 1.25rem; }
.ecfg-stat-value[b-36hhnscknw]   { font-size: 1.8rem; font-weight: 700; color: var(--rg-text-primary); line-height: 1; }
.ecfg-stat-label[b-36hhnscknw]   { font-size: 0.72rem; color: var(--rg-text-muted); text-transform: uppercase;
                     letter-spacing: 0.04em; margin-top: 0.3rem; }
.ecfg-stat-ok    .ecfg-stat-value[b-36hhnscknw] { color: #16a34a; }
.ecfg-stat-pending .ecfg-stat-value[b-36hhnscknw] { color: #d97706; }
.ecfg-pct-symbol[b-36hhnscknw]   { font-size: 1rem; font-weight: 400; }
.ecfg-progress-bar[b-36hhnscknw] { height: 4px; background: var(--rg-border); border-radius: 2px; margin-top: 0.5rem; }
.ecfg-progress-fill[b-36hhnscknw]{ height: 100%; background: #16a34a; border-radius: 2px; transition: width 0.6s ease; }
[data-mode="dark"] .ecfg-stat-ok .ecfg-stat-value[b-36hhnscknw]     { color: #86efac; }
[data-mode="dark"] .ecfg-stat-pending .ecfg-stat-value[b-36hhnscknw] { color: #fcd34d; }

/* ── Tarjeta config ─────────────────────────────────────────────────── */
.ecfg-card[b-36hhnscknw]        { background: var(--rg-bg-card); border: 1px solid var(--rg-border);
                    border-radius: 0.75rem; margin-bottom: 1rem; overflow: hidden; }
.ecfg-card-header[b-36hhnscknw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.85rem 1.25rem;
                    background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border);
                    font-weight: 600; font-size: 0.9rem; color: var(--rg-text-primary); }
.ecfg-card-body[b-36hhnscknw]   { padding: 1.25rem; }
.ecfg-help-text[b-36hhnscknw]   { font-size: 0.83rem; color: var(--rg-text-secondary); margin-bottom: 1.25rem; line-height: 1.5; }

/* ── Grid de rubros ─────────────────────────────────────────────────── */
.ecfg-rubro-grid[b-36hhnscknw]   { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
                     gap: 0.75rem; margin-bottom: 1.5rem; }
.ecfg-rubro-btn[b-36hhnscknw]    { display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem;
                     padding: 1rem; border-radius: 0.65rem; border: 2px solid var(--rg-border);
                     background: var(--rg-bg-card); cursor: pointer; transition: all 0.18s ease;
                     position: relative; text-align: left; color: var(--rg-text-primary); }
.ecfg-rubro-btn:hover[b-36hhnscknw] { border-color: var(--rg-primary); background: var(--rg-bg-hover); }
.ecfg-rubro-btn.selected[b-36hhnscknw] { border-color: var(--rg-primary); background: rgba(26,58,92,0.06); }
[data-mode="dark"] .ecfg-rubro-btn.selected[b-36hhnscknw] { background: rgba(96,165,250,0.1); border-color: #60a5fa; }
.ecfg-rubro-icon[b-36hhnscknw]   { font-size: 1.4rem; color: var(--rg-primary); margin-bottom: 0.15rem; }
[data-mode="dark"] .ecfg-rubro-icon[b-36hhnscknw] { color: #60a5fa; }
.ecfg-rubro-nombre[b-36hhnscknw] { font-weight: 600; font-size: 0.88rem; }
.ecfg-rubro-desc[b-36hhnscknw]   { font-size: 0.72rem; color: var(--rg-text-muted); line-height: 1.3; }
.ecfg-check[b-36hhnscknw]        { position: absolute; top: 0.6rem; right: 0.6rem; color: #16a34a; font-size: 1rem; }
[data-mode="dark"] .ecfg-check[b-36hhnscknw] { color: #86efac; }

/* ── Botones ─────────────────────────────────────────────────────────── */
.ecfg-actions[b-36hhnscknw]  { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.btn-crud[b-36hhnscknw]      { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1.1rem;
                 border-radius: 0.5rem; font-size: 0.85rem; font-weight: 600; cursor: pointer;
                 border: 1.5px solid transparent; transition: all 0.18s ease; }
.btn-crud:disabled[b-36hhnscknw] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-36hhnscknw]   { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }
.btn-primary:hover:not(:disabled)[b-36hhnscknw] { filter: brightness(1.12); }
.btn-outline[b-36hhnscknw]   { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-36hhnscknw] { background: var(--rg-bg-hover); border-color: var(--rg-primary); color: var(--rg-primary); }

.ecfg-badge-pending[b-36hhnscknw] { background: #d97706; color: #fff; border-radius: 10px;
                      padding: 0.1rem 0.45rem; font-size: 0.7rem; font-weight: 700; margin-left: 0.2rem; }

/* ── Info pie ────────────────────────────────────────────────────────── */
.ecfg-current-info[b-36hhnscknw] { display: flex; align-items: center; gap: 0.4rem;
                     font-size: 0.8rem; color: var(--rg-text-muted); padding: 0.5rem 0.25rem; }
.ecfg-current-info strong[b-36hhnscknw] { color: var(--rg-text-secondary); }

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .ecfg-stats-grid[b-36hhnscknw]  { grid-template-columns: repeat(2, 1fr); }
    .ecfg-rubro-grid[b-36hhnscknw]  { grid-template-columns: 1fr 1fr; }
    .ecfg-actions[b-36hhnscknw]     { flex-direction: column; }
    .ecfg-actions .btn-crud[b-36hhnscknw] { justify-content: center; }
}

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-36hhnscknw]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-36hhnscknw] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-36hhnscknw]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-36hhnscknw]        { max-width:720px; }
.modal-header[b-36hhnscknw]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-36hhnscknw] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-36hhnscknw]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-36hhnscknw] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-36hhnscknw]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-36hhnscknw]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-36hhnscknw]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-36hhnscknw]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-36hhnscknw] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-36hhnscknw]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-36hhnscknw] { color:var(--rg-primary); }
.btn-help[b-36hhnscknw]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-36hhnscknw]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/EBITDA/EbitdaReporte.razor.rz.scp.css */
/* ============================================================
   EbitdaReporte — Dashboard EBITDA con barra de progreso
   ============================================================ */

/* ── Animación entrada ── */
.crud-container[b-u0ay8yanxm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-u0ay8yanxm 0.3s ease-out; }
@keyframes slideUp-b-u0ay8yanxm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ── */
.crud-header[b-u0ay8yanxm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-u0ay8yanxm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-u0ay8yanxm] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-u0ay8yanxm]  { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-u0ay8yanxm] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-u0ay8yanxm] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }

/* ── Selector de período ── */
.er-select[b-u0ay8yanxm] {
    padding: 0.4rem 0.65rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    font-size: 0.8rem;
    font-weight: 500;
    outline: none;
    cursor: pointer;
    transition: border-color 0.15s;
}
.er-select:focus[b-u0ay8yanxm] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.er-select:disabled[b-u0ay8yanxm] { opacity: 0.5; cursor: not-allowed; }

/* ── Botones (CRUD standard) ── */
.btn-crud[b-u0ay8yanxm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-u0ay8yanxm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-u0ay8yanxm] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-u0ay8yanxm] { filter: brightness(1.1); }

/* ── Alert flash ── */
.crud-alert[b-u0ay8yanxm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-u0ay8yanxm] { background: rgba(22,163,74,0.1); color: var(--rg-success,#16a34a); border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-u0ay8yanxm]   { background: rgba(220,38,38,0.1);  color: var(--rg-danger,#dc2626);  border: 1px solid rgba(220,38,38,0.3); }
.crud-alert-close[b-u0ay8yanxm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-u0ay8yanxm] { background: rgba(22,163,74,0.15); }
[data-mode="dark"] .crud-alert.error[b-u0ay8yanxm]   { background: rgba(220,38,38,0.15); }

/* ── Panel de progreso ── */
.er-progress-panel[b-u0ay8yanxm] {
    border-radius: 0.625rem;
    padding: 0.875rem 1.125rem;
    margin-bottom: 1rem;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.er-panel-running[b-u0ay8yanxm] { border-color: var(--rg-accent); background: rgba(79,70,229,0.04); }
.er-panel-ok[b-u0ay8yanxm]      { border-color: rgba(22,163,74,0.4); background: rgba(22,163,74,0.05); }
.er-panel-error[b-u0ay8yanxm]   { border-color: rgba(220,38,38,0.4); background: rgba(220,38,38,0.05); }

[data-mode="dark"] .er-panel-running[b-u0ay8yanxm] { background: rgba(79,70,229,0.08); }
[data-mode="dark"] .er-panel-ok[b-u0ay8yanxm]      { background: rgba(22,163,74,0.08); }
[data-mode="dark"] .er-panel-error[b-u0ay8yanxm]   { background: rgba(220,38,38,0.08); }

.er-progress-info[b-u0ay8yanxm] { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.er-progress-label[b-u0ay8yanxm] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary); }
.er-progress-meta[b-u0ay8yanxm]  { font-size: 0.75rem; color: var(--rg-text-muted); margin-left: auto; }
.er-meta-err[b-u0ay8yanxm]       { color: var(--rg-danger,#dc2626); }
.er-icon-ok[b-u0ay8yanxm]  { color: var(--rg-success,#16a34a); font-size: 1rem; }
.er-icon-err[b-u0ay8yanxm] { color: var(--rg-danger,#dc2626);  font-size: 1rem; }
.er-icon-run[b-u0ay8yanxm] { color: var(--rg-accent); font-size: 1rem; }

/* ── Barra de progreso ── */
.er-bar-track[b-u0ay8yanxm] {
    height: 6px;
    background: var(--rg-bg-subtle,#f1f5f9);
    border-radius: 99px;
    overflow: hidden;
}
.er-bar[b-u0ay8yanxm] {
    height: 100%;
    border-radius: 99px;
}
.er-bar-ok[b-u0ay8yanxm]  { width: 100%; background: var(--rg-success,#16a34a); }
.er-bar-err[b-u0ay8yanxm] { width: 100%; background: var(--rg-danger,#dc2626); }

/* Animación indeterminate */
.er-bar-indeterminate[b-u0ay8yanxm] {
    width: 40%;
    background: var(--rg-accent);
    animation: barSlide-b-u0ay8yanxm 1.4s ease-in-out infinite;
}
@keyframes barSlide-b-u0ay8yanxm {
    0%   { transform: translateX(-100%); }
    50%  { transform: translateX(150%); }
    100% { transform: translateX(150%); }
}

/* ── KPI Cards ── */
.er-kpis[b-u0ay8yanxm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}
@media (max-width: 900px)  { .er-kpis[b-u0ay8yanxm] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px)  { .er-kpis[b-u0ay8yanxm] { grid-template-columns: 1fr; } }

.er-kpi[b-u0ay8yanxm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.625rem;
    background: var(--rg-bg-card);
    transition: box-shadow 0.15s;
}
.er-kpi:hover[b-u0ay8yanxm] { box-shadow: 0 2px 10px rgba(0,0,0,0.07); }

.er-kpi-icon[b-u0ay8yanxm] { font-size: 1.6rem; flex-shrink: 0; }
.er-kpi-body[b-u0ay8yanxm] { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.er-kpi-label[b-u0ay8yanxm] { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); }
.er-kpi-value[b-u0ay8yanxm] { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Colores por tipo de KPI */
.er-kpi-ing .er-kpi-icon[b-u0ay8yanxm] { color: #16a34a; }
.er-kpi-cos .er-kpi-icon[b-u0ay8yanxm] { color: #ea580c; }
.er-kpi-eb-pos .er-kpi-icon[b-u0ay8yanxm] { color: var(--rg-accent); }
.er-kpi-eb-neg .er-kpi-icon[b-u0ay8yanxm] { color: var(--rg-danger,#dc2626); }
.er-kpi-mrg .er-kpi-icon[b-u0ay8yanxm] { color: #7c3aed; }

.er-kpi-eb-pos .er-kpi-value[b-u0ay8yanxm] { color: var(--rg-accent); }
.er-kpi-eb-neg .er-kpi-value[b-u0ay8yanxm] { color: var(--rg-danger,#dc2626); }

/* ── Tabla EBITDA ── */
.er-table-wrapper[b-u0ay8yanxm] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 420px);
    margin-bottom: 0.75rem;
}
.er-table[b-u0ay8yanxm] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}
.er-table thead[b-u0ay8yanxm] { position: sticky; top: 0; z-index: 1; }
.er-table th[b-u0ay8yanxm] {
    background: var(--rg-bg-subtle,#f8fafc);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.55rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}
.er-th-num[b-u0ay8yanxm] { text-align: right !important; }
.er-table td[b-u0ay8yanxm] { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.er-table tbody tr:hover[b-u0ay8yanxm] { background: var(--rg-bg-hover); }

/* Encabezado de grupo */
.er-group-hdr td[b-u0ay8yanxm] {
    background: var(--rg-bg-subtle,#f1f5f9);
    color: var(--rg-text-secondary);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.4rem 0.75rem;
    text-transform: uppercase;
}
[data-mode="dark"] .er-group-hdr td[b-u0ay8yanxm] { background: rgba(255,255,255,0.05); }

.er-signo-pos[b-u0ay8yanxm] { color: var(--rg-success,#16a34a); font-weight: 900; margin-right: 0.35rem; }
.er-signo-neg[b-u0ay8yanxm] { color: var(--rg-danger,#dc2626);  font-weight: 900; margin-right: 0.35rem; }

/* Fila normal */
.er-cat[b-u0ay8yanxm] { max-width: 280px; }
.er-num[b-u0ay8yanxm] { text-align: right; white-space: nowrap; }

/* Subtotal */
.er-subtotal td[b-u0ay8yanxm] {
    background: var(--rg-bg-subtle,#f8fafc);
    border-top: 2px solid var(--rg-border);
    border-bottom: 2px solid var(--rg-border);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    padding: 0.45rem 0.75rem;
}
[data-mode="dark"] .er-subtotal td[b-u0ay8yanxm] { background: rgba(255,255,255,0.04); }

/* Total EBITDA */
.er-total td[b-u0ay8yanxm] {
    background: var(--rg-primary,#1a3a5c);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0.55rem 0.75rem;
    border: none;
}
.er-total .er-num[b-u0ay8yanxm] { text-align: right; }

/* Colores neto positivo/negativo */
.er-pos[b-u0ay8yanxm] { color: var(--rg-success,#16a34a) !important; }
.er-neg[b-u0ay8yanxm] { color: var(--rg-danger,#dc2626)  !important; }
.er-total .er-pos[b-u0ay8yanxm] { color: #86efac !important; }
.er-total .er-neg[b-u0ay8yanxm] { color: #fca5a5 !important; }

/* ── Utilidades ── */
.font-mono[b-u0ay8yanxm]  { font-family: 'Cascadia Code','Fira Code',monospace; }
.text-right[b-u0ay8yanxm] { text-align: right; }
.text-muted[b-u0ay8yanxm] { color: var(--rg-text-muted); font-size: 0.75rem; }

/* ── Loading / Empty ── */
.crud-loading[b-u0ay8yanxm], .crud-empty-state[b-u0ay8yanxm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-u0ay8yanxm] { font-size: 2.5rem; }
.crud-spinner[b-u0ay8yanxm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-u0ay8yanxm 0.6s linear infinite; }

/* ── Animaciones ── */
@keyframes spin-b-u0ay8yanxm { to { transform: rotate(360deg); } }
.spin[b-u0ay8yanxm] { animation: spin-b-u0ay8yanxm 0.8s linear infinite; display: inline-block; }

/* ── Pie ── */
.er-footer-meta[b-u0ay8yanxm] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    padding-top: 0.25rem;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .crud-container[b-u0ay8yanxm] { padding: 0.75rem; }
    .crud-header[b-u0ay8yanxm] { flex-direction: column; align-items: flex-start; }
    .crud-header-actions[b-u0ay8yanxm] { width: 100%; }
    .er-table-wrapper[b-u0ay8yanxm] { max-height: none; }
}

/* Toggle Grid/Tarjeta y vista de cards (EBITDA Reporte) */
.er-vista-toggle[b-u0ay8yanxm] { display:inline-flex; border:1px solid var(--rg-border); border-radius:8px; overflow:hidden; }
.er-vt[b-u0ay8yanxm] { background:var(--rg-bg-card); border:none; padding:.42rem .8rem; font-size:.78rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; gap:.35rem; align-items:center; }
.er-vt:hover[b-u0ay8yanxm] { background:var(--rg-bg-hover); }
.er-vt.active[b-u0ay8yanxm] { background:var(--rg-primary); color:#fff; }
.er-vt + .er-vt[b-u0ay8yanxm] { border-left:1px solid var(--rg-border); }

.er-cards[b-u0ay8yanxm] { display:grid; grid-template-columns:1fr; gap:.55rem; }
.er-card[b-u0ay8yanxm] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.75rem .9rem; }
.er-card-head[b-u0ay8yanxm] { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; flex-wrap:wrap; font-weight:700; color:var(--rg-text-primary); font-size:.88rem; margin-bottom:.45rem; }
.er-card-lin[b-u0ay8yanxm] { font-size:.7rem; color:var(--rg-text-muted); font-weight:400; }
.er-card-grid[b-u0ay8yanxm] { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:.4rem .8rem; font-size:.82rem; }
.er-kv[b-u0ay8yanxm] { display:flex; flex-direction:column; gap:.05rem; }
.er-kv .k[b-u0ay8yanxm] { font-size:.65rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.er-kv .v[b-u0ay8yanxm] { color:var(--rg-text-primary); font-variant-numeric:tabular-nums; }
.er-card-group[b-u0ay8yanxm] { background:var(--rg-bg-subtle); padding:.55rem .8rem; border-radius:8px; font-weight:800; font-size:.78rem; color:var(--rg-text-primary); margin:.5rem 0 .2rem; }
.er-card-sub[b-u0ay8yanxm] { background:rgba(37,99,235,.08); padding:.55rem .85rem; border-radius:8px; display:flex; justify-content:space-between; font-weight:700; font-size:.85rem; color:var(--rg-text-primary); }
.er-card-total[b-u0ay8yanxm] { background:var(--rg-primary); color:#fff; padding:.7rem .9rem; border-radius:8px; font-weight:800; display:flex; justify-content:space-between; font-size:.95rem; margin-top:.4rem; }

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-u0ay8yanxm]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-u0ay8yanxm] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-u0ay8yanxm]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-u0ay8yanxm]        { max-width:720px; }
.modal-header[b-u0ay8yanxm]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-u0ay8yanxm] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-u0ay8yanxm]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-u0ay8yanxm] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-u0ay8yanxm]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-u0ay8yanxm]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-u0ay8yanxm]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-u0ay8yanxm]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-u0ay8yanxm] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-u0ay8yanxm]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-u0ay8yanxm] { color:var(--rg-primary); }
.btn-help[b-u0ay8yanxm]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-u0ay8yanxm]  { background:var(--rg-bg-hover);color:var(--rg-primary); }

/* ── Botón ayuda inline (dentro del <h1>) ─────────────────────────────────── */
.btn-help-inline[b-u0ay8yanxm] { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:0.85rem;padding:0 0.2rem;vertical-align:middle;line-height:1;opacity:0.6;transition:opacity .15s,color .15s;display:inline-flex;align-items:center; }
.btn-help-inline:hover[b-u0ay8yanxm] { opacity:1;color:var(--rg-accent,#2563eb); }
[data-mode="dark"] .btn-help-inline:hover[b-u0ay8yanxm] { color:#93c5fd; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/EBITDA/EbitdaValidacionCruzada.razor.rz.scp.css */
/* ============================================================
   EbitdaValidacionCruzada — Cuentas sin clasificar
   ============================================================ */

.crud-container[b-xs1vn5uxrj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xs1vn5uxrj 0.3s ease-out; }
@keyframes slideUp-b-xs1vn5uxrj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-xs1vn5uxrj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xs1vn5uxrj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xs1vn5uxrj] { font-size: 1.75rem; }
.ev-icon-warn[b-xs1vn5uxrj] { color: var(--rg-warning,#d97706); }
.crud-title[b-xs1vn5uxrj]  { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-xs1vn5uxrj] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-xs1vn5uxrj] { display: flex; gap: 0.5rem; }

.btn-crud[b-xs1vn5uxrj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xs1vn5uxrj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xs1vn5uxrj] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xs1vn5uxrj] { filter: brightness(1.1); }
.btn-outline[b-xs1vn5uxrj] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-xs1vn5uxrj] { background: var(--rg-bg-hover); }
.btn-icon[b-xs1vn5uxrj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xs1vn5uxrj]  { color: var(--rg-accent); }
.btn-edit:hover[b-xs1vn5uxrj] { background: rgba(79,70,229,0.1); }

.crud-alert[b-xs1vn5uxrj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xs1vn5uxrj] { background: rgba(22,163,74,0.1); color: var(--rg-success,#16a34a); border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-xs1vn5uxrj]   { background: rgba(220,38,38,0.1);  color: var(--rg-danger,#dc2626);  border: 1px solid rgba(220,38,38,0.3); }
.crud-alert-close[b-xs1vn5uxrj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Panel OK */
.ev-ok-panel[b-xs1vn5uxrj] {
    display: flex; align-items: center; gap: 1.25rem;
    padding: 2rem; border-radius: 0.75rem;
    background: rgba(22,163,74,0.08);
    border: 1px solid rgba(22,163,74,0.3);
    margin-bottom: 1rem;
}
.ev-ok-icon[b-xs1vn5uxrj] { font-size: 2.5rem; color: var(--rg-success,#16a34a); flex-shrink: 0; }
.ev-ok-body[b-xs1vn5uxrj] { display: flex; flex-direction: column; gap: 0.25rem; }
.ev-ok-body strong[b-xs1vn5uxrj] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); }
.ev-ok-body span[b-xs1vn5uxrj]   { font-size: 0.82rem; color: var(--rg-text-secondary); }
[data-mode="dark"] .ev-ok-panel[b-xs1vn5uxrj] { background: rgba(22,163,74,0.1); }

/* Panel resumen */
.ev-summary[b-xs1vn5uxrj] {
    display: flex; align-items: flex-start; gap: 0.75rem;
    flex-wrap: wrap; margin-bottom: 1rem;
}
.ev-stat[b-xs1vn5uxrj] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.75rem 1rem; border-radius: 0.625rem; border: 1px solid var(--rg-border);
    background: var(--rg-bg-card); min-width: 180px;
}
.ev-stat i[b-xs1vn5uxrj] { font-size: 1.5rem; flex-shrink: 0; }
.ev-stat-warn i[b-xs1vn5uxrj] { color: var(--rg-warning,#d97706); }
.ev-stat-info i[b-xs1vn5uxrj] { color: var(--rg-accent); }
.ev-stat > div[b-xs1vn5uxrj] { display: flex; flex-direction: column; gap: 0.05rem; }
.ev-stat-num[b-xs1vn5uxrj]   { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary); }
.ev-stat-label[b-xs1vn5uxrj] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }

.ev-hint[b-xs1vn5uxrj] {
    flex: 1; min-width: 260px;
    display: flex; align-items: flex-start; gap: 0.5rem;
    padding: 0.75rem 1rem; border-radius: 0.625rem;
    background: rgba(217,119,6,0.07);
    border: 1px solid rgba(217,119,6,0.3);
    font-size: 0.78rem; color: var(--rg-text-secondary);
}
.ev-hint i[b-xs1vn5uxrj] { color: var(--rg-warning,#d97706); flex-shrink: 0; margin-top: 0.1rem; }
[data-mode="dark"] .ev-hint[b-xs1vn5uxrj] { background: rgba(217,119,6,0.1); }

/* Grid */
.crud-grid-wrapper[b-xs1vn5uxrj] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 340px); }
.crud-table[b-xs1vn5uxrj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xs1vn5uxrj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xs1vn5uxrj] { background: var(--rg-bg-subtle,#f8fafc); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.55rem 0.75rem; border-bottom: 2px solid var(--rg-border); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-xs1vn5uxrj] { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-xs1vn5uxrj] { background: var(--rg-bg-hover); }
.col-actions[b-xs1vn5uxrj] { width: 60px; text-align: center; }

.ev-account-id[b-xs1vn5uxrj]   { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.75rem; white-space: nowrap; color: var(--rg-accent); }
.ev-account-desc[b-xs1vn5uxrj] { max-width: 260px; }
.ev-total-col[b-xs1vn5uxrj]    { font-weight: 700; }
.ev-fecha[b-xs1vn5uxrj]        { font-size: 0.75rem; white-space: nowrap; }
.font-mono[b-xs1vn5uxrj]  { font-family: 'Cascadia Code','Fira Code',monospace; }
.text-right[b-xs1vn5uxrj] { text-align: right; }
.text-muted[b-xs1vn5uxrj] { color: var(--rg-text-muted); font-size: 0.75rem; }

.crud-loading[b-xs1vn5uxrj], .crud-empty-state[b-xs1vn5uxrj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-xs1vn5uxrj] { font-size: 2.5rem; }
.crud-spinner[b-xs1vn5uxrj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-xs1vn5uxrj 0.6s linear infinite; }

@keyframes spin-b-xs1vn5uxrj { to { transform: rotate(360deg); } }
.spin[b-xs1vn5uxrj] { animation: spin-b-xs1vn5uxrj 0.8s linear infinite; display: inline-block; }

@media (max-width: 768px) {
    .crud-container[b-xs1vn5uxrj] { padding: 0.75rem; }
    .crud-header[b-xs1vn5uxrj] { flex-direction: column; align-items: flex-start; }
    .ev-summary[b-xs1vn5uxrj] { flex-direction: column; }
}

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-xs1vn5uxrj]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-xs1vn5uxrj] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-xs1vn5uxrj]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-xs1vn5uxrj]        { max-width:720px; }
.modal-header[b-xs1vn5uxrj]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-xs1vn5uxrj] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-xs1vn5uxrj]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-xs1vn5uxrj] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-xs1vn5uxrj]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-xs1vn5uxrj]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-xs1vn5uxrj]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-xs1vn5uxrj]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-xs1vn5uxrj] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-xs1vn5uxrj]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-xs1vn5uxrj] { color:var(--rg-primary); }
.btn-help[b-xs1vn5uxrj]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-xs1vn5uxrj]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmaplicacionnovedades.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ukpe95ryvf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ukpe95ryvf 0.3s ease-out; }
@keyframes slideUp-b-ukpe95ryvf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ukpe95ryvf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ukpe95ryvf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ukpe95ryvf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ukpe95ryvf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ukpe95ryvf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ukpe95ryvf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ukpe95ryvf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ukpe95ryvf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ukpe95ryvf] { filter: brightness(1.1); }
.btn-outline[b-ukpe95ryvf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ukpe95ryvf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ukpe95ryvf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ukpe95ryvf] { filter: brightness(1.1); }
.btn-icon[b-ukpe95ryvf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ukpe95ryvf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ukpe95ryvf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ukpe95ryvf] { color: #ef4444; }
.btn-delete:hover[b-ukpe95ryvf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ukpe95ryvf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ukpe95ryvf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ukpe95ryvf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ukpe95ryvf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ukpe95ryvf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ukpe95ryvf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ukpe95ryvf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ukpe95ryvf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ukpe95ryvf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ukpe95ryvf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ukpe95ryvf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ukpe95ryvf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ukpe95ryvf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ukpe95ryvf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ukpe95ryvf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ukpe95ryvf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ukpe95ryvf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ukpe95ryvf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ukpe95ryvf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ukpe95ryvf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ukpe95ryvf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ukpe95ryvf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ukpe95ryvf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ukpe95ryvf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ukpe95ryvf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ukpe95ryvf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ukpe95ryvf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ukpe95ryvf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ukpe95ryvf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ukpe95ryvf] { display: block; }
.hide-on-cards[b-ukpe95ryvf] { display: none !important; }
.show-on-cards[b-ukpe95ryvf] { display: grid; }
.hide-on-grid[b-ukpe95ryvf] { display: none !important; }

/* Badges */
.badge[b-ukpe95ryvf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ukpe95ryvf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ukpe95ryvf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ukpe95ryvf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ukpe95ryvf] { text-align: center; }
.text-muted[b-ukpe95ryvf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ukpe95ryvf], .crud-empty-state[b-ukpe95ryvf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ukpe95ryvf] { font-size: 2rem; }
.crud-spinner[b-ukpe95ryvf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ukpe95ryvf 0.6s linear infinite; }
.crud-spinner-sm[b-ukpe95ryvf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ukpe95ryvf 0.6s linear infinite; }
@keyframes spin-b-ukpe95ryvf { to { transform: rotate(360deg); } }
.spin[b-ukpe95ryvf] { animation: spin-b-ukpe95ryvf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ukpe95ryvf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ukpe95ryvf 0.15s ease-out; }
.modal-container[b-ukpe95ryvf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ukpe95ryvf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ukpe95ryvf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ukpe95ryvf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ukpe95ryvf] { max-width: 420px; }
@keyframes fadeIn-b-ukpe95ryvf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ukpe95ryvf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ukpe95ryvf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ukpe95ryvf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ukpe95ryvf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ukpe95ryvf] { color: #dc2626; }
.modal-close[b-ukpe95ryvf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ukpe95ryvf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ukpe95ryvf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ukpe95ryvf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ukpe95ryvf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ukpe95ryvf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ukpe95ryvf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ukpe95ryvf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ukpe95ryvf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ukpe95ryvf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ukpe95ryvf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ukpe95ryvf] { flex: 2; }
.form-group label[b-ukpe95ryvf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ukpe95ryvf], .form-group select[b-ukpe95ryvf], .form-textarea[b-ukpe95ryvf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ukpe95ryvf], .form-group select:focus[b-ukpe95ryvf], .form-textarea:focus[b-ukpe95ryvf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ukpe95ryvf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ukpe95ryvf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ukpe95ryvf] { flex: 1; display: flex; align-items: center; }
.form-check[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ukpe95ryvf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ukpe95ryvf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ukpe95ryvf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ukpe95ryvf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ukpe95ryvf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ukpe95ryvf] { font-size: 3rem; }
.photo-placeholder span[b-ukpe95ryvf] { font-size: 0.78rem; }
.photo-actions[b-ukpe95ryvf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ukpe95ryvf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ukpe95ryvf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ukpe95ryvf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ukpe95ryvf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ukpe95ryvf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ukpe95ryvf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ukpe95ryvf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ukpe95ryvf] { filter: brightness(1.15); transform: scale(1.05); }
[b-ukpe95ryvf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ukpe95ryvf] { padding: 0.75rem; }
    .crud-header[b-ukpe95ryvf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ukpe95ryvf] { font-size: 1.1rem; }
    .btn-text[b-ukpe95ryvf] { display: none; }
    .form-row[b-ukpe95ryvf] { flex-direction: column; }
    .form-row-4[b-ukpe95ryvf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ukpe95ryvf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ukpe95ryvf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ukpe95ryvf] { padding: 0.75rem; }
    .modal-tabs[b-ukpe95ryvf] { overflow-x: auto; }
    .modal-tab[b-ukpe95ryvf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ukpe95ryvf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ukpe95ryvf] { display: grid !important; }
    .crud-cards-wrapper[b-ukpe95ryvf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ukpe95ryvf] { grid-template-columns: 1fr; }
    .card-details[b-ukpe95ryvf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ukpe95ryvf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ukpe95ryvf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ukpe95ryvf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ukpe95ryvf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmcatalogocuenta.razor.rz.scp.css */
/* ============================================================
   Catalogo de Cuentas — Estilos CRUD + Cards + Responsive
   ============================================================ */

.crud-container[b-u0ayq9bl4i] {
    padding: 1.25rem;
    max-width: 100%;
    animation: slideUp-b-u0ayq9bl4i 0.3s ease-out;
}

@keyframes slideUp-b-u0ayq9bl4i {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Header */
.crud-header[b-u0ayq9bl4i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.crud-header-left[b-u0ayq9bl4i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.crud-header-icon[b-u0ayq9bl4i] {
    font-size: 1.75rem;
    color: var(--rg-accent, #4f46e5);
}

.crud-title[b-u0ayq9bl4i] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0;
}

.crud-subtitle[b-u0ayq9bl4i] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}

.crud-header-actions[b-u0ayq9bl4i] {
    display: flex;
    gap: 0.5rem;
}

/* Buttons */
.btn-crud[b-u0ayq9bl4i] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-crud:disabled[b-u0ayq9bl4i] { opacity: 0.6; cursor: not-allowed; }

.btn-primary[b-u0ayq9bl4i] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-u0ayq9bl4i] { filter: brightness(1.1); }

.btn-outline[b-u0ayq9bl4i] {
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}
.btn-outline:hover:not(:disabled)[b-u0ayq9bl4i] { background: var(--rg-bg-hover, #f1f5f9); }

.btn-danger[b-u0ayq9bl4i] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-u0ayq9bl4i] { filter: brightness(1.1); }

.btn-icon[b-u0ayq9bl4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s;
    background: transparent;
}
.btn-edit[b-u0ayq9bl4i] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-u0ayq9bl4i] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-u0ayq9bl4i] { color: #ef4444; }
.btn-delete:hover[b-u0ayq9bl4i] { background: rgba(239, 68, 68, 0.1); }

.view-toggle[b-u0ayq9bl4i] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-u0ayq9bl4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
}
.crud-alert.success[b-u0ayq9bl4i] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-u0ayq9bl4i] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }

.crud-alert-close[b-u0ayq9bl4i] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
}

/* Search */
.crud-search-bar[b-u0ayq9bl4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    background: var(--rg-bg-card, #fff);
}
.crud-search-bar i[b-u0ayq9bl4i] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-u0ayq9bl4i] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.8rem;
    background: transparent;
    color: var(--rg-text-primary, #1e293b);
}
.crud-search-clear[b-u0ayq9bl4i] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
}
.crud-count[b-u0ayq9bl4i] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    white-space: nowrap;
}

/* ---- Grid (tabla) ---- */
.crud-grid-wrapper[b-u0ayq9bl4i] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: calc(100vh - 280px);
}

.crud-table[b-u0ayq9bl4i] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}
.crud-table thead[b-u0ayq9bl4i] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-u0ayq9bl4i] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    text-align: left;
    padding: 0.625rem 0.75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.crud-table td[b-u0ayq9bl4i] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
}
.crud-table tbody tr:hover[b-u0ayq9bl4i] { background: var(--rg-bg-hover, #f8fafc); }

.col-cuenta[b-u0ayq9bl4i] { width: 120px; }
.col-desc[b-u0ayq9bl4i] { min-width: 200px; }
.col-sm[b-u0ayq9bl4i] { width: 80px; text-align: center; }
.col-actions[b-u0ayq9bl4i] { width: 80px; text-align: center; white-space: nowrap; }

/* ---- Cards (tarjetas) ---- */
.crud-cards-wrapper[b-u0ayq9bl4i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 0.75rem;
    max-height: calc(100vh - 280px);
    overflow-y: auto;
    padding: 0.25rem;
}

.crud-card[b-u0ayq9bl4i] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.875rem;
    transition: all 0.15s;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.crud-card:hover[b-u0ayq9bl4i] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.card-header-row[b-u0ayq9bl4i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.card-id[b-u0ayq9bl4i] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--rg-accent, #4f46e5);
}
.card-badges[b-u0ayq9bl4i] {
    display: flex;
    gap: 0.35rem;
}
.card-title[b-u0ayq9bl4i] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}
.card-details[b-u0ayq9bl4i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
}
.card-detail[b-u0ayq9bl4i] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.card-label[b-u0ayq9bl4i] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.card-value[b-u0ayq9bl4i] {
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
}
.card-actions[b-u0ayq9bl4i] {
    display: flex;
    justify-content: flex-end;
    gap: 0.25rem;
    margin-top: auto;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rg-border-light, #f1f5f9);
}

/* View toggle: show/hide */
.show-on-grid[b-u0ayq9bl4i] { display: block; }
.hide-on-cards[b-u0ayq9bl4i] { display: none !important; }
.show-on-cards[b-u0ayq9bl4i] { display: grid; }
.hide-on-grid[b-u0ayq9bl4i] { display: none !important; }

/* Badges */
.badge[b-u0ayq9bl4i] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 600;
}
.badge-yes[b-u0ayq9bl4i] { background: #ecfdf5; color: #065f46; }
.badge-no[b-u0ayq9bl4i] { background: #f1f5f9; color: #64748b; }
.badge-info[b-u0ayq9bl4i] { background: #ecfeff; color: #0e7490; }

/* Utilities */
.font-mono[b-u0ayq9bl4i] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-u0ayq9bl4i] { text-align: center; }
.text-success[b-u0ayq9bl4i] { color: #16a34a; }
.text-info[b-u0ayq9bl4i] { color: #0891b2; }
.text-muted[b-u0ayq9bl4i] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-u0ayq9bl4i], .crud-empty-state[b-u0ayq9bl4i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}
.crud-empty-state i[b-u0ayq9bl4i] { font-size: 2rem; }

.crud-spinner[b-u0ayq9bl4i] {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: var(--rg-accent, #4f46e5);
    border-radius: 50%;
    animation: spin-b-u0ayq9bl4i 0.6s linear infinite;
}
.crud-spinner-sm[b-u0ayq9bl4i] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-u0ayq9bl4i 0.6s linear infinite;
}
@keyframes spin-b-u0ayq9bl4i { to { transform: rotate(360deg); } }
.spin[b-u0ayq9bl4i] { animation: spin-b-u0ayq9bl4i 0.8s linear infinite; }

/* ---- Modal (sibling backdrop/container) ---- */
.modal-backdrop[b-u0ayq9bl4i] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: fadeIn-b-u0ayq9bl4i 0.15s ease-out;
}

.modal-container[b-u0ayq9bl4i] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}

.modal-dialog[b-u0ayq9bl4i] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 640px;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: scaleIn-b-u0ayq9bl4i 0.2s ease-out;
}
.modal-sm[b-u0ayq9bl4i] { max-width: 420px; }

@keyframes fadeIn-b-u0ayq9bl4i { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-u0ayq9bl4i {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.modal-header[b-u0ayq9bl4i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.modal-header h2[b-u0ayq9bl4i] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-header-danger[b-u0ayq9bl4i] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-u0ayq9bl4i] { color: #dc2626; }

.modal-close[b-u0ayq9bl4i] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-u0ayq9bl4i] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }

.modal-body[b-u0ayq9bl4i] { padding: 1.25rem; }

.modal-footer[b-u0ayq9bl4i] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

/* Form */
.form-row[b-u0ayq9bl4i] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.form-group[b-u0ayq9bl4i] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.form-group.flex-2[b-u0ayq9bl4i] { flex: 2; }
.form-group label[b-u0ayq9bl4i] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.form-group input[b-u0ayq9bl4i],
.form-group select[b-u0ayq9bl4i] {
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color 0.15s;
}
.form-group input:focus[b-u0ayq9bl4i],
.form-group select:focus[b-u0ayq9bl4i] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}
.form-group input.readonly[b-u0ayq9bl4i] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-muted, #94a3b8);
}

.form-check-group[b-u0ayq9bl4i] {
    flex: 1;
    display: flex;
    align-items: center;
}
.form-check[b-u0ayq9bl4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
}
.form-check input[type="checkbox"][b-u0ayq9bl4i] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--rg-accent, #4f46e5);
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .crud-container[b-u0ayq9bl4i] { padding: 0.75rem; }
    .crud-header[b-u0ayq9bl4i] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-u0ayq9bl4i] { font-size: 1.1rem; }
    .btn-text[b-u0ayq9bl4i] { display: none; }
    .form-row[b-u0ayq9bl4i] { flex-direction: column; }
    .modal-dialog[b-u0ayq9bl4i] { width: 98%; max-height: 90vh; }
    .modal-body[b-u0ayq9bl4i] { padding: 1rem; }

    /* En movil: ocultar grid, mostrar cards por defecto */
    .crud-grid-wrapper.show-on-grid[b-u0ayq9bl4i] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-u0ayq9bl4i] { display: grid !important; }

    .crud-cards-wrapper[b-u0ayq9bl4i] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-u0ayq9bl4i] {
        grid-template-columns: 1fr;
    }
    .card-details[b-u0ayq9bl4i] {
        flex-direction: column;
        gap: 0.35rem;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmcentrocosto.razor.rz.scp.css */
/* Centro de Costo CRUD */
.crud-container[b-7b8ds97oi9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7b8ds97oi9 0.3s ease-out; }
@keyframes slideUp-b-7b8ds97oi9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.crud-header[b-7b8ds97oi9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7b8ds97oi9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7b8ds97oi9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7b8ds97oi9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7b8ds97oi9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7b8ds97oi9] { display: flex; gap: 0.5rem; }
.btn-crud[b-7b8ds97oi9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7b8ds97oi9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7b8ds97oi9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7b8ds97oi9] { filter: brightness(1.1); }
.btn-outline[b-7b8ds97oi9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7b8ds97oi9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7b8ds97oi9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7b8ds97oi9] { filter: brightness(1.1); }
.btn-icon[b-7b8ds97oi9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7b8ds97oi9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7b8ds97oi9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7b8ds97oi9] { color: #ef4444; }
.btn-delete:hover[b-7b8ds97oi9] { background: rgba(239, 68, 68, 0.1); }
.crud-alert[b-7b8ds97oi9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7b8ds97oi9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7b8ds97oi9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7b8ds97oi9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
.crud-search-bar[b-7b8ds97oi9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7b8ds97oi9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7b8ds97oi9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7b8ds97oi9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7b8ds97oi9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.crud-grid-wrapper[b-7b8ds97oi9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7b8ds97oi9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7b8ds97oi9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7b8ds97oi9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7b8ds97oi9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7b8ds97oi9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7b8ds97oi9] { width: 80px; text-align: center; white-space: nowrap; }
.font-mono[b-7b8ds97oi9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-7b8ds97oi9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.crud-loading[b-7b8ds97oi9], .crud-empty-state[b-7b8ds97oi9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7b8ds97oi9] { font-size: 2rem; }
.crud-spinner[b-7b8ds97oi9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7b8ds97oi9 0.6s linear infinite; }
.crud-spinner-sm[b-7b8ds97oi9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7b8ds97oi9 0.6s linear infinite; }
@keyframes spin-b-7b8ds97oi9 { to { transform: rotate(360deg); } }
.spin[b-7b8ds97oi9] { animation: spin-b-7b8ds97oi9 0.8s linear infinite; }
.modal-backdrop[b-7b8ds97oi9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7b8ds97oi9 0.15s ease-out; }
.modal-container[b-7b8ds97oi9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7b8ds97oi9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 500px; max-height: 85vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7b8ds97oi9 0.2s ease-out; }
.modal-sm[b-7b8ds97oi9] { max-width: 420px; }
@keyframes fadeIn-b-7b8ds97oi9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7b8ds97oi9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-7b8ds97oi9] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.modal-header h2[b-7b8ds97oi9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7b8ds97oi9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7b8ds97oi9] { color: #dc2626; }
.modal-close[b-7b8ds97oi9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7b8ds97oi9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7b8ds97oi9] { padding: 1.25rem; }
.modal-footer[b-7b8ds97oi9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.form-group[b-7b8ds97oi9] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.form-group label[b-7b8ds97oi9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7b8ds97oi9] { padding: 0.5rem 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7b8ds97oi9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7b8ds97oi9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
@media (max-width: 768px) {
    .crud-container[b-7b8ds97oi9] { padding: 0.75rem; }
    .crud-header[b-7b8ds97oi9] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-7b8ds97oi9] { display: none; }
    .modal-dialog[b-7b8ds97oi9] { width: 98%; max-height: 90vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmcierredelmes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6ja5w0hrfu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6ja5w0hrfu 0.3s ease-out; }
@keyframes slideUp-b-6ja5w0hrfu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6ja5w0hrfu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6ja5w0hrfu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6ja5w0hrfu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6ja5w0hrfu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6ja5w0hrfu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6ja5w0hrfu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6ja5w0hrfu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6ja5w0hrfu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6ja5w0hrfu] { filter: brightness(1.1); }
.btn-outline[b-6ja5w0hrfu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6ja5w0hrfu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6ja5w0hrfu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6ja5w0hrfu] { filter: brightness(1.1); }
.btn-icon[b-6ja5w0hrfu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6ja5w0hrfu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6ja5w0hrfu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6ja5w0hrfu] { color: #ef4444; }
.btn-delete:hover[b-6ja5w0hrfu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6ja5w0hrfu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6ja5w0hrfu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6ja5w0hrfu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6ja5w0hrfu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6ja5w0hrfu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6ja5w0hrfu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6ja5w0hrfu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6ja5w0hrfu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6ja5w0hrfu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6ja5w0hrfu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6ja5w0hrfu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6ja5w0hrfu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6ja5w0hrfu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6ja5w0hrfu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6ja5w0hrfu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6ja5w0hrfu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6ja5w0hrfu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6ja5w0hrfu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6ja5w0hrfu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6ja5w0hrfu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6ja5w0hrfu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6ja5w0hrfu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6ja5w0hrfu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6ja5w0hrfu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6ja5w0hrfu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6ja5w0hrfu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6ja5w0hrfu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6ja5w0hrfu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6ja5w0hrfu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6ja5w0hrfu] { display: block; }
.hide-on-cards[b-6ja5w0hrfu] { display: none !important; }
.show-on-cards[b-6ja5w0hrfu] { display: grid; }
.hide-on-grid[b-6ja5w0hrfu] { display: none !important; }

/* Badges */
.badge[b-6ja5w0hrfu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6ja5w0hrfu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6ja5w0hrfu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6ja5w0hrfu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6ja5w0hrfu] { text-align: center; }
.text-muted[b-6ja5w0hrfu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6ja5w0hrfu], .crud-empty-state[b-6ja5w0hrfu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6ja5w0hrfu] { font-size: 2rem; }
.crud-spinner[b-6ja5w0hrfu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6ja5w0hrfu 0.6s linear infinite; }
.crud-spinner-sm[b-6ja5w0hrfu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6ja5w0hrfu 0.6s linear infinite; }
@keyframes spin-b-6ja5w0hrfu { to { transform: rotate(360deg); } }
.spin[b-6ja5w0hrfu] { animation: spin-b-6ja5w0hrfu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6ja5w0hrfu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6ja5w0hrfu 0.15s ease-out; }
.modal-container[b-6ja5w0hrfu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6ja5w0hrfu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6ja5w0hrfu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6ja5w0hrfu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6ja5w0hrfu] { max-width: 420px; }
@keyframes fadeIn-b-6ja5w0hrfu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6ja5w0hrfu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6ja5w0hrfu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6ja5w0hrfu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6ja5w0hrfu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6ja5w0hrfu] { color: #dc2626; }
.modal-close[b-6ja5w0hrfu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6ja5w0hrfu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6ja5w0hrfu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6ja5w0hrfu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6ja5w0hrfu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6ja5w0hrfu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6ja5w0hrfu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6ja5w0hrfu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6ja5w0hrfu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6ja5w0hrfu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6ja5w0hrfu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6ja5w0hrfu] { flex: 2; }
.form-group label[b-6ja5w0hrfu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6ja5w0hrfu], .form-group select[b-6ja5w0hrfu], .form-textarea[b-6ja5w0hrfu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6ja5w0hrfu], .form-group select:focus[b-6ja5w0hrfu], .form-textarea:focus[b-6ja5w0hrfu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6ja5w0hrfu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6ja5w0hrfu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6ja5w0hrfu] { flex: 1; display: flex; align-items: center; }
.form-check[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6ja5w0hrfu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6ja5w0hrfu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6ja5w0hrfu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6ja5w0hrfu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6ja5w0hrfu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6ja5w0hrfu] { font-size: 3rem; }
.photo-placeholder span[b-6ja5w0hrfu] { font-size: 0.78rem; }
.photo-actions[b-6ja5w0hrfu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6ja5w0hrfu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6ja5w0hrfu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6ja5w0hrfu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6ja5w0hrfu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6ja5w0hrfu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6ja5w0hrfu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6ja5w0hrfu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6ja5w0hrfu] { filter: brightness(1.15); transform: scale(1.05); }
[b-6ja5w0hrfu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6ja5w0hrfu] { padding: 0.75rem; }
    .crud-header[b-6ja5w0hrfu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6ja5w0hrfu] { font-size: 1.1rem; }
    .btn-text[b-6ja5w0hrfu] { display: none; }
    .form-row[b-6ja5w0hrfu] { flex-direction: column; }
    .form-row-4[b-6ja5w0hrfu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6ja5w0hrfu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6ja5w0hrfu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6ja5w0hrfu] { padding: 0.75rem; }
    .modal-tabs[b-6ja5w0hrfu] { overflow-x: auto; }
    .modal-tab[b-6ja5w0hrfu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6ja5w0hrfu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6ja5w0hrfu] { display: grid !important; }
    .crud-cards-wrapper[b-6ja5w0hrfu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6ja5w0hrfu] { grid-template-columns: 1fr; }
    .card-details[b-6ja5w0hrfu] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6ja5w0hrfu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6ja5w0hrfu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6ja5w0hrfu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6ja5w0hrfu] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmcierrediario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4a68xp0cok] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4a68xp0cok 0.3s ease-out; }
@keyframes slideUp-b-4a68xp0cok { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4a68xp0cok] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4a68xp0cok] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4a68xp0cok] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4a68xp0cok] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4a68xp0cok] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4a68xp0cok] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4a68xp0cok] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4a68xp0cok] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4a68xp0cok] { filter: brightness(1.1); }
.btn-outline[b-4a68xp0cok] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4a68xp0cok] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4a68xp0cok] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4a68xp0cok] { filter: brightness(1.1); }
.btn-icon[b-4a68xp0cok] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4a68xp0cok] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4a68xp0cok] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4a68xp0cok] { color: #ef4444; }
.btn-delete:hover[b-4a68xp0cok] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4a68xp0cok] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4a68xp0cok] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4a68xp0cok] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4a68xp0cok] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4a68xp0cok] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4a68xp0cok] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4a68xp0cok] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4a68xp0cok] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4a68xp0cok] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4a68xp0cok] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4a68xp0cok] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4a68xp0cok] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4a68xp0cok] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4a68xp0cok] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4a68xp0cok] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4a68xp0cok] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4a68xp0cok] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4a68xp0cok] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4a68xp0cok] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4a68xp0cok] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4a68xp0cok] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4a68xp0cok] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4a68xp0cok] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4a68xp0cok] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4a68xp0cok] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4a68xp0cok] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4a68xp0cok] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4a68xp0cok] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4a68xp0cok] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4a68xp0cok] { display: block; }
.hide-on-cards[b-4a68xp0cok] { display: none !important; }
.show-on-cards[b-4a68xp0cok] { display: grid; }
.hide-on-grid[b-4a68xp0cok] { display: none !important; }

/* Badges */
.badge[b-4a68xp0cok] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4a68xp0cok] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4a68xp0cok] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4a68xp0cok] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4a68xp0cok] { text-align: center; }
.text-muted[b-4a68xp0cok] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4a68xp0cok], .crud-empty-state[b-4a68xp0cok] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4a68xp0cok] { font-size: 2rem; }
.crud-spinner[b-4a68xp0cok] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4a68xp0cok 0.6s linear infinite; }
.crud-spinner-sm[b-4a68xp0cok] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4a68xp0cok 0.6s linear infinite; }
@keyframes spin-b-4a68xp0cok { to { transform: rotate(360deg); } }
.spin[b-4a68xp0cok] { animation: spin-b-4a68xp0cok 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4a68xp0cok] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4a68xp0cok 0.15s ease-out; }
.modal-container[b-4a68xp0cok] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4a68xp0cok] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4a68xp0cok 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4a68xp0cok] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4a68xp0cok] { max-width: 420px; }
@keyframes fadeIn-b-4a68xp0cok { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4a68xp0cok { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4a68xp0cok] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4a68xp0cok] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4a68xp0cok] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4a68xp0cok] { color: #dc2626; }
.modal-close[b-4a68xp0cok] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4a68xp0cok] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4a68xp0cok] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4a68xp0cok] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4a68xp0cok] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4a68xp0cok] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4a68xp0cok] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4a68xp0cok] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4a68xp0cok] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4a68xp0cok] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4a68xp0cok] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4a68xp0cok] { flex: 2; }
.form-group label[b-4a68xp0cok] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4a68xp0cok], .form-group select[b-4a68xp0cok], .form-textarea[b-4a68xp0cok] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4a68xp0cok], .form-group select:focus[b-4a68xp0cok], .form-textarea:focus[b-4a68xp0cok] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4a68xp0cok] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4a68xp0cok] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4a68xp0cok] { flex: 1; display: flex; align-items: center; }
.form-check[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4a68xp0cok] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4a68xp0cok] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4a68xp0cok] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4a68xp0cok] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4a68xp0cok] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4a68xp0cok] { font-size: 3rem; }
.photo-placeholder span[b-4a68xp0cok] { font-size: 0.78rem; }
.photo-actions[b-4a68xp0cok] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4a68xp0cok] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4a68xp0cok] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4a68xp0cok] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4a68xp0cok] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4a68xp0cok] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4a68xp0cok] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4a68xp0cok] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4a68xp0cok] { filter: brightness(1.15); transform: scale(1.05); }
[b-4a68xp0cok] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4a68xp0cok] { padding: 0.75rem; }
    .crud-header[b-4a68xp0cok] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4a68xp0cok] { font-size: 1.1rem; }
    .btn-text[b-4a68xp0cok] { display: none; }
    .form-row[b-4a68xp0cok] { flex-direction: column; }
    .form-row-4[b-4a68xp0cok] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4a68xp0cok] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4a68xp0cok] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4a68xp0cok] { padding: 0.75rem; }
    .modal-tabs[b-4a68xp0cok] { overflow-x: auto; }
    .modal-tab[b-4a68xp0cok] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4a68xp0cok] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4a68xp0cok] { display: grid !important; }
    .crud-cards-wrapper[b-4a68xp0cok] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4a68xp0cok] { grid-template-columns: 1fr; }
    .card-details[b-4a68xp0cok] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4a68xp0cok] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4a68xp0cok] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4a68xp0cok] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4a68xp0cok] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctbcatalogoplantilla_v2.razor.rz.scp.css */
/* ============================================================
   Plantillas de Catálogo de Cuentas — CRUD estándar + wizard + 2 columnas
   (bloque CRUD copiado de Frmclientes.razor.css, requerido por CSS isolation)
   ============================================================ */

.crud-container[b-7onks68tni] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7onks68tni 0.3s ease-out; }
@keyframes slideUp-b-7onks68tni { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7onks68tni] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7onks68tni] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7onks68tni] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7onks68tni] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7onks68tni] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7onks68tni] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7onks68tni] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7onks68tni] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7onks68tni] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7onks68tni] { filter: brightness(1.1); }
.btn-outline[b-7onks68tni] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7onks68tni] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7onks68tni] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7onks68tni] { filter: brightness(1.1); }
.btn-icon[b-7onks68tni] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7onks68tni] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7onks68tni] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7onks68tni] { color: #ef4444; }
.btn-delete:hover[b-7onks68tni] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7onks68tni] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7onks68tni] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7onks68tni] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-7onks68tni] { background: rgba(16,185,129,0.12); color: #86efac; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-7onks68tni] { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* Search/count */
.crud-count[b-7onks68tni] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7onks68tni] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-7onks68tni] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7onks68tni] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7onks68tni] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7onks68tni] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7onks68tni] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7onks68tni] { width: 80px; text-align: center; white-space: nowrap; }

/* Badges */
.badge[b-7onks68tni] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7onks68tni] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7onks68tni] { background: #f1f5f9; color: #64748b; }
.badge-info[b-7onks68tni] { background: #eff6ff; color: #1d4ed8; }
.badge-err[b-7onks68tni] { background: #fef2f2; color: #991b1b; }
[data-mode="dark"] .badge-yes[b-7onks68tni] { background: rgba(16,185,129,0.18); color: #86efac; }
[data-mode="dark"] .badge-no[b-7onks68tni] { background: rgba(148,163,184,0.18); color: #cbd5e1; }
[data-mode="dark"] .badge-info[b-7onks68tni] { background: rgba(59,130,246,0.18); color: #93c5fd; }
[data-mode="dark"] .badge-err[b-7onks68tni] { background: rgba(239,68,68,0.18); color: #fca5a5; }

/* Utilities */
.font-mono[b-7onks68tni] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7onks68tni] { text-align: center; }
.text-muted[b-7onks68tni] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.pl-check-ok[b-7onks68tni] { color: #16a34a; font-size: 0.95rem; }
[data-mode="dark"] .pl-check-ok[b-7onks68tni] { color: #4ade80; }

/* Loading / Empty */
.crud-loading[b-7onks68tni], .crud-empty-state[b-7onks68tni] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }
.crud-empty-state i[b-7onks68tni] { font-size: 2rem; }
.crud-spinner[b-7onks68tni] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7onks68tni 0.6s linear infinite; }
.crud-spinner-sm[b-7onks68tni] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7onks68tni 0.6s linear infinite; }
@keyframes spin-b-7onks68tni { to { transform: rotate(360deg); } }
.spin[b-7onks68tni] { animation: spin-b-7onks68tni 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-7onks68tni] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7onks68tni 0.15s ease-out; }
.modal-container[b-7onks68tni] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7onks68tni] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7onks68tni 0.2s ease-out; }
.modal-lg[b-7onks68tni] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7onks68tni] { max-width: 460px; }
@keyframes fadeIn-b-7onks68tni { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7onks68tni { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7onks68tni] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7onks68tni] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7onks68tni] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7onks68tni] { color: #dc2626; }
.modal-close[b-7onks68tni] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7onks68tni] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7onks68tni] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7onks68tni] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-7onks68tni] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-3[b-7onks68tni] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7onks68tni] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7onks68tni] { flex: 2; }
.form-group label[b-7onks68tni] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7onks68tni], .form-group select[b-7onks68tni] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7onks68tni], .form-group select:focus[b-7onks68tni] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7onks68tni], .form-group input:disabled[b-7onks68tni] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-check-group[b-7onks68tni] { flex: 1; display: flex; align-items: center; }
.form-check[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7onks68tni] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-7onks68tni] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.5rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7onks68tni] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7onks68tni] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7onks68tni] { background:rgba(37,99,235,.25); }

/* ── Contenido del modal de ayuda ────────────────────────────────────── */
.help-icon-header[b-7onks68tni] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-7onks68tni] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-7onks68tni] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-7onks68tni] { border-bottom: none; }
.help-section p[b-7onks68tni] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section-title[b-7onks68tni] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-7onks68tni] { color: var(--rg-accent,#2563eb); }
.help-tip[b-7onks68tni] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-7onks68tni] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-7onks68tni] { background: rgba(37,99,235,0.12); }
.help-steps[b-7onks68tni] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-7onks68tni] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-7onks68tni] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-7onks68tni] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }

/* ════════════════════════ Layout 2 columnas ════════════════════════════ */
.pl-layout[b-7onks68tni] { display: grid; grid-template-columns: 280px 1fr; gap: 1rem; align-items: start; }

/* Panel izquierdo */
.pl-side[b-7onks68tni] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; display: flex; flex-direction: column; max-height: calc(100vh - 200px); }
.pl-side-header[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; padding: 0.65rem 0.85rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.pl-side-header i[b-7onks68tni] { color: var(--rg-accent, #4f46e5); }
.pl-side-header .crud-count[b-7onks68tni] { margin-left: auto; }
.pl-side-list[b-7onks68tni] { overflow-y: auto; flex: 1; }

.pl-cat-item[b-7onks68tni] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); cursor: pointer; transition: background 0.12s; }
.pl-cat-item:hover[b-7onks68tni] { background: var(--rg-bg-hover, #f8fafc); }
.pl-cat-item.active[b-7onks68tni] { background: rgba(79,70,229,0.1); border-left: 3px solid var(--rg-accent, #4f46e5); }
[data-mode="dark"] .pl-cat-item.active[b-7onks68tni] { background: rgba(99,102,241,0.18); }
.pl-cat-info[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
.pl-cat-info > i[b-7onks68tni] { color: var(--rg-accent, #4f46e5); font-size: 1rem; flex-shrink: 0; }
.pl-cat-text[b-7onks68tni] { display: flex; flex-direction: column; min-width: 0; }
.pl-cat-name[b-7onks68tni] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-cat-count[b-7onks68tni] { font-size: 0.68rem; color: var(--rg-text-muted, #94a3b8); }
.pl-cat-actions[b-7onks68tni] { display: flex; gap: 0.1rem; flex-shrink: 0; }
.pl-cat-actions .btn-icon[b-7onks68tni] { width: 1.7rem; height: 1.7rem; }

/* Panel derecho */
.pl-main[b-7onks68tni] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; min-height: 300px; }
.pl-main-empty[b-7onks68tni] { padding: 4rem 2rem; }
.pl-main-header[b-7onks68tni] { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.65rem 0.85rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); flex-wrap: wrap; }
.pl-main-title[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.pl-main-title > i[b-7onks68tni] { color: var(--rg-accent, #4f46e5); }
.pl-main-actions[b-7onks68tni] { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.pl-main .crud-grid-wrapper[b-7onks68tni] { border: none; border-radius: 0; max-height: calc(100vh - 280px); }

/* ════════════════════════ Wizard de importación ════════════════════════ */
.pl-stepper[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); }
.pl-step[b-7onks68tni] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.pl-step.active[b-7onks68tni] { color: var(--rg-text-primary, #1e293b); }
.pl-step-num[b-7onks68tni] { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--rg-bg-card, #fff); border: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; font-weight: 700; color: var(--rg-text-muted, #94a3b8); }
.pl-step.active .pl-step-num[b-7onks68tni] { background: var(--rg-accent, #4f46e5); border-color: var(--rg-accent, #4f46e5); color: #fff; }
.pl-step.done .pl-step-num[b-7onks68tni] { background: #16a34a; border-color: #16a34a; color: #fff; }
.pl-step-line[b-7onks68tni] { flex: 1; height: 2px; background: var(--rg-border, #e2e8f0); max-width: 60px; }

.pl-upload-zone[b-7onks68tni] { display: flex; flex-direction: column; align-items: center; gap: 0.85rem; padding: 2.5rem 1rem; text-align: center; }
.pl-upload-zone > i[b-7onks68tni] { font-size: 3rem; color: var(--rg-accent, #4f46e5); }
.pl-upload-zone p[b-7onks68tni] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin: 0; max-width: 460px; }
.pl-file-info[b-7onks68tni] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; color: #166534; background: rgba(22,163,74,0.1); border: 1px solid rgba(22,163,74,0.3); border-radius: 0.5rem; padding: 0.5rem 0.85rem; margin-top: 0.5rem; }
[data-mode="dark"] .pl-file-info[b-7onks68tni] { color: #86efac; }

.pl-hint[b-7onks68tni] { font-size: 0.8rem; color: var(--rg-text-secondary, #475569); margin-bottom: 0.65rem; }
.pl-req[b-7onks68tni] { color: #ef4444; font-weight: 700; }
.pl-map-select[b-7onks68tni] { width: 100%; padding: 0.35rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.pl-map-select:focus[b-7onks68tni] { border-color: var(--rg-accent, #4f46e5); }

.pl-valid-summary[b-7onks68tni] { display: flex; gap: 0.75rem; margin-bottom: 1rem; }
.pl-valid-card[b-7onks68tni] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.2rem; padding: 0.85rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-subtle, #f8fafc); }
.pl-valid-card.ok[b-7onks68tni] { border-color: rgba(22,163,74,0.4); background: rgba(22,163,74,0.08); }
.pl-valid-card.err[b-7onks68tni] { border-color: rgba(239,68,68,0.4); background: rgba(239,68,68,0.08); }
.pl-valid-num[b-7onks68tni] { font-size: 1.5rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.pl-valid-lbl[b-7onks68tni] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted, #94a3b8); font-weight: 600; }
.pl-sub[b-7onks68tni] { font-size: 0.82rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0.85rem 0 0.4rem; }
.pl-badge-err[b-7onks68tni] { white-space: normal; text-align: left; }
.pl-replace[b-7onks68tni] { margin-top: 1rem; font-size: 0.82rem; }

.pl-confirm-rep[b-7onks68tni] { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.5rem; padding: 1.5rem 1rem; }
.pl-confirm-rep > i[b-7onks68tni] { font-size: 2.5rem; color: #d97706; }
.pl-confirm-rep p[b-7onks68tni] { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin: 0; max-width: 520px; }

/* Responsive */
@media (max-width: 900px) {
    .pl-layout[b-7onks68tni] { grid-template-columns: 1fr; }
    .pl-side[b-7onks68tni] { max-height: 260px; }
}
@media (max-width: 768px) {
    .crud-container[b-7onks68tni] { padding: 0.75rem; }
    .crud-header[b-7onks68tni] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-7onks68tni] { display: none; }
    .form-row[b-7onks68tni], .form-row-3[b-7onks68tni] { flex-direction: column; grid-template-columns: 1fr; }
    .modal-dialog[b-7onks68tni] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7onks68tni] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .pl-valid-summary[b-7onks68tni] { flex-direction: column; }
}

/* === Checklist de replicación en vivo === */
.pl-progress-head[b-7onks68tni] { display:flex; align-items:center; gap:0.75rem; margin-bottom:0.6rem; }
.pl-progress-bar[b-7onks68tni] { flex:1; height:0.6rem; background:var(--rg-bg-subtle,#f1f5f9); border-radius:1rem; overflow:hidden; border:1px solid var(--rg-border,#e2e8f0); }
.pl-progress-fill[b-7onks68tni] { height:100%; background:linear-gradient(90deg,var(--rg-accent,#2563eb),var(--rg-success,#16a34a)); transition:width 0.25s ease; }
.pl-progress-txt[b-7onks68tni] { font-size:0.8rem; font-weight:700; color:var(--rg-text-primary,#1e293b); white-space:nowrap; }
.pl-chk-counters[b-7onks68tni] { display:flex; gap:0.9rem; margin-bottom:0.75rem; font-size:0.78rem; font-weight:600; }
.pl-chk-c.ok[b-7onks68tni] { color:var(--rg-success,#16a34a); } .pl-chk-c.skip[b-7onks68tni] { color:var(--rg-text-muted,#94a3b8); } .pl-chk-c.err[b-7onks68tni] { color:var(--rg-danger,#dc2626); }
[data-mode="dark"] .pl-chk-c.ok[b-7onks68tni] { color:#86efac; } [data-mode="dark"] .pl-chk-c.err[b-7onks68tni] { color:#fca5a5; }

.pl-checklist[b-7onks68tni] { display:flex; flex-direction:column; gap:2px; max-height:340px; overflow-y:auto; border:1px solid var(--rg-border,#e2e8f0); border-radius:0.5rem; padding:0.35rem; }
.pl-chk-row[b-7onks68tni] { display:flex; align-items:center; gap:0.55rem; padding:0.32rem 0.5rem; border-radius:0.35rem; font-size:0.82rem; }
.pl-chk-row:hover[b-7onks68tni] { background:var(--rg-bg-hover,#f1f5f9); }
.pl-chk-row.run[b-7onks68tni] { background:rgba(37,99,235,0.07); }
.pl-chk-ico[b-7onks68tni] { width:1.1rem; text-align:center; flex-shrink:0; }
.pl-chk-row.ok .pl-chk-ico[b-7onks68tni] { color:var(--rg-success,#16a34a); }
.pl-chk-row.skip .pl-chk-ico[b-7onks68tni] { color:var(--rg-text-muted,#94a3b8); }
.pl-chk-row.error .pl-chk-ico[b-7onks68tni] { color:var(--rg-danger,#dc2626); }
.pl-chk-row.run .pl-chk-ico[b-7onks68tni] { color:var(--rg-accent,#2563eb); }
.pl-chk-db[b-7onks68tni] { font-family:'Cascadia Code',monospace; color:var(--rg-text-primary,#1e293b); flex:1; }
.pl-chk-info[b-7onks68tni] { font-size:0.74rem; color:var(--rg-success,#16a34a); font-weight:600; }
.pl-chk-info.muted[b-7onks68tni] { color:var(--rg-text-muted,#94a3b8); font-weight:400; max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
[data-mode="dark"] .pl-chk-info[b-7onks68tni] { color:#86efac; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctbflujocaja.razor.rz.scp.css */
/* ============================================================
   Frmctbflujocaja — Flujo de Caja (Contabilidad)
   Tokens --rg-* + soporte dark mode. CSS aislado auto-contenido.
   ============================================================ */

.fc-container[b-mn0ky0gzhb] { padding: 1.25rem; animation: slideUp-b-mn0ky0gzhb 0.3s ease-out; }
@keyframes slideUp-b-mn0ky0gzhb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.rg-slide-up[b-mn0ky0gzhb] { animation: slideUp-b-mn0ky0gzhb 0.3s ease-out; }

/* Header */
.fc-header[b-mn0ky0gzhb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.fc-header-left[b-mn0ky0gzhb] { display: flex; align-items: center; gap: 0.75rem; }
.fc-header-icon[b-mn0ky0gzhb] { font-size: 1.75rem; color: var(--rg-accent); }
.fc-title[b-mn0ky0gzhb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: .4rem; }
.fc-subtitle[b-mn0ky0gzhb] { font-size: 0.78rem; color: var(--rg-text-muted); }
.fc-header-actions[b-mn0ky0gzhb] { display: flex; gap: 0.5rem; }

/* Botones globales */
.btn-crud[b-mn0ky0gzhb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; transition: all 0.15s; background: transparent; color: var(--rg-text-secondary); }
.btn-crud:disabled[b-mn0ky0gzhb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-mn0ky0gzhb] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-mn0ky0gzhb] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-mn0ky0gzhb] { background: var(--rg-bg-hover); }
.btn-text[b-mn0ky0gzhb] { display: inline; }
@media (max-width: 768px) { .btn-text[b-mn0ky0gzhb] { display: none; } }

/* Botón ayuda */
.btn-help[b-mn0ky0gzhb] { background: rgba(37,99,235,0.08); color: var(--rg-accent); border: 1px solid rgba(37,99,235,0.25); padding: 0.2rem 0.4rem; border-radius: 0.4rem; font-size: 0.8rem; cursor: pointer; display: inline-flex; align-items: center; }
.btn-help:hover[b-mn0ky0gzhb] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-mn0ky0gzhb] { background: rgba(37,99,235,0.15); color: #93c5fd; border-color: rgba(37,99,235,0.35); }

/* Alertas */
.crud-alert[b-mn0ky0gzhb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.82rem; font-weight: 500; }
.crud-alert.info[b-mn0ky0gzhb]    { background: rgba(37,99,235,0.1);  color: #1e40af; border: 1px solid rgba(37,99,235,0.3); }
.crud-alert.success[b-mn0ky0gzhb] { background: rgba(22,163,74,0.1);  color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-mn0ky0gzhb]   { background: rgba(220,38,38,0.1);  color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.info[b-mn0ky0gzhb]    { color: #93c5fd; }
[data-mode="dark"] .crud-alert.success[b-mn0ky0gzhb] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-mn0ky0gzhb]   { color: #fca5a5; }
.crud-alert-close[b-mn0ky0gzhb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filtros */
.fc-filtros[b-mn0ky0gzhb] { display: flex; align-items: flex-end; gap: 0.6rem; padding: 0.75rem; margin-bottom: 1rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.5rem; flex-wrap: wrap; }
.filtro-item[b-mn0ky0gzhb] { display: flex; flex-direction: column; gap: 0.2rem; }
.filtro-item label[b-mn0ky0gzhb] { font-size: 0.65rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.form-input[b-mn0ky0gzhb] { padding: 0.45rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.4rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }
.form-input:focus[b-mn0ky0gzhb] { border-color: var(--rg-accent); }

/* Loading / empty */
.crud-loading[b-mn0ky0gzhb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-spinner[b-mn0ky0gzhb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: fc-spin-b-mn0ky0gzhb 0.6s linear infinite; }
@keyframes fc-spin-b-mn0ky0gzhb { to { transform: rotate(360deg); } }
.spin[b-mn0ky0gzhb] { animation: fc-spin-b-mn0ky0gzhb 0.8s linear infinite; display: inline-block; }
.crud-empty-state[b-mn0ky0gzhb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 3rem; color: var(--rg-text-muted); font-size: 0.9rem; }

/* KPIs */
.fc-kpis[b-mn0ky0gzhb] { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.75rem; margin-bottom: 1.25rem; }
.fc-kpi[b-mn0ky0gzhb] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.8rem 0.9rem; border-left: 4px solid var(--rg-accent); }
.fc-kpi.k-ef[b-mn0ky0gzhb] { border-left-color: #16a34a; }
.fc-kpi.k-ch[b-mn0ky0gzhb] { border-left-color: #0891b2; }
.fc-kpi.k-tr[b-mn0ky0gzhb] { border-left-color: #2563eb; }
.fc-kpi.k-dp[b-mn0ky0gzhb] { border-left-color: #7c3aed; }
.fc-kpi.k-tj[b-mn0ky0gzhb] { border-left-color: #d97706; }
.fc-kpi-label[b-mn0ky0gzhb] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; display: flex; align-items: center; gap: 0.3rem; }
.fc-kpi-value[b-mn0ky0gzhb] { font-size: 1.1rem; font-weight: 700; margin-top: 0.25rem; color: var(--rg-text-primary); font-variant-numeric: tabular-nums; }
.fc-kpi-sub[b-mn0ky0gzhb] { font-size: 0.7rem; color: var(--rg-text-muted); margin-top: 0.15rem; }

/* Grid de cuadros */
.fc-grid[b-mn0ky0gzhb] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.fc-span2[b-mn0ky0gzhb] { grid-column: 1 / -1; }
.fc-card[b-mn0ky0gzhb] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.fc-card-head[b-mn0ky0gzhb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.7rem 0.9rem; border-bottom: 1px solid var(--rg-border); background: var(--rg-bg-subtle); }
.fc-num[b-mn0ky0gzhb] { width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--rg-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 0.72rem; font-weight: 700; }
.fc-card-head h3[b-mn0ky0gzhb] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.fc-table-wrap[b-mn0ky0gzhb] { overflow-x: auto; }
.fc-empty-mini[b-mn0ky0gzhb] { padding: 1.25rem; text-align: center; color: var(--rg-text-muted); font-size: 0.8rem; font-style: italic; }

/* Tablas */
.fc-table[b-mn0ky0gzhb] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.fc-table th[b-mn0ky0gzhb] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.5rem 0.75rem; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid var(--rg-border); white-space: nowrap; }
.fc-table th.num[b-mn0ky0gzhb], .fc-table td.num[b-mn0ky0gzhb] { text-align: right; font-variant-numeric: tabular-nums; font-family: 'Cascadia Code','Fira Code',monospace; white-space: nowrap; }
.fc-table td[b-mn0ky0gzhb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.fc-table tbody tr:hover td[b-mn0ky0gzhb] { background: var(--rg-bg-hover); }
.fc-table .pct[b-mn0ky0gzhb] { color: var(--rg-text-muted); font-size: 0.74rem; }
.fc-foot td[b-mn0ky0gzhb] { background: var(--rg-bg-subtle); font-weight: 700; border-top: 2px solid var(--rg-text-primary); border-bottom: none; color: var(--rg-text-primary); }

/* Badges */
.fc-badge[b-mn0ky0gzhb] { display: inline-block; padding: 0.1rem 0.5rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.b-ef[b-mn0ky0gzhb]  { background: rgba(22,163,74,0.12);  color: #166534; }
.b-ch[b-mn0ky0gzhb]  { background: rgba(8,145,178,0.12);  color: #155e75; }
.b-tr[b-mn0ky0gzhb]  { background: rgba(37,99,235,0.12);  color: #1e40af; }
.b-dp[b-mn0ky0gzhb]  { background: rgba(124,58,237,0.12); color: #5b21b6; }
.b-tj[b-mn0ky0gzhb]  { background: rgba(217,119,6,0.12);  color: #92400e; }
.b-doc[b-mn0ky0gzhb] { background: rgba(22,163,74,0.12);  color: #166534; }
.b-ncf[b-mn0ky0gzhb] { background: rgba(26,58,92,0.1);    color: #1a3a5c; }
[data-mode="dark"] .b-ef[b-mn0ky0gzhb]  { color: #86efac; }
[data-mode="dark"] .b-ch[b-mn0ky0gzhb]  { color: #67e8f9; }
[data-mode="dark"] .b-tr[b-mn0ky0gzhb]  { color: #93c5fd; }
[data-mode="dark"] .b-dp[b-mn0ky0gzhb]  { color: #c4b5fd; }
[data-mode="dark"] .b-tj[b-mn0ky0gzhb]  { color: #fcd34d; }
[data-mode="dark"] .b-doc[b-mn0ky0gzhb] { color: #86efac; }
[data-mode="dark"] .b-ncf[b-mn0ky0gzhb] { color: #93c5fd; }

@media (max-width: 900px) { .fc-kpis[b-mn0ky0gzhb] { grid-template-columns: repeat(2,1fr); } .fc-grid[b-mn0ky0gzhb] { grid-template-columns: 1fr; } }

/* ── Modal (ayuda) ───────────────────────────────────────────────────────── */
.modal-backdrop[b-mn0ky0gzhb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-mn0ky0gzhb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-mn0ky0gzhb] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-mn0ky0gzhb] { max-width: 680px; }
.modal-header[b-mn0ky0gzhb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-mn0ky0gzhb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-mn0ky0gzhb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-mn0ky0gzhb] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-mn0ky0gzhb] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-mn0ky0gzhb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Contenido de ayuda */
.help-icon-header[b-mn0ky0gzhb] { color: var(--rg-accent); margin-right: 0.25rem; }
.help-body[b-mn0ky0gzhb] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-mn0ky0gzhb] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-mn0ky0gzhb] { border-bottom: none; }
.help-section p[b-mn0ky0gzhb] { font-size: 0.85rem; color: var(--rg-text-secondary); margin-bottom: 0.4rem; }
.help-section-title[b-mn0ky0gzhb] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.65rem; }
.help-section-title i[b-mn0ky0gzhb] { color: var(--rg-accent); }
.help-tip[b-mn0ky0gzhb] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-mn0ky0gzhb] { color: var(--rg-accent); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-mn0ky0gzhb] { background: rgba(37,99,235,0.12); }
.help-steps[b-mn0ky0gzhb] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-mn0ky0gzhb] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-mn0ky0gzhb] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-mn0ky0gzhb] { font-size: 0.85rem; color: var(--rg-text-secondary); padding-top: 0.1rem; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctbimplementarcatalogo.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4bo1vs2k6g] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4bo1vs2k6g 0.3s ease-out; }
@keyframes slideUp-b-4bo1vs2k6g { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4bo1vs2k6g] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4bo1vs2k6g] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4bo1vs2k6g] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4bo1vs2k6g] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4bo1vs2k6g] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4bo1vs2k6g] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4bo1vs2k6g] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4bo1vs2k6g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4bo1vs2k6g] { filter: brightness(1.1); }
.btn-outline[b-4bo1vs2k6g] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4bo1vs2k6g] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4bo1vs2k6g] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4bo1vs2k6g] { filter: brightness(1.1); }
.btn-icon[b-4bo1vs2k6g] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4bo1vs2k6g] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4bo1vs2k6g] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4bo1vs2k6g] { color: #ef4444; }
.btn-delete:hover[b-4bo1vs2k6g] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4bo1vs2k6g] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4bo1vs2k6g] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4bo1vs2k6g] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4bo1vs2k6g] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4bo1vs2k6g] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4bo1vs2k6g] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4bo1vs2k6g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4bo1vs2k6g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4bo1vs2k6g] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4bo1vs2k6g] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4bo1vs2k6g] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4bo1vs2k6g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4bo1vs2k6g] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4bo1vs2k6g] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4bo1vs2k6g] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4bo1vs2k6g] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4bo1vs2k6g] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4bo1vs2k6g] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4bo1vs2k6g] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4bo1vs2k6g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4bo1vs2k6g] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4bo1vs2k6g] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4bo1vs2k6g] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4bo1vs2k6g] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4bo1vs2k6g] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4bo1vs2k6g] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4bo1vs2k6g] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4bo1vs2k6g] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4bo1vs2k6g] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4bo1vs2k6g] { display: block; }
.hide-on-cards[b-4bo1vs2k6g] { display: none !important; }
.show-on-cards[b-4bo1vs2k6g] { display: grid; }
.hide-on-grid[b-4bo1vs2k6g] { display: none !important; }

/* Badges */
.badge[b-4bo1vs2k6g] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4bo1vs2k6g] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4bo1vs2k6g] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4bo1vs2k6g] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4bo1vs2k6g] { text-align: center; }
.text-muted[b-4bo1vs2k6g] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4bo1vs2k6g], .crud-empty-state[b-4bo1vs2k6g] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4bo1vs2k6g] { font-size: 2rem; }
.crud-spinner[b-4bo1vs2k6g] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4bo1vs2k6g 0.6s linear infinite; }
.crud-spinner-sm[b-4bo1vs2k6g] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4bo1vs2k6g 0.6s linear infinite; }
@keyframes spin-b-4bo1vs2k6g { to { transform: rotate(360deg); } }
.spin[b-4bo1vs2k6g] { animation: spin-b-4bo1vs2k6g 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4bo1vs2k6g] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4bo1vs2k6g 0.15s ease-out; }
.modal-container[b-4bo1vs2k6g] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4bo1vs2k6g] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4bo1vs2k6g 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-4bo1vs2k6g] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4bo1vs2k6g] { max-width: 420px; }
@keyframes fadeIn-b-4bo1vs2k6g { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4bo1vs2k6g { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4bo1vs2k6g] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4bo1vs2k6g] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4bo1vs2k6g] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4bo1vs2k6g] { color: #dc2626; }
.modal-close[b-4bo1vs2k6g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4bo1vs2k6g] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4bo1vs2k6g] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4bo1vs2k6g] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4bo1vs2k6g] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4bo1vs2k6g] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4bo1vs2k6g] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4bo1vs2k6g] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4bo1vs2k6g] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4bo1vs2k6g] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4bo1vs2k6g] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4bo1vs2k6g] { flex: 2; }
.form-group label[b-4bo1vs2k6g] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4bo1vs2k6g], .form-group select[b-4bo1vs2k6g], .form-textarea[b-4bo1vs2k6g] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4bo1vs2k6g], .form-group select:focus[b-4bo1vs2k6g], .form-textarea:focus[b-4bo1vs2k6g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4bo1vs2k6g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4bo1vs2k6g] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4bo1vs2k6g] { flex: 1; display: flex; align-items: center; }
.form-check[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4bo1vs2k6g] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4bo1vs2k6g] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4bo1vs2k6g] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4bo1vs2k6g] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4bo1vs2k6g] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4bo1vs2k6g] { font-size: 3rem; }
.photo-placeholder span[b-4bo1vs2k6g] { font-size: 0.78rem; }
.photo-actions[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4bo1vs2k6g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-4bo1vs2k6g] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4bo1vs2k6g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4bo1vs2k6g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4bo1vs2k6g] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4bo1vs2k6g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4bo1vs2k6g] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4bo1vs2k6g] { filter: brightness(1.15); transform: scale(1.05); }
[b-4bo1vs2k6g] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4bo1vs2k6g] { padding: 0.75rem; }
    .crud-header[b-4bo1vs2k6g] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4bo1vs2k6g] { font-size: 1.1rem; }
    .btn-text[b-4bo1vs2k6g] { display: none; }
    .form-row[b-4bo1vs2k6g] { flex-direction: column; }
    .form-row-4[b-4bo1vs2k6g] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4bo1vs2k6g] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4bo1vs2k6g] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4bo1vs2k6g] { padding: 0.75rem; }
    .modal-tabs[b-4bo1vs2k6g] { overflow-x: auto; }
    .modal-tab[b-4bo1vs2k6g] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4bo1vs2k6g] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4bo1vs2k6g] { display: grid !important; }
    .crud-cards-wrapper[b-4bo1vs2k6g] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4bo1vs2k6g] { grid-template-columns: 1fr; }
    .card-details[b-4bo1vs2k6g] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-4bo1vs2k6g] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4bo1vs2k6g] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4bo1vs2k6g] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4bo1vs2k6g] { background:rgba(37,99,235,.25); }

/* === Implementar Catálogo — específico === */
.ic-bloqueo[b-4bo1vs2k6g] { display:flex; gap:1rem; align-items:flex-start; background:rgba(220,38,38,0.06); border:1px solid rgba(220,38,38,0.3); border-radius:0.75rem; padding:1.5rem; }
.ic-bloqueo i[b-4bo1vs2k6g] { font-size:2.5rem; color:var(--rg-danger,#dc2626); flex-shrink:0; }
.ic-bloqueo h3[b-4bo1vs2k6g] { margin:0 0 0.4rem; color:var(--rg-text-primary,#1e293b); font-size:1.05rem; }
.ic-bloqueo p[b-4bo1vs2k6g] { margin:0.2rem 0; color:var(--rg-text-secondary,#475569); font-size:0.88rem; }
.ic-bloqueo-hint[b-4bo1vs2k6g] { font-size:0.8rem !important; color:var(--rg-text-muted,#94a3b8) !important; }

.ic-step[b-4bo1vs2k6g] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:0.75rem; padding:1.1rem 1.25rem; margin-bottom:1rem; }
.ic-step-title[b-4bo1vs2k6g] { display:flex; align-items:center; gap:0.5rem; font-size:0.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:0.75rem; }
.ic-num[b-4bo1vs2k6g] { display:inline-flex; align-items:center; justify-content:center; width:1.6rem; height:1.6rem; border-radius:50%; background:var(--rg-accent,#4f46e5); color:#fff; font-size:0.8rem; font-weight:700; }
.ic-hint[b-4bo1vs2k6g] { font-size:0.82rem; color:var(--rg-text-secondary,#475569); margin-bottom:0.6rem; }

.ic-map-input[b-4bo1vs2k6g] { width:100%; padding:0.35rem 0.5rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:0.375rem; font-family:'Cascadia Code',monospace; font-size:0.78rem; background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b); }
.ic-map-input.ic-pend[b-4bo1vs2k6g] { border-color:rgba(217,119,6,0.5); background:rgba(217,119,6,0.05); }
.ic-ubic[b-4bo1vs2k6g] { font-size:0.7rem; color:var(--rg-text-muted,#94a3b8); max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.ic-actions[b-4bo1vs2k6g] { display:flex; align-items:center; gap:0.75rem; margin-top:0.85rem; flex-wrap:wrap; }
.ic-counter[b-4bo1vs2k6g] { font-size:0.8rem; color:var(--rg-text-secondary,#475569); font-weight:600; }
.ic-warn-text[b-4bo1vs2k6g] { font-size:0.78rem; color:var(--rg-warning,#d97706); }

.ic-preview-summary[b-4bo1vs2k6g] { display:flex; gap:0.5rem; flex-wrap:wrap; margin-bottom:0.75rem; }
.ic-chip[b-4bo1vs2k6g] { font-size:0.72rem; font-weight:700; padding:0.2rem 0.6rem; border-radius:1rem; }
.ic-chip-info[b-4bo1vs2k6g] { background:rgba(37,99,235,0.12); color:#2563eb; }
.ic-chip-ok[b-4bo1vs2k6g] { background:rgba(22,163,74,0.12); color:#16a34a; }
.ic-chip-warn[b-4bo1vs2k6g] { background:rgba(217,119,6,0.12); color:#d97706; }
.ic-chip-danger[b-4bo1vs2k6g] { background:rgba(220,38,38,0.12); color:#dc2626; }
[data-mode="dark"] .ic-chip-info[b-4bo1vs2k6g] { color:#93c5fd; } [data-mode="dark"] .ic-chip-ok[b-4bo1vs2k6g] { color:#86efac; }
[data-mode="dark"] .ic-chip-warn[b-4bo1vs2k6g] { color:#fcd34d; } [data-mode="dark"] .ic-chip-danger[b-4bo1vs2k6g] { color:#fca5a5; }
.ic-warn-box[b-4bo1vs2k6g] { background:rgba(220,38,38,0.05); border:1px solid rgba(220,38,38,0.25); border-radius:0.5rem; padding:0.75rem 1rem; margin-bottom:0.75rem; font-size:0.82rem; color:var(--rg-text-secondary,#475569); }
.ic-warn-box ul[b-4bo1vs2k6g] { margin:0.4rem 0 0; padding-left:1.2rem; }

/* === Acordeón por tabla === */
.ic-acc-actions[b-4bo1vs2k6g] { margin-left: auto; display: inline-flex; gap: 0.25rem; }
.ic-acc-toggle-all[b-4bo1vs2k6g] {
    background: transparent; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.35rem;
    width: 28px; height: 28px; cursor: pointer; color: var(--rg-text-secondary,#475569);
    display: inline-flex; align-items: center; justify-content: center; font-size: 0.8rem;
}
.ic-acc-toggle-all:hover[b-4bo1vs2k6g] { background: var(--rg-bg-hover,#f1f5f9); color: var(--rg-accent,#2563eb); }

.ic-acc[b-4bo1vs2k6g] { border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; margin-bottom: 0.5rem; overflow: hidden; background: var(--rg-bg-card,#fff); }
.ic-acc-header[b-4bo1vs2k6g] {
    display: flex; align-items: center; gap: 0.55rem;
    padding: 0.55rem 0.85rem; cursor: pointer;
    background: var(--rg-bg-subtle,#f8fafc);
    border-bottom: 1px solid transparent;
    transition: background 0.15s;
}
.ic-acc-header:hover[b-4bo1vs2k6g] { background: var(--rg-bg-hover,#f1f5f9); }
.ic-acc-header.open[b-4bo1vs2k6g] { border-bottom-color: var(--rg-border,#e2e8f0); background: rgba(37,99,235,0.06); }
.ic-acc-chevron[b-4bo1vs2k6g] { transition: transform 0.2s; color: var(--rg-text-muted,#94a3b8); font-size: 0.82rem; }
.ic-acc-header.open .ic-acc-chevron[b-4bo1vs2k6g] { transform: rotate(90deg); color: var(--rg-accent,#2563eb); }
.ic-acc-icon[b-4bo1vs2k6g] { color: var(--rg-accent,#2563eb); font-size: 0.95rem; }
.ic-acc-name[b-4bo1vs2k6g] { font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); flex: 0 0 auto; }
.ic-acc-count[b-4bo1vs2k6g] { font-size: 0.74rem; color: var(--rg-text-muted,#94a3b8); margin-left: auto; }
.ic-acc-pend[b-4bo1vs2k6g] { font-size: 0.7rem; font-weight: 700; padding: 0.12rem 0.5rem; border-radius: 1rem;
    background: rgba(217,119,6,0.12); color: var(--rg-warning,#d97706); }
.ic-acc-ok[b-4bo1vs2k6g]   { font-size: 0.7rem; font-weight: 700; padding: 0.12rem 0.5rem; border-radius: 1rem;
    background: rgba(22,163,74,0.12); color: var(--rg-success,#16a34a); display: inline-flex; align-items: center; gap: 0.25rem; }
[data-mode="dark"] .ic-acc-pend[b-4bo1vs2k6g] { color: #fcd34d; }
[data-mode="dark"] .ic-acc-ok[b-4bo1vs2k6g] { color: #86efac; }

.ic-acc-body[b-4bo1vs2k6g] { border-radius: 0 !important; border: none !important; margin: 0; max-height: 360px; }
.ic-acc-body .crud-table[b-4bo1vs2k6g] { border-radius: 0; }

/* === Tabs Implementar / Exclusiones === */
.ic-tabs[b-4bo1vs2k6g] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); margin: 0 0 1rem; }
.ic-tab[b-4bo1vs2k6g] {
    background: transparent; border: none; padding: 0.6rem 1rem; cursor: pointer;
    color: var(--rg-text-muted,#94a3b8); font-size: 0.88rem; font-weight: 600;
    display: inline-flex; align-items: center; gap: 0.5rem;
    border-bottom: 2px solid transparent; margin-bottom: -2px;
}
.ic-tab:hover[b-4bo1vs2k6g] { color: var(--rg-text-primary,#1e293b); }
.ic-tab.active[b-4bo1vs2k6g] { color: var(--rg-accent,#2563eb); border-bottom-color: var(--rg-accent,#2563eb); }
.ic-tab i[b-4bo1vs2k6g] { font-size: 1rem; }
.ic-tab-count[b-4bo1vs2k6g] {
    background: var(--rg-bg-subtle,#f1f5f9); color: var(--rg-text-muted,#94a3b8);
    font-size: 0.7rem; padding: 0.05rem 0.45rem; border-radius: 1rem; font-weight: 700;
}
.ic-tab.active .ic-tab-count[b-4bo1vs2k6g] { background: rgba(37,99,235,0.15); color: var(--rg-accent,#2563eb); }

/* Acciones del tab exclusiones */
.ic-excl-actions[b-4bo1vs2k6g] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }

/* Botón ✕ inline en el header del acordeón para excluir tabla completa */
.ic-acc-excl-btn[b-4bo1vs2k6g] {
    background: transparent; border: 1px solid var(--rg-border,#e2e8f0);
    border-radius: 0.35rem; width: 26px; height: 26px;
    cursor: pointer; color: var(--rg-text-muted,#94a3b8);
    display: inline-flex; align-items: center; justify-content: center;
    margin-left: 0.4rem; font-size: 0.8rem; transition: all 0.15s;
}
.ic-acc-excl-btn:hover[b-4bo1vs2k6g] { background: rgba(220,38,38,0.1); color: var(--rg-danger,#dc2626); border-color: var(--rg-danger,#dc2626); }

/* Switch (reutilizado en tabla exclusiones) */
.adm-switch[b-4bo1vs2k6g] { position: relative; display: inline-block; width: 38px; height: 20px; cursor: pointer; }
.adm-switch input[b-4bo1vs2k6g] { opacity: 0; width: 0; height: 0; }
.adm-switch-slider[b-4bo1vs2k6g] {
    position: absolute; inset: 0; background: var(--rg-text-muted,#94a3b8);
    border-radius: 20px; transition: 0.2s;
}
.adm-switch-slider[b-4bo1vs2k6g]::before {
    content: ""; position: absolute; left: 2px; bottom: 2px; width: 16px; height: 16px;
    background: #fff; border-radius: 50%; transition: 0.2s;
}
.adm-switch input:checked + .adm-switch-slider[b-4bo1vs2k6g] { background: var(--rg-success,#16a34a); }
.adm-switch input:checked + .adm-switch-slider[b-4bo1vs2k6g]::before { transform: translateX(18px); }

/* === Flujo simplificado (sin remapeo) === */
.ic-prev-meta[b-4bo1vs2k6g] { font-size: 0.78rem; color: var(--rg-text-muted,#94a3b8); font-weight: 500; margin-left: 0.5rem; }
.ic-preview-grid[b-4bo1vs2k6g] { max-height: 420px; overflow-y: auto; }
.ic-step-final[b-4bo1vs2k6g] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.ic-final-row[b-4bo1vs2k6g] { display: flex; gap: 1rem; align-items: flex-start; }
.ic-final-info[b-4bo1vs2k6g] { flex: 1; display: flex; gap: 0.65rem; align-items: flex-start; color: var(--rg-text-secondary,#475569); }
.ic-final-info i[b-4bo1vs2k6g] { color: var(--rg-accent,#2563eb); font-size: 1.05rem; margin-top: 0.15rem; flex-shrink: 0; }
.ic-final-info p[b-4bo1vs2k6g] { font-size: 0.85rem; margin-bottom: 0.4rem; }
.ic-final-info ul[b-4bo1vs2k6g] { padding-left: 1.1rem; }
.ic-final-info li[b-4bo1vs2k6g] { font-size: 0.82rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.25rem; }
.btn-impl[b-4bo1vs2k6g] { flex-shrink: 0; font-weight: 700; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_auxiliar.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-cb96p22ss9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-cb96p22ss9 0.3s ease-out; }
@keyframes slideUp-b-cb96p22ss9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-cb96p22ss9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-cb96p22ss9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-cb96p22ss9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-cb96p22ss9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-cb96p22ss9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-cb96p22ss9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-cb96p22ss9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-cb96p22ss9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-cb96p22ss9] { filter: brightness(1.1); }
.btn-outline[b-cb96p22ss9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-cb96p22ss9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-cb96p22ss9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-cb96p22ss9] { filter: brightness(1.1); }
.btn-icon[b-cb96p22ss9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-cb96p22ss9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-cb96p22ss9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-cb96p22ss9] { color: #ef4444; }
.btn-delete:hover[b-cb96p22ss9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-cb96p22ss9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-cb96p22ss9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-cb96p22ss9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-cb96p22ss9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-cb96p22ss9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-cb96p22ss9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-cb96p22ss9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-cb96p22ss9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-cb96p22ss9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-cb96p22ss9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-cb96p22ss9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-cb96p22ss9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-cb96p22ss9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-cb96p22ss9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-cb96p22ss9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-cb96p22ss9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-cb96p22ss9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-cb96p22ss9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-cb96p22ss9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-cb96p22ss9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-cb96p22ss9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-cb96p22ss9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-cb96p22ss9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-cb96p22ss9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-cb96p22ss9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-cb96p22ss9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-cb96p22ss9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-cb96p22ss9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-cb96p22ss9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-cb96p22ss9] { display: block; }
.hide-on-cards[b-cb96p22ss9] { display: none !important; }
.show-on-cards[b-cb96p22ss9] { display: grid; }
.hide-on-grid[b-cb96p22ss9] { display: none !important; }

/* Badges */
.badge[b-cb96p22ss9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-cb96p22ss9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-cb96p22ss9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-cb96p22ss9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-cb96p22ss9] { text-align: center; }
.text-muted[b-cb96p22ss9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-cb96p22ss9], .crud-empty-state[b-cb96p22ss9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-cb96p22ss9] { font-size: 2rem; }
.crud-spinner[b-cb96p22ss9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-cb96p22ss9 0.6s linear infinite; }
.crud-spinner-sm[b-cb96p22ss9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-cb96p22ss9 0.6s linear infinite; }
@keyframes spin-b-cb96p22ss9 { to { transform: rotate(360deg); } }
.spin[b-cb96p22ss9] { animation: spin-b-cb96p22ss9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-cb96p22ss9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-cb96p22ss9 0.15s ease-out; }
.modal-container[b-cb96p22ss9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-cb96p22ss9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-cb96p22ss9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-cb96p22ss9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-cb96p22ss9] { max-width: 420px; }
@keyframes fadeIn-b-cb96p22ss9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-cb96p22ss9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-cb96p22ss9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-cb96p22ss9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-cb96p22ss9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-cb96p22ss9] { color: #dc2626; }
.modal-close[b-cb96p22ss9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-cb96p22ss9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-cb96p22ss9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-cb96p22ss9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-cb96p22ss9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-cb96p22ss9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-cb96p22ss9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-cb96p22ss9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-cb96p22ss9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-cb96p22ss9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-cb96p22ss9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-cb96p22ss9] { flex: 2; }
.form-group label[b-cb96p22ss9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-cb96p22ss9], .form-group select[b-cb96p22ss9], .form-textarea[b-cb96p22ss9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-cb96p22ss9], .form-group select:focus[b-cb96p22ss9], .form-textarea:focus[b-cb96p22ss9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-cb96p22ss9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-cb96p22ss9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-cb96p22ss9] { flex: 1; display: flex; align-items: center; }
.form-check[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-cb96p22ss9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-cb96p22ss9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-cb96p22ss9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-cb96p22ss9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-cb96p22ss9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-cb96p22ss9] { font-size: 3rem; }
.photo-placeholder span[b-cb96p22ss9] { font-size: 0.78rem; }
.photo-actions[b-cb96p22ss9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-cb96p22ss9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-cb96p22ss9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-cb96p22ss9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-cb96p22ss9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-cb96p22ss9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-cb96p22ss9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-cb96p22ss9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-cb96p22ss9] { filter: brightness(1.15); transform: scale(1.05); }
[b-cb96p22ss9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-cb96p22ss9] { padding: 0.75rem; }
    .crud-header[b-cb96p22ss9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-cb96p22ss9] { font-size: 1.1rem; }
    .btn-text[b-cb96p22ss9] { display: none; }
    .form-row[b-cb96p22ss9] { flex-direction: column; }
    .form-row-4[b-cb96p22ss9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-cb96p22ss9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-cb96p22ss9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-cb96p22ss9] { padding: 0.75rem; }
    .modal-tabs[b-cb96p22ss9] { overflow-x: auto; }
    .modal-tab[b-cb96p22ss9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-cb96p22ss9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-cb96p22ss9] { display: grid !important; }
    .crud-cards-wrapper[b-cb96p22ss9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-cb96p22ss9] { grid-template-columns: 1fr; }
    .card-details[b-cb96p22ss9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-cb96p22ss9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cb96p22ss9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cb96p22ss9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cb96p22ss9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_codificacion_recibo_ingreso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-f01te2vpj2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-f01te2vpj2 0.3s ease-out; }
@keyframes slideUp-b-f01te2vpj2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-f01te2vpj2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-f01te2vpj2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-f01te2vpj2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-f01te2vpj2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-f01te2vpj2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-f01te2vpj2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-f01te2vpj2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-f01te2vpj2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-f01te2vpj2] { filter: brightness(1.1); }
.btn-outline[b-f01te2vpj2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-f01te2vpj2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-f01te2vpj2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-f01te2vpj2] { filter: brightness(1.1); }
.btn-icon[b-f01te2vpj2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-f01te2vpj2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-f01te2vpj2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-f01te2vpj2] { color: #ef4444; }
.btn-delete:hover[b-f01te2vpj2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-f01te2vpj2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-f01te2vpj2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-f01te2vpj2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-f01te2vpj2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-f01te2vpj2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-f01te2vpj2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-f01te2vpj2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-f01te2vpj2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-f01te2vpj2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-f01te2vpj2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-f01te2vpj2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-f01te2vpj2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-f01te2vpj2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-f01te2vpj2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-f01te2vpj2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-f01te2vpj2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-f01te2vpj2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-f01te2vpj2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-f01te2vpj2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-f01te2vpj2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-f01te2vpj2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-f01te2vpj2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-f01te2vpj2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-f01te2vpj2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-f01te2vpj2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-f01te2vpj2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-f01te2vpj2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-f01te2vpj2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-f01te2vpj2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-f01te2vpj2] { display: block; }
.hide-on-cards[b-f01te2vpj2] { display: none !important; }
.show-on-cards[b-f01te2vpj2] { display: grid; }
.hide-on-grid[b-f01te2vpj2] { display: none !important; }

/* Badges */
.badge[b-f01te2vpj2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-f01te2vpj2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-f01te2vpj2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-f01te2vpj2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-f01te2vpj2] { text-align: center; }
.text-muted[b-f01te2vpj2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-f01te2vpj2], .crud-empty-state[b-f01te2vpj2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-f01te2vpj2] { font-size: 2rem; }
.crud-spinner[b-f01te2vpj2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-f01te2vpj2 0.6s linear infinite; }
.crud-spinner-sm[b-f01te2vpj2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-f01te2vpj2 0.6s linear infinite; }
@keyframes spin-b-f01te2vpj2 { to { transform: rotate(360deg); } }
.spin[b-f01te2vpj2] { animation: spin-b-f01te2vpj2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-f01te2vpj2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-f01te2vpj2 0.15s ease-out; }
.modal-container[b-f01te2vpj2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-f01te2vpj2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-f01te2vpj2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-f01te2vpj2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-f01te2vpj2] { max-width: 420px; }
@keyframes fadeIn-b-f01te2vpj2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-f01te2vpj2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-f01te2vpj2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-f01te2vpj2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-f01te2vpj2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-f01te2vpj2] { color: #dc2626; }
.modal-close[b-f01te2vpj2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-f01te2vpj2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-f01te2vpj2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-f01te2vpj2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-f01te2vpj2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-f01te2vpj2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-f01te2vpj2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-f01te2vpj2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-f01te2vpj2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-f01te2vpj2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-f01te2vpj2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-f01te2vpj2] { flex: 2; }
.form-group label[b-f01te2vpj2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-f01te2vpj2], .form-group select[b-f01te2vpj2], .form-textarea[b-f01te2vpj2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-f01te2vpj2], .form-group select:focus[b-f01te2vpj2], .form-textarea:focus[b-f01te2vpj2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-f01te2vpj2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-f01te2vpj2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-f01te2vpj2] { flex: 1; display: flex; align-items: center; }
.form-check[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-f01te2vpj2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-f01te2vpj2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-f01te2vpj2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-f01te2vpj2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-f01te2vpj2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-f01te2vpj2] { font-size: 3rem; }
.photo-placeholder span[b-f01te2vpj2] { font-size: 0.78rem; }
.photo-actions[b-f01te2vpj2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-f01te2vpj2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-f01te2vpj2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-f01te2vpj2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-f01te2vpj2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-f01te2vpj2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-f01te2vpj2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-f01te2vpj2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-f01te2vpj2] { filter: brightness(1.15); transform: scale(1.05); }
[b-f01te2vpj2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-f01te2vpj2] { padding: 0.75rem; }
    .crud-header[b-f01te2vpj2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-f01te2vpj2] { font-size: 1.1rem; }
    .btn-text[b-f01te2vpj2] { display: none; }
    .form-row[b-f01te2vpj2] { flex-direction: column; }
    .form-row-4[b-f01te2vpj2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-f01te2vpj2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-f01te2vpj2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-f01te2vpj2] { padding: 0.75rem; }
    .modal-tabs[b-f01te2vpj2] { overflow-x: auto; }
    .modal-tab[b-f01te2vpj2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-f01te2vpj2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-f01te2vpj2] { display: grid !important; }
    .crud-cards-wrapper[b-f01te2vpj2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-f01te2vpj2] { grid-template-columns: 1fr; }
    .card-details[b-f01te2vpj2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-f01te2vpj2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-f01te2vpj2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-f01te2vpj2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-f01te2vpj2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_consultacuenta.razor.rz.scp.css */
/* ============================================================
   frmCTB_ConsultaCuenta — Estilos CRUD base + filtros propios
   ============================================================ */

.crud-container[b-m5044etv8u] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-m5044etv8u 0.3s ease-out; }
@keyframes slideUp-b-m5044etv8u { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-m5044etv8u] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-m5044etv8u] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-m5044etv8u] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-m5044etv8u] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-m5044etv8u] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }

/* Buttons */
.btn-crud[b-m5044etv8u] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-m5044etv8u] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-m5044etv8u] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-m5044etv8u] { filter: brightness(1.1); }
.btn-outline[b-m5044etv8u] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-m5044etv8u] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-m5044etv8u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-m5044etv8u] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-m5044etv8u]   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-m5044etv8u] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-m5044etv8u] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.3); }
[data-mode="dark"] .crud-alert.error[b-m5044etv8u]   { background: rgba(239,68,68,0.12);  color: #fca5a5; border-color: rgba(239,68,68,0.3);  }

/* Spinners */
.crud-spinner-sm[b-m5044etv8u] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-m5044etv8u 0.6s linear infinite; }
@keyframes spin-b-m5044etv8u { to { transform: rotate(360deg); } }

/* Search bar */
.crud-search-bar[b-m5044etv8u] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-m5044etv8u] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-m5044etv8u] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-m5044etv8u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-m5044etv8u] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-table[b-m5044etv8u] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-m5044etv8u] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-m5044etv8u] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.5rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-m5044etv8u] { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-m5044etv8u] { background: var(--rg-bg-hover, #f8fafc); }

/* Modal */
.modal-backdrop[b-m5044etv8u] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-m5044etv8u] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-m5044etv8u] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-m5044etv8u 0.2s ease-out; }
.modal-lg[b-m5044etv8u] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 80px); max-height: calc(100vh - 80px); }
.modal-sm[b-m5044etv8u] { max-width: 420px; }
@keyframes scaleIn-b-m5044etv8u { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-m5044etv8u] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-m5044etv8u] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-m5044etv8u] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-m5044etv8u] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-m5044etv8u] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-m5044etv8u] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Utilities */
.font-mono[b-m5044etv8u] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.75rem; }
.text-center[b-m5044etv8u] { text-align: center; }
.text-muted[b-m5044etv8u] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* ============================================================
   Card de filtros
   ============================================================ */

.cc-card[b-m5044etv8u] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.cc-card-header[b-m5044etv8u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
}

.cc-card-header i[b-m5044etv8u] { color: var(--rg-accent, #4f46e5); }

.cc-form-body[b-m5044etv8u] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Filas de campos */
.cc-fields-row[b-m5044etv8u] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.cc-field-group[b-m5044etv8u] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-width: 160px;
}

.cc-label[b-m5044etv8u] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.cc-input[b-m5044etv8u] {
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.cc-input:focus[b-m5044etv8u] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(79,70,229,0.12);
}

.cc-input[readonly][b-m5044etv8u] {
    background: var(--rg-bg-subtle, #f8fafc);
    cursor: default;
}

/* Picker row */
.cc-picker-group[b-m5044etv8u] { flex: 1; min-width: 280px; }

.cc-picker-row[b-m5044etv8u] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.cc-picker-input[b-m5044etv8u]  { flex: 0 0 110px; }
.cc-picker-desc[b-m5044etv8u]   { flex: 1; }
.cc-btn-picker[b-m5044etv8u]    { flex-shrink: 0; padding: 0.45rem 0.65rem; white-space: nowrap; font-size: 0.75rem; }
.cc-btn-clear[b-m5044etv8u]     { flex-shrink: 0; padding: 0.45rem 0.5rem; color: #ef4444; border-color: #fecaca; }
.cc-btn-clear:hover[b-m5044etv8u] { background: rgba(239,68,68,0.08) !important; }

/* Botón consultar */
.cc-action-row[b-m5044etv8u] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

.cc-btn-consultar[b-m5044etv8u] { padding: 0.6rem 1.5rem; font-size: 0.88rem; }

.cc-hint[b-m5044etv8u] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

/* ── Picker modal grid ─────────────────────────────────── */

.cc-modal-picker[b-m5044etv8u] { max-width: 700px; }

.cc-picker-grid[b-m5044etv8u] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    max-height: 380px;
    background: var(--rg-bg-card, #fff);
}

/* ── PDF viewer ────────────────────────────────────────── */

.cc-pdf-body[b-m5044etv8u] {
    padding: 0 !important;
    overflow: hidden !important;
}

.cc-pdf-iframe[b-m5044etv8u] {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* ── Grid resultados ───────────────────────────────────── */

.cc-result-card[b-m5044etv8u] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.cc-grid-scroll[b-m5044etv8u] {
    overflow-x: auto;
    max-height: calc(100vh - 380px);
    overflow-y: auto;
}

.cc-mov-table[b-m5044etv8u] { width: 100%; border-collapse: collapse; font-size: 0.76rem; }
.cc-mov-table thead[b-m5044etv8u] { position: sticky; top: 0; z-index: 2; }
.cc-mov-table th[b-m5044etv8u] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    padding: 0.45rem 0.6rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.cc-mov-table td[b-m5044etv8u] {
    padding: 0.3rem 0.6rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
    white-space: nowrap;
}
.cc-mov-table tbody tr:hover[b-m5044etv8u] { background: var(--rg-bg-hover, #f8fafc); }

/* Fila BALANCE ANT (primera fila) */
.cc-row-balant td[b-m5044etv8u] {
    background: rgba(254, 240, 138, 0.35) !important;
    font-weight: 600;
}
[data-mode="dark"] .cc-row-balant td[b-m5044etv8u] {
    background: rgba(202, 138, 4, 0.18) !important;
}

/* Footer totales */
.cc-tfoot-row td[b-m5044etv8u] {
    background: var(--rg-bg-subtle, #f8fafc);
    border-top: 2px solid var(--rg-border, #e2e8f0);
    padding: 0.4rem 0.6rem;
    font-size: 0.78rem;
}

/* Balance positivo / negativo */
.cc-bal-pos[b-m5044etv8u] { color: var(--rg-text-primary, #1e293b); }
.cc-bal-neg[b-m5044etv8u] { color: var(--rg-danger, #ef4444) !important; }

/* ID cliente pequeño sobre el nombre */
.cc-cli-id[b-m5044etv8u] {
    display: block;
    font-size: 0.65rem;
    color: var(--rg-text-muted, #94a3b8);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    line-height: 1;
    margin-bottom: 1px;
}

/* Totales inline en la action row */
.cc-result-count[b-m5044etv8u] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
}
.cc-result-count strong[b-m5044etv8u] { color: var(--rg-text-primary, #1e293b); }

/* Etiqueta opcional */
.cc-optional[b-m5044etv8u] {
    font-weight: 400;
    font-size: 0.62rem;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: none;
    letter-spacing: 0;
}

/* Alineación derecha */
.text-right[b-m5044etv8u] { text-align: right !important; }

/* Celdas drilldown (Documento / Aplicación) */
.cc-drilldown[b-m5044etv8u] {
    cursor: pointer;
    color: var(--rg-accent, #4f46e5);
    text-decoration: underline;
    text-decoration-color: transparent;
    transition: text-decoration-color 0.15s, opacity 0.15s;
}
.cc-drilldown:hover[b-m5044etv8u] {
    text-decoration-color: var(--rg-accent, #4f46e5);
    opacity: 0.85;
}

/* ── Responsive ────────────────────────────────────────── */

@media (max-width: 768px) {
    .crud-container[b-m5044etv8u] { padding: 0.75rem; }
    .crud-title[b-m5044etv8u] { font-size: 1.1rem; }
    .cc-fields-row[b-m5044etv8u] { flex-direction: column; }
    .cc-field-group[b-m5044etv8u] { min-width: unset; width: 100%; }
    .cc-picker-row[b-m5044etv8u] { flex-wrap: wrap; }
    .cc-picker-input[b-m5044etv8u], .cc-picker-desc[b-m5044etv8u] { flex: unset; width: 100%; }
    .cc-grid-scroll[b-m5044etv8u] { max-height: 55vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_impresioestado.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h91yg7t7kb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h91yg7t7kb 0.3s ease-out; }
@keyframes slideUp-b-h91yg7t7kb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h91yg7t7kb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h91yg7t7kb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h91yg7t7kb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h91yg7t7kb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h91yg7t7kb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h91yg7t7kb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h91yg7t7kb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h91yg7t7kb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h91yg7t7kb] { filter: brightness(1.1); }
.btn-outline[b-h91yg7t7kb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h91yg7t7kb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h91yg7t7kb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h91yg7t7kb] { filter: brightness(1.1); }
.btn-icon[b-h91yg7t7kb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h91yg7t7kb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h91yg7t7kb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h91yg7t7kb] { color: #ef4444; }
.btn-delete:hover[b-h91yg7t7kb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h91yg7t7kb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h91yg7t7kb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h91yg7t7kb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h91yg7t7kb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h91yg7t7kb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h91yg7t7kb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h91yg7t7kb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h91yg7t7kb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h91yg7t7kb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h91yg7t7kb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h91yg7t7kb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h91yg7t7kb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h91yg7t7kb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h91yg7t7kb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h91yg7t7kb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h91yg7t7kb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h91yg7t7kb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h91yg7t7kb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h91yg7t7kb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h91yg7t7kb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h91yg7t7kb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h91yg7t7kb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h91yg7t7kb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h91yg7t7kb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h91yg7t7kb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h91yg7t7kb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h91yg7t7kb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h91yg7t7kb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h91yg7t7kb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h91yg7t7kb] { display: block; }
.hide-on-cards[b-h91yg7t7kb] { display: none !important; }
.show-on-cards[b-h91yg7t7kb] { display: grid; }
.hide-on-grid[b-h91yg7t7kb] { display: none !important; }

/* Badges */
.badge[b-h91yg7t7kb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h91yg7t7kb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h91yg7t7kb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h91yg7t7kb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h91yg7t7kb] { text-align: center; }
.text-muted[b-h91yg7t7kb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h91yg7t7kb], .crud-empty-state[b-h91yg7t7kb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h91yg7t7kb] { font-size: 2rem; }
.crud-spinner[b-h91yg7t7kb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h91yg7t7kb 0.6s linear infinite; }
.crud-spinner-sm[b-h91yg7t7kb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h91yg7t7kb 0.6s linear infinite; }
@keyframes spin-b-h91yg7t7kb { to { transform: rotate(360deg); } }
.spin[b-h91yg7t7kb] { animation: spin-b-h91yg7t7kb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h91yg7t7kb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h91yg7t7kb 0.15s ease-out; }
.modal-container[b-h91yg7t7kb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h91yg7t7kb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h91yg7t7kb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h91yg7t7kb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h91yg7t7kb] { max-width: 420px; }
@keyframes fadeIn-b-h91yg7t7kb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h91yg7t7kb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h91yg7t7kb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h91yg7t7kb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h91yg7t7kb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h91yg7t7kb] { color: #dc2626; }
.modal-close[b-h91yg7t7kb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h91yg7t7kb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h91yg7t7kb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h91yg7t7kb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h91yg7t7kb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h91yg7t7kb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h91yg7t7kb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h91yg7t7kb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h91yg7t7kb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h91yg7t7kb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h91yg7t7kb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h91yg7t7kb] { flex: 2; }
.form-group label[b-h91yg7t7kb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h91yg7t7kb], .form-group select[b-h91yg7t7kb], .form-textarea[b-h91yg7t7kb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h91yg7t7kb], .form-group select:focus[b-h91yg7t7kb], .form-textarea:focus[b-h91yg7t7kb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h91yg7t7kb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h91yg7t7kb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h91yg7t7kb] { flex: 1; display: flex; align-items: center; }
.form-check[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h91yg7t7kb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h91yg7t7kb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h91yg7t7kb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h91yg7t7kb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h91yg7t7kb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h91yg7t7kb] { font-size: 3rem; }
.photo-placeholder span[b-h91yg7t7kb] { font-size: 0.78rem; }
.photo-actions[b-h91yg7t7kb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h91yg7t7kb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h91yg7t7kb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h91yg7t7kb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h91yg7t7kb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h91yg7t7kb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h91yg7t7kb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h91yg7t7kb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h91yg7t7kb] { filter: brightness(1.15); transform: scale(1.05); }
[b-h91yg7t7kb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h91yg7t7kb] { padding: 0.75rem; }
    .crud-header[b-h91yg7t7kb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h91yg7t7kb] { font-size: 1.1rem; }
    .btn-text[b-h91yg7t7kb] { display: none; }
    .form-row[b-h91yg7t7kb] { flex-direction: column; }
    .form-row-4[b-h91yg7t7kb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h91yg7t7kb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h91yg7t7kb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h91yg7t7kb] { padding: 0.75rem; }
    .modal-tabs[b-h91yg7t7kb] { overflow-x: auto; }
    .modal-tab[b-h91yg7t7kb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h91yg7t7kb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h91yg7t7kb] { display: grid !important; }
    .crud-cards-wrapper[b-h91yg7t7kb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h91yg7t7kb] { grid-template-columns: 1fr; }
    .card-details[b-h91yg7t7kb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h91yg7t7kb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h91yg7t7kb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h91yg7t7kb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h91yg7t7kb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_ingresocostogasto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xnqzzcs6ka] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xnqzzcs6ka 0.3s ease-out; }
@keyframes slideUp-b-xnqzzcs6ka { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xnqzzcs6ka] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xnqzzcs6ka] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xnqzzcs6ka] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xnqzzcs6ka] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xnqzzcs6ka] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xnqzzcs6ka] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xnqzzcs6ka] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xnqzzcs6ka] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xnqzzcs6ka] { filter: brightness(1.1); }
.btn-outline[b-xnqzzcs6ka] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xnqzzcs6ka] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xnqzzcs6ka] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xnqzzcs6ka] { filter: brightness(1.1); }
.btn-icon[b-xnqzzcs6ka] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xnqzzcs6ka] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xnqzzcs6ka] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xnqzzcs6ka] { color: #ef4444; }
.btn-delete:hover[b-xnqzzcs6ka] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xnqzzcs6ka] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xnqzzcs6ka] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xnqzzcs6ka] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xnqzzcs6ka] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xnqzzcs6ka] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xnqzzcs6ka] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xnqzzcs6ka] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xnqzzcs6ka] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xnqzzcs6ka] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xnqzzcs6ka] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xnqzzcs6ka] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xnqzzcs6ka] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xnqzzcs6ka] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xnqzzcs6ka] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xnqzzcs6ka] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xnqzzcs6ka] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xnqzzcs6ka] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xnqzzcs6ka] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xnqzzcs6ka] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xnqzzcs6ka] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xnqzzcs6ka] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xnqzzcs6ka] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xnqzzcs6ka] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xnqzzcs6ka] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xnqzzcs6ka] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xnqzzcs6ka] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xnqzzcs6ka] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xnqzzcs6ka] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xnqzzcs6ka] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xnqzzcs6ka] { display: block; }
.hide-on-cards[b-xnqzzcs6ka] { display: none !important; }
.show-on-cards[b-xnqzzcs6ka] { display: grid; }
.hide-on-grid[b-xnqzzcs6ka] { display: none !important; }

/* Badges */
.badge[b-xnqzzcs6ka] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xnqzzcs6ka] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xnqzzcs6ka] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xnqzzcs6ka] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xnqzzcs6ka] { text-align: center; }
.text-muted[b-xnqzzcs6ka] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xnqzzcs6ka], .crud-empty-state[b-xnqzzcs6ka] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xnqzzcs6ka] { font-size: 2rem; }
.crud-spinner[b-xnqzzcs6ka] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xnqzzcs6ka 0.6s linear infinite; }
.crud-spinner-sm[b-xnqzzcs6ka] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xnqzzcs6ka 0.6s linear infinite; }
@keyframes spin-b-xnqzzcs6ka { to { transform: rotate(360deg); } }
.spin[b-xnqzzcs6ka] { animation: spin-b-xnqzzcs6ka 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xnqzzcs6ka] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xnqzzcs6ka 0.15s ease-out; }
.modal-container[b-xnqzzcs6ka] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xnqzzcs6ka] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xnqzzcs6ka 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xnqzzcs6ka] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xnqzzcs6ka] { max-width: 420px; }
@keyframes fadeIn-b-xnqzzcs6ka { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xnqzzcs6ka { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xnqzzcs6ka] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xnqzzcs6ka] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xnqzzcs6ka] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xnqzzcs6ka] { color: #dc2626; }
.modal-close[b-xnqzzcs6ka] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xnqzzcs6ka] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xnqzzcs6ka] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xnqzzcs6ka] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xnqzzcs6ka] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xnqzzcs6ka] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xnqzzcs6ka] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xnqzzcs6ka] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xnqzzcs6ka] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xnqzzcs6ka] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xnqzzcs6ka] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xnqzzcs6ka] { flex: 2; }
.form-group label[b-xnqzzcs6ka] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xnqzzcs6ka], .form-group select[b-xnqzzcs6ka], .form-textarea[b-xnqzzcs6ka] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xnqzzcs6ka], .form-group select:focus[b-xnqzzcs6ka], .form-textarea:focus[b-xnqzzcs6ka] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xnqzzcs6ka] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xnqzzcs6ka] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xnqzzcs6ka] { flex: 1; display: flex; align-items: center; }
.form-check[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xnqzzcs6ka] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xnqzzcs6ka] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xnqzzcs6ka] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xnqzzcs6ka] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xnqzzcs6ka] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xnqzzcs6ka] { font-size: 3rem; }
.photo-placeholder span[b-xnqzzcs6ka] { font-size: 0.78rem; }
.photo-actions[b-xnqzzcs6ka] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xnqzzcs6ka] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xnqzzcs6ka] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xnqzzcs6ka] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xnqzzcs6ka] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xnqzzcs6ka] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xnqzzcs6ka] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xnqzzcs6ka] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xnqzzcs6ka] { filter: brightness(1.15); transform: scale(1.05); }
[b-xnqzzcs6ka] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xnqzzcs6ka] { padding: 0.75rem; }
    .crud-header[b-xnqzzcs6ka] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xnqzzcs6ka] { font-size: 1.1rem; }
    .btn-text[b-xnqzzcs6ka] { display: none; }
    .form-row[b-xnqzzcs6ka] { flex-direction: column; }
    .form-row-4[b-xnqzzcs6ka] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xnqzzcs6ka] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xnqzzcs6ka] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xnqzzcs6ka] { padding: 0.75rem; }
    .modal-tabs[b-xnqzzcs6ka] { overflow-x: auto; }
    .modal-tab[b-xnqzzcs6ka] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xnqzzcs6ka] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xnqzzcs6ka] { display: grid !important; }
    .crud-cards-wrapper[b-xnqzzcs6ka] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xnqzzcs6ka] { grid-template-columns: 1fr; }
    .card-details[b-xnqzzcs6ka] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xnqzzcs6ka] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xnqzzcs6ka] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xnqzzcs6ka] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xnqzzcs6ka] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_recibo_ingreso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vlg72uwgnd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vlg72uwgnd 0.3s ease-out; }
@keyframes slideUp-b-vlg72uwgnd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vlg72uwgnd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vlg72uwgnd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vlg72uwgnd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vlg72uwgnd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vlg72uwgnd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vlg72uwgnd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vlg72uwgnd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vlg72uwgnd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vlg72uwgnd] { filter: brightness(1.1); }
.btn-outline[b-vlg72uwgnd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vlg72uwgnd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vlg72uwgnd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vlg72uwgnd] { filter: brightness(1.1); }
.btn-icon[b-vlg72uwgnd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vlg72uwgnd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vlg72uwgnd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vlg72uwgnd] { color: #ef4444; }
.btn-delete:hover[b-vlg72uwgnd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vlg72uwgnd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vlg72uwgnd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vlg72uwgnd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vlg72uwgnd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vlg72uwgnd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vlg72uwgnd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vlg72uwgnd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vlg72uwgnd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vlg72uwgnd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vlg72uwgnd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vlg72uwgnd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vlg72uwgnd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vlg72uwgnd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vlg72uwgnd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vlg72uwgnd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vlg72uwgnd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vlg72uwgnd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vlg72uwgnd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vlg72uwgnd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vlg72uwgnd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vlg72uwgnd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vlg72uwgnd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vlg72uwgnd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vlg72uwgnd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vlg72uwgnd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vlg72uwgnd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vlg72uwgnd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vlg72uwgnd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vlg72uwgnd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vlg72uwgnd] { display: block; }
.hide-on-cards[b-vlg72uwgnd] { display: none !important; }
.show-on-cards[b-vlg72uwgnd] { display: grid; }
.hide-on-grid[b-vlg72uwgnd] { display: none !important; }

/* Badges */
.badge[b-vlg72uwgnd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vlg72uwgnd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vlg72uwgnd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vlg72uwgnd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vlg72uwgnd] { text-align: center; }
.text-muted[b-vlg72uwgnd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vlg72uwgnd], .crud-empty-state[b-vlg72uwgnd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vlg72uwgnd] { font-size: 2rem; }
.crud-spinner[b-vlg72uwgnd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vlg72uwgnd 0.6s linear infinite; }
.crud-spinner-sm[b-vlg72uwgnd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vlg72uwgnd 0.6s linear infinite; }
@keyframes spin-b-vlg72uwgnd { to { transform: rotate(360deg); } }
.spin[b-vlg72uwgnd] { animation: spin-b-vlg72uwgnd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vlg72uwgnd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vlg72uwgnd 0.15s ease-out; }
.modal-container[b-vlg72uwgnd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vlg72uwgnd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vlg72uwgnd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vlg72uwgnd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vlg72uwgnd] { max-width: 420px; }
@keyframes fadeIn-b-vlg72uwgnd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vlg72uwgnd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vlg72uwgnd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vlg72uwgnd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vlg72uwgnd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vlg72uwgnd] { color: #dc2626; }
.modal-close[b-vlg72uwgnd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vlg72uwgnd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vlg72uwgnd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vlg72uwgnd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vlg72uwgnd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vlg72uwgnd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vlg72uwgnd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vlg72uwgnd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vlg72uwgnd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vlg72uwgnd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vlg72uwgnd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vlg72uwgnd] { flex: 2; }
.form-group label[b-vlg72uwgnd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vlg72uwgnd], .form-group select[b-vlg72uwgnd], .form-textarea[b-vlg72uwgnd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vlg72uwgnd], .form-group select:focus[b-vlg72uwgnd], .form-textarea:focus[b-vlg72uwgnd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vlg72uwgnd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vlg72uwgnd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vlg72uwgnd] { flex: 1; display: flex; align-items: center; }
.form-check[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vlg72uwgnd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vlg72uwgnd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vlg72uwgnd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vlg72uwgnd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vlg72uwgnd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vlg72uwgnd] { font-size: 3rem; }
.photo-placeholder span[b-vlg72uwgnd] { font-size: 0.78rem; }
.photo-actions[b-vlg72uwgnd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vlg72uwgnd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vlg72uwgnd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vlg72uwgnd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vlg72uwgnd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vlg72uwgnd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vlg72uwgnd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vlg72uwgnd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vlg72uwgnd] { filter: brightness(1.15); transform: scale(1.05); }
[b-vlg72uwgnd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vlg72uwgnd] { padding: 0.75rem; }
    .crud-header[b-vlg72uwgnd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vlg72uwgnd] { font-size: 1.1rem; }
    .btn-text[b-vlg72uwgnd] { display: none; }
    .form-row[b-vlg72uwgnd] { flex-direction: column; }
    .form-row-4[b-vlg72uwgnd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vlg72uwgnd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vlg72uwgnd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vlg72uwgnd] { padding: 0.75rem; }
    .modal-tabs[b-vlg72uwgnd] { overflow-x: auto; }
    .modal-tab[b-vlg72uwgnd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vlg72uwgnd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vlg72uwgnd] { display: grid !important; }
    .crud-cards-wrapper[b-vlg72uwgnd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vlg72uwgnd] { grid-template-columns: 1fr; }
    .card-details[b-vlg72uwgnd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vlg72uwgnd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vlg72uwgnd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vlg72uwgnd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vlg72uwgnd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_registraestado.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1g26at5lao] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1g26at5lao 0.3s ease-out; }
@keyframes slideUp-b-1g26at5lao { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1g26at5lao] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1g26at5lao] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1g26at5lao] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1g26at5lao] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1g26at5lao] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1g26at5lao] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1g26at5lao] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1g26at5lao] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1g26at5lao] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1g26at5lao] { filter: brightness(1.1); }
.btn-outline[b-1g26at5lao] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1g26at5lao] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1g26at5lao] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1g26at5lao] { filter: brightness(1.1); }
.btn-icon[b-1g26at5lao] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1g26at5lao] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1g26at5lao] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1g26at5lao] { color: #ef4444; }
.btn-delete:hover[b-1g26at5lao] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1g26at5lao] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1g26at5lao] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1g26at5lao] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1g26at5lao] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1g26at5lao] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1g26at5lao] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1g26at5lao] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1g26at5lao] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1g26at5lao] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1g26at5lao] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1g26at5lao] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1g26at5lao] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1g26at5lao] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1g26at5lao] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1g26at5lao] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1g26at5lao] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1g26at5lao] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1g26at5lao] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1g26at5lao] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1g26at5lao] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1g26at5lao] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1g26at5lao] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1g26at5lao] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1g26at5lao] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1g26at5lao] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1g26at5lao] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1g26at5lao] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1g26at5lao] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1g26at5lao] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1g26at5lao] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1g26at5lao] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1g26at5lao] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1g26at5lao] { display: block; }
.hide-on-cards[b-1g26at5lao] { display: none !important; }
.show-on-cards[b-1g26at5lao] { display: grid; }
.hide-on-grid[b-1g26at5lao] { display: none !important; }

/* Badges */
.badge[b-1g26at5lao] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1g26at5lao] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1g26at5lao] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1g26at5lao] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1g26at5lao] { text-align: center; }
.text-muted[b-1g26at5lao] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1g26at5lao], .crud-empty-state[b-1g26at5lao] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1g26at5lao] { font-size: 2rem; }
.crud-spinner[b-1g26at5lao] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1g26at5lao 0.6s linear infinite; }
.crud-spinner-sm[b-1g26at5lao] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1g26at5lao 0.6s linear infinite; }
@keyframes spin-b-1g26at5lao { to { transform: rotate(360deg); } }
.spin[b-1g26at5lao] { animation: spin-b-1g26at5lao 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1g26at5lao] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1g26at5lao 0.15s ease-out; }
.modal-container[b-1g26at5lao] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1g26at5lao] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1g26at5lao 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1g26at5lao] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1g26at5lao] { max-width: 420px; }
@keyframes fadeIn-b-1g26at5lao { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1g26at5lao { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1g26at5lao] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1g26at5lao] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1g26at5lao] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1g26at5lao] { color: #dc2626; }
.modal-close[b-1g26at5lao] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1g26at5lao] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1g26at5lao] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1g26at5lao] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1g26at5lao] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1g26at5lao] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1g26at5lao] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1g26at5lao] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1g26at5lao] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1g26at5lao] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1g26at5lao] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1g26at5lao] { flex: 2; }
.form-group label[b-1g26at5lao] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1g26at5lao], .form-group select[b-1g26at5lao], .form-textarea[b-1g26at5lao] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1g26at5lao], .form-group select:focus[b-1g26at5lao], .form-textarea:focus[b-1g26at5lao] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1g26at5lao] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1g26at5lao] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1g26at5lao] { flex: 1; display: flex; align-items: center; }
.form-check[b-1g26at5lao] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1g26at5lao] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1g26at5lao] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1g26at5lao] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1g26at5lao] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1g26at5lao] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1g26at5lao] { font-size: 3rem; }
.photo-placeholder span[b-1g26at5lao] { font-size: 0.78rem; }
.photo-actions[b-1g26at5lao] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1g26at5lao] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1g26at5lao] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1g26at5lao] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1g26at5lao] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1g26at5lao] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1g26at5lao] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1g26at5lao] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1g26at5lao] { filter: brightness(1.15); transform: scale(1.05); }
[b-1g26at5lao] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1g26at5lao] { padding: 0.75rem; }
    .crud-header[b-1g26at5lao] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1g26at5lao] { font-size: 1.1rem; }
    .btn-text[b-1g26at5lao] { display: none; }
    .form-row[b-1g26at5lao] { flex-direction: column; }
    .form-row-4[b-1g26at5lao] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1g26at5lao] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1g26at5lao] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1g26at5lao] { padding: 0.75rem; }
    .modal-tabs[b-1g26at5lao] { overflow-x: auto; }
    .modal-tab[b-1g26at5lao] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1g26at5lao] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1g26at5lao] { display: grid !important; }
    .crud-cards-wrapper[b-1g26at5lao] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1g26at5lao] { grid-template-columns: 1fr; }
    .card-details[b-1g26at5lao] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1g26at5lao] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1g26at5lao] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1g26at5lao] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1g26at5lao] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_registrodeposito.razor.rz.scp.css */
/* Frmctb_registrodeposito — estilos propios (CSS isolation de Blazor) */
.mc-page[b-dkjls2nvq3] { padding: 1.25rem; }

.mc-page-header[b-dkjls2nvq3] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 1rem; gap: 1rem; flex-wrap: wrap;
}
.mc-page-header-left[b-dkjls2nvq3] { display: flex; align-items: center; gap: .85rem; }
.mc-page-icon[b-dkjls2nvq3] {
    font-size: 1.6rem;
    color: var(--rg-primary);
    background: rgba(26,58,92,.1);
    padding: .55rem;
    border-radius: 10px;
}
[data-mode="dark"] .mc-page-icon[b-dkjls2nvq3] { background: rgba(147,197,253,.12); color: #93c5fd; }
.mc-page-title[b-dkjls2nvq3]    { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.mc-page-subtitle[b-dkjls2nvq3] { font-size: .78rem; color: var(--rg-text-secondary); }
.mc-page-actions[b-dkjls2nvq3]  { display: flex; gap: .5rem; }

/* ── Barra de control del documento ──────────────────────────── */
.mc-doc-bar[b-dkjls2nvq3] {
    display: flex;
    align-items: flex-end;
    gap: .75rem;
    flex-wrap: wrap;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    padding: .75rem 1rem;
    margin-bottom: .75rem;
}

.mc-doc-field[b-dkjls2nvq3] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.mc-doc-lbl[b-dkjls2nvq3] {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--rg-text-muted);
}

.mc-doc-sel[b-dkjls2nvq3],
.mc-doc-input[b-dkjls2nvq3] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: .38rem .6rem;
    font-size: .85rem;
    height: 34px;
    min-width: 100px;
}
.mc-doc-sel:focus[b-dkjls2nvq3],
.mc-doc-input:focus[b-dkjls2nvq3] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 2px rgba(26,58,92,.15);
}
.mc-doc-input.err[b-dkjls2nvq3] {
    border-color: var(--rg-danger);
    background: rgba(220,38,38,.05);
}
.mc-doc-input:disabled[b-dkjls2nvq3],
.mc-doc-sel:disabled[b-dkjls2nvq3] { opacity: .55; cursor: not-allowed; }

.mc-doc-input-wrap[b-dkjls2nvq3] {
    position: relative;
    display: flex;
    align-items: center;
}
.mc-doc-char-hint[b-dkjls2nvq3] {
    position: absolute;
    right: .4rem;
    font-size: .65rem;
    color: var(--rg-text-muted);
    pointer-events: none;
}

.mc-doc-val-hint[b-dkjls2nvq3] {
    font-size: .68rem;
    margin-top: .1rem;
}
.mc-doc-val-hint.err[b-dkjls2nvq3] { color: var(--rg-danger); }

.mc-doc-separator[b-dkjls2nvq3] {
    width: 1px;
    height: 34px;
    background: var(--rg-border);
    margin: 0 .25rem;
    align-self: flex-end;
}

.mc-doc-load-wrap[b-dkjls2nvq3] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.mc-load-btn[b-dkjls2nvq3] { height: 34px; padding: 0 .75rem; font-size: .82rem; }

.mc-edit-badge[b-dkjls2nvq3] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: rgba(37,99,235,.12);
    color: var(--rg-accent);
    border: 1px solid rgba(37,99,235,.25);
    border-radius: 20px;
    padding: .2rem .65rem;
    font-size: .72rem;
    font-weight: 600;
}
[data-mode="dark"] .mc-edit-badge[b-dkjls2nvq3] { color: #93c5fd; background: rgba(147,197,253,.12); }

.mc-readonly-badge[b-dkjls2nvq3] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: rgba(220,38,38,.1);
    color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,.25);
    border-radius: 20px;
    padding: .2rem .65rem;
    font-size: .72rem;
    font-weight: 600;
}
[data-mode="dark"] .mc-readonly-badge[b-dkjls2nvq3] { color: #fca5a5; }

/* ── Alerta ───────────────────────────────────────────────────── */
.crud-alert[b-dkjls2nvq3] {
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    border-radius: 8px;
    display: flex; justify-content: space-between; align-items: center;
    font-size: .85rem; font-weight: 500;
}
.crud-alert.success[b-dkjls2nvq3] { background: rgba(22,163,74,.12); color: var(--rg-success); border: 1px solid rgba(22,163,74,.3); }
.crud-alert.error[b-dkjls2nvq3]   { background: rgba(220,38,38,.12); color: var(--rg-danger);  border: 1px solid rgba(220,38,38,.3); }
[data-mode="dark"] .crud-alert.success[b-dkjls2nvq3] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-dkjls2nvq3]   { color: #fca5a5; }
.crud-alert-close[b-dkjls2nvq3] { background: none; border: none; color: inherit; cursor: pointer; padding: 2px 6px; }

/* ── Modal estándar ───────────────────────────────────────────── */
.modal-backdrop[b-dkjls2nvq3] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 1000;
}
.modal-container[b-dkjls2nvq3] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001;
    padding: 1rem;
}
.modal-dialog[b-dkjls2nvq3] {
    pointer-events: auto;             /* ← Override Bootstrap '.modal-dialog{pointer-events:none}' */
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 12px;
    width: 100%;
    max-width: 520px;
    display: flex; flex-direction: column;
    max-height: calc(100vh - 2rem);
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.modal-sm[b-dkjls2nvq3] { max-width: 380px; }
.modal-header[b-dkjls2nvq3] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.modal-header h2[b-dkjls2nvq3] { font-size: .95rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: .4rem; }
.modal-close[b-dkjls2nvq3] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: .25rem .4rem; border-radius: 6px; font-size: 1rem; }
.modal-close:hover[b-dkjls2nvq3] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.modal-body[b-dkjls2nvq3] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: .75rem; }
.modal-footer[b-dkjls2nvq3] { display: flex; justify-content: flex-end; gap: .5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Modales anidados */
.modal-backdrop-nested[b-dkjls2nvq3]  { z-index: 2000 !important; }
.modal-container-nested[b-dkjls2nvq3] { z-index: 2001 !important; }

/* ── Botones estándar CRUD (necesarios por CSS isolation de Blazor) ─── */
.btn-crud[b-dkjls2nvq3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dkjls2nvq3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dkjls2nvq3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dkjls2nvq3] { filter: brightness(1.1); }
.btn-outline[b-dkjls2nvq3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dkjls2nvq3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dkjls2nvq3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dkjls2nvq3] { filter: brightness(1.1); }
[data-mode="dark"] .btn-outline[b-dkjls2nvq3] { color: var(--rg-text-secondary); border-color: var(--rg-border); }
[data-mode="dark"] .btn-outline:hover:not(:disabled)[b-dkjls2nvq3] { background: var(--rg-bg-hover); }

/* ── Post-grabado ─────────────────────────────────────────────── */
.ps-modal[b-dkjls2nvq3] { max-width: 380px; }
.ps-recibo-info[b-dkjls2nvq3] {
    display: flex; align-items: baseline; gap: .6rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem;
}
.ps-label[b-dkjls2nvq3] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-dkjls2nvq3] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-acciones[b-dkjls2nvq3] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-dkjls2nvq3] { width: 100%; justify-content: center; }
.ps-pdf-error[b-dkjls2nvq3] {
    display: flex; align-items: center; gap: .4rem;
    background: rgba(220,38,38,.10); color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,.25); border-radius: .4rem;
    padding: .4rem .65rem; font-size: .75rem; font-weight: 500;
}
[data-mode="dark"] .ps-pdf-error[b-dkjls2nvq3] { color: #fca5a5; }

/* ── Form group (modal envío) ────────────────────────────────── */
.form-group[b-dkjls2nvq3] { display: flex; flex-direction: column; gap: .3rem; }
.form-group label[b-dkjls2nvq3] { font-size: .78rem; font-weight: 600; color: var(--rg-text-secondary); display: flex; align-items: center; gap: .35rem; }
.form-group input[b-dkjls2nvq3] {
    background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 6px;
    padding: .45rem .65rem; font-size: .85rem;
}
.form-group input:focus[b-dkjls2nvq3] { border-color: var(--rg-primary); outline: none; box-shadow: 0 0 0 2px rgba(26,58,92,.15); }

/* ── Misc ─────────────────────────────────────────────────────── */
.font-mono[b-dkjls2nvq3] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.spin[b-dkjls2nvq3] { animation: dep-spin-b-dkjls2nvq3 1s linear infinite; }
@keyframes dep-spin-b-dkjls2nvq3 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmctb_transferir_recibo_ingreso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-q7s5cboxid] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-q7s5cboxid 0.3s ease-out; }
@keyframes slideUp-b-q7s5cboxid { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-q7s5cboxid] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-q7s5cboxid] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-q7s5cboxid] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-q7s5cboxid] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-q7s5cboxid] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-q7s5cboxid] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-q7s5cboxid] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-q7s5cboxid] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-q7s5cboxid] { filter: brightness(1.1); }
.btn-outline[b-q7s5cboxid] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-q7s5cboxid] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-q7s5cboxid] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-q7s5cboxid] { filter: brightness(1.1); }
.btn-icon[b-q7s5cboxid] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-q7s5cboxid] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-q7s5cboxid] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-q7s5cboxid] { color: #ef4444; }
.btn-delete:hover[b-q7s5cboxid] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-q7s5cboxid] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-q7s5cboxid] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-q7s5cboxid] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-q7s5cboxid] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-q7s5cboxid] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-q7s5cboxid] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-q7s5cboxid] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-q7s5cboxid] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-q7s5cboxid] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-q7s5cboxid] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-q7s5cboxid] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-q7s5cboxid] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-q7s5cboxid] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-q7s5cboxid] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-q7s5cboxid] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-q7s5cboxid] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-q7s5cboxid] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-q7s5cboxid] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-q7s5cboxid] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-q7s5cboxid] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-q7s5cboxid] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-q7s5cboxid] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-q7s5cboxid] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-q7s5cboxid] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-q7s5cboxid] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-q7s5cboxid] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-q7s5cboxid] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-q7s5cboxid] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-q7s5cboxid] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-q7s5cboxid] { display: block; }
.hide-on-cards[b-q7s5cboxid] { display: none !important; }
.show-on-cards[b-q7s5cboxid] { display: grid; }
.hide-on-grid[b-q7s5cboxid] { display: none !important; }

/* Badges */
.badge[b-q7s5cboxid] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-q7s5cboxid] { background: #ecfdf5; color: #065f46; }
.badge-no[b-q7s5cboxid] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-q7s5cboxid] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-q7s5cboxid] { text-align: center; }
.text-muted[b-q7s5cboxid] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-q7s5cboxid], .crud-empty-state[b-q7s5cboxid] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-q7s5cboxid] { font-size: 2rem; }
.crud-spinner[b-q7s5cboxid] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-q7s5cboxid 0.6s linear infinite; }
.crud-spinner-sm[b-q7s5cboxid] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-q7s5cboxid 0.6s linear infinite; }
@keyframes spin-b-q7s5cboxid { to { transform: rotate(360deg); } }
.spin[b-q7s5cboxid] { animation: spin-b-q7s5cboxid 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-q7s5cboxid] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-q7s5cboxid 0.15s ease-out; }
.modal-container[b-q7s5cboxid] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-q7s5cboxid] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-q7s5cboxid 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-q7s5cboxid] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-q7s5cboxid] { max-width: 420px; }
@keyframes fadeIn-b-q7s5cboxid { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-q7s5cboxid { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-q7s5cboxid] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-q7s5cboxid] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-q7s5cboxid] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-q7s5cboxid] { color: #dc2626; }
.modal-close[b-q7s5cboxid] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-q7s5cboxid] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-q7s5cboxid] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-q7s5cboxid] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-q7s5cboxid] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-q7s5cboxid] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-q7s5cboxid] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-q7s5cboxid] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-q7s5cboxid] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-q7s5cboxid] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-q7s5cboxid] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-q7s5cboxid] { flex: 2; }
.form-group label[b-q7s5cboxid] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-q7s5cboxid], .form-group select[b-q7s5cboxid], .form-textarea[b-q7s5cboxid] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-q7s5cboxid], .form-group select:focus[b-q7s5cboxid], .form-textarea:focus[b-q7s5cboxid] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-q7s5cboxid] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-q7s5cboxid] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-q7s5cboxid] { flex: 1; display: flex; align-items: center; }
.form-check[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-q7s5cboxid] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-q7s5cboxid] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-q7s5cboxid] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-q7s5cboxid] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-q7s5cboxid] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-q7s5cboxid] { font-size: 3rem; }
.photo-placeholder span[b-q7s5cboxid] { font-size: 0.78rem; }
.photo-actions[b-q7s5cboxid] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-q7s5cboxid] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-q7s5cboxid] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-q7s5cboxid] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-q7s5cboxid] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-q7s5cboxid] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-q7s5cboxid] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-q7s5cboxid] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-q7s5cboxid] { filter: brightness(1.15); transform: scale(1.05); }
[b-q7s5cboxid] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-q7s5cboxid] { padding: 0.75rem; }
    .crud-header[b-q7s5cboxid] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-q7s5cboxid] { font-size: 1.1rem; }
    .btn-text[b-q7s5cboxid] { display: none; }
    .form-row[b-q7s5cboxid] { flex-direction: column; }
    .form-row-4[b-q7s5cboxid] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-q7s5cboxid] { width: 98%; max-height: 95vh; }
    .modal-lg[b-q7s5cboxid] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-q7s5cboxid] { padding: 0.75rem; }
    .modal-tabs[b-q7s5cboxid] { overflow-x: auto; }
    .modal-tab[b-q7s5cboxid] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-q7s5cboxid] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-q7s5cboxid] { display: grid !important; }
    .crud-cards-wrapper[b-q7s5cboxid] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-q7s5cboxid] { grid-template-columns: 1fr; }
    .card-details[b-q7s5cboxid] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-q7s5cboxid] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-q7s5cboxid] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-q7s5cboxid] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-q7s5cboxid] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmdgii_ingresocomprayservicios.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rnb9s57ijy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rnb9s57ijy 0.3s ease-out; }
@keyframes slideUp-b-rnb9s57ijy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rnb9s57ijy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rnb9s57ijy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rnb9s57ijy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rnb9s57ijy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rnb9s57ijy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rnb9s57ijy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rnb9s57ijy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rnb9s57ijy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rnb9s57ijy] { filter: brightness(1.1); }
.btn-outline[b-rnb9s57ijy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rnb9s57ijy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rnb9s57ijy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rnb9s57ijy] { filter: brightness(1.1); }
.btn-icon[b-rnb9s57ijy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rnb9s57ijy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rnb9s57ijy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rnb9s57ijy] { color: #ef4444; }
.btn-delete:hover[b-rnb9s57ijy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rnb9s57ijy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rnb9s57ijy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rnb9s57ijy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rnb9s57ijy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rnb9s57ijy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rnb9s57ijy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rnb9s57ijy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rnb9s57ijy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rnb9s57ijy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rnb9s57ijy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rnb9s57ijy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rnb9s57ijy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rnb9s57ijy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rnb9s57ijy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rnb9s57ijy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rnb9s57ijy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rnb9s57ijy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rnb9s57ijy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rnb9s57ijy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rnb9s57ijy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rnb9s57ijy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rnb9s57ijy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rnb9s57ijy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rnb9s57ijy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rnb9s57ijy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rnb9s57ijy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rnb9s57ijy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rnb9s57ijy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rnb9s57ijy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rnb9s57ijy] { display: block; }
.hide-on-cards[b-rnb9s57ijy] { display: none !important; }
.show-on-cards[b-rnb9s57ijy] { display: grid; }
.hide-on-grid[b-rnb9s57ijy] { display: none !important; }

/* Badges */
.badge[b-rnb9s57ijy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rnb9s57ijy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rnb9s57ijy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rnb9s57ijy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rnb9s57ijy] { text-align: center; }
.text-muted[b-rnb9s57ijy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rnb9s57ijy], .crud-empty-state[b-rnb9s57ijy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rnb9s57ijy] { font-size: 2rem; }
.crud-spinner[b-rnb9s57ijy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rnb9s57ijy 0.6s linear infinite; }
.crud-spinner-sm[b-rnb9s57ijy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rnb9s57ijy 0.6s linear infinite; }
@keyframes spin-b-rnb9s57ijy { to { transform: rotate(360deg); } }
.spin[b-rnb9s57ijy] { animation: spin-b-rnb9s57ijy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rnb9s57ijy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rnb9s57ijy 0.15s ease-out; }
.modal-container[b-rnb9s57ijy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rnb9s57ijy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rnb9s57ijy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rnb9s57ijy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rnb9s57ijy] { max-width: 420px; }
@keyframes fadeIn-b-rnb9s57ijy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rnb9s57ijy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rnb9s57ijy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rnb9s57ijy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rnb9s57ijy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rnb9s57ijy] { color: #dc2626; }
.modal-close[b-rnb9s57ijy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rnb9s57ijy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rnb9s57ijy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rnb9s57ijy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rnb9s57ijy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rnb9s57ijy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rnb9s57ijy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rnb9s57ijy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rnb9s57ijy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rnb9s57ijy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rnb9s57ijy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rnb9s57ijy] { flex: 2; }
.form-group label[b-rnb9s57ijy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rnb9s57ijy], .form-group select[b-rnb9s57ijy], .form-textarea[b-rnb9s57ijy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rnb9s57ijy], .form-group select:focus[b-rnb9s57ijy], .form-textarea:focus[b-rnb9s57ijy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rnb9s57ijy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rnb9s57ijy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rnb9s57ijy] { flex: 1; display: flex; align-items: center; }
.form-check[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rnb9s57ijy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rnb9s57ijy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rnb9s57ijy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rnb9s57ijy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rnb9s57ijy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rnb9s57ijy] { font-size: 3rem; }
.photo-placeholder span[b-rnb9s57ijy] { font-size: 0.78rem; }
.photo-actions[b-rnb9s57ijy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rnb9s57ijy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rnb9s57ijy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rnb9s57ijy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rnb9s57ijy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rnb9s57ijy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rnb9s57ijy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rnb9s57ijy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rnb9s57ijy] { filter: brightness(1.15); transform: scale(1.05); }
[b-rnb9s57ijy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rnb9s57ijy] { padding: 0.75rem; }
    .crud-header[b-rnb9s57ijy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rnb9s57ijy] { font-size: 1.1rem; }
    .btn-text[b-rnb9s57ijy] { display: none; }
    .form-row[b-rnb9s57ijy] { flex-direction: column; }
    .form-row-4[b-rnb9s57ijy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rnb9s57ijy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rnb9s57ijy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rnb9s57ijy] { padding: 0.75rem; }
    .modal-tabs[b-rnb9s57ijy] { overflow-x: auto; }
    .modal-tab[b-rnb9s57ijy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rnb9s57ijy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rnb9s57ijy] { display: grid !important; }
    .crud-cards-wrapper[b-rnb9s57ijy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rnb9s57ijy] { grid-template-columns: 1fr; }
    .card-details[b-rnb9s57ijy] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rnb9s57ijy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rnb9s57ijy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rnb9s57ijy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rnb9s57ijy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmdgii_ingresocomprayserviciosv2.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2wu72lgz6f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2wu72lgz6f 0.3s ease-out; }
@keyframes slideUp-b-2wu72lgz6f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header — sticky: siempre visible al hacer scroll */
.crud-header[b-2wu72lgz6f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
    position: sticky;
    top: 0;
    background: var(--rg-bg-page);
    padding: 0.65rem 0 0.65rem 0;
    border-bottom: 1px solid var(--rg-border);
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}
.crud-header-left[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2wu72lgz6f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2wu72lgz6f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2wu72lgz6f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2wu72lgz6f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2wu72lgz6f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2wu72lgz6f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2wu72lgz6f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2wu72lgz6f] { filter: brightness(1.1); }
.btn-outline[b-2wu72lgz6f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2wu72lgz6f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2wu72lgz6f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2wu72lgz6f] { filter: brightness(1.1); }
.btn-icon[b-2wu72lgz6f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2wu72lgz6f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2wu72lgz6f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2wu72lgz6f] { color: #ef4444; }
.btn-delete:hover[b-2wu72lgz6f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2wu72lgz6f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2wu72lgz6f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2wu72lgz6f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2wu72lgz6f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2wu72lgz6f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2wu72lgz6f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2wu72lgz6f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2wu72lgz6f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2wu72lgz6f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2wu72lgz6f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2wu72lgz6f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2wu72lgz6f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2wu72lgz6f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2wu72lgz6f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2wu72lgz6f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2wu72lgz6f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2wu72lgz6f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2wu72lgz6f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2wu72lgz6f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2wu72lgz6f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2wu72lgz6f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2wu72lgz6f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2wu72lgz6f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2wu72lgz6f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2wu72lgz6f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2wu72lgz6f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2wu72lgz6f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2wu72lgz6f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2wu72lgz6f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2wu72lgz6f] { display: block; }
.hide-on-cards[b-2wu72lgz6f] { display: none !important; }
.show-on-cards[b-2wu72lgz6f] { display: grid; }
.hide-on-grid[b-2wu72lgz6f] { display: none !important; }

/* Badges */
.badge[b-2wu72lgz6f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2wu72lgz6f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2wu72lgz6f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2wu72lgz6f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2wu72lgz6f] { text-align: center; }
.text-muted[b-2wu72lgz6f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2wu72lgz6f], .crud-empty-state[b-2wu72lgz6f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2wu72lgz6f] { font-size: 2rem; }
.crud-spinner[b-2wu72lgz6f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2wu72lgz6f 0.6s linear infinite; }
.crud-spinner-sm[b-2wu72lgz6f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2wu72lgz6f 0.6s linear infinite; }
@keyframes spin-b-2wu72lgz6f { to { transform: rotate(360deg); } }
.spin[b-2wu72lgz6f] { animation: spin-b-2wu72lgz6f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2wu72lgz6f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2wu72lgz6f 0.15s ease-out; }
.modal-container[b-2wu72lgz6f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2wu72lgz6f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2wu72lgz6f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-2wu72lgz6f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2wu72lgz6f] { max-width: 420px; }
@keyframes fadeIn-b-2wu72lgz6f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2wu72lgz6f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2wu72lgz6f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2wu72lgz6f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2wu72lgz6f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2wu72lgz6f] { color: #dc2626; }
.modal-close[b-2wu72lgz6f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2wu72lgz6f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2wu72lgz6f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2wu72lgz6f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2wu72lgz6f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2wu72lgz6f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2wu72lgz6f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2wu72lgz6f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2wu72lgz6f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2wu72lgz6f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2wu72lgz6f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2wu72lgz6f] { flex: 2; }
.form-group label[b-2wu72lgz6f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2wu72lgz6f], .form-group select[b-2wu72lgz6f], .form-textarea[b-2wu72lgz6f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2wu72lgz6f], .form-group select:focus[b-2wu72lgz6f], .form-textarea:focus[b-2wu72lgz6f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2wu72lgz6f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2wu72lgz6f] { width: 100%; resize: vertical; font-family: inherit; }
.form-label-sm[b-2wu72lgz6f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; display: block; margin-bottom: 0.15rem; }
.req-mark[b-2wu72lgz6f] { color: var(--rg-danger, #ef4444); margin-left: 2px; }
.req-hint[b-2wu72lgz6f] { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--rg-text-muted); font-size: 0.65rem; margin-left: 4px; }
.input-warn[b-2wu72lgz6f] { border-color: var(--rg-warning, #f59e0b) !important; }
.input-warn:focus[b-2wu72lgz6f] { box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2) !important; }
.field-error[b-2wu72lgz6f] { font-size: 0.68rem; color: var(--rg-danger, #ef4444); margin-top: 2px; display: block; }
.form-check-group[b-2wu72lgz6f] { flex: 1; display: flex; align-items: center; }
.form-check[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2wu72lgz6f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2wu72lgz6f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2wu72lgz6f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2wu72lgz6f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2wu72lgz6f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2wu72lgz6f] { font-size: 3rem; }
.photo-placeholder span[b-2wu72lgz6f] { font-size: 0.78rem; }
.photo-actions[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2wu72lgz6f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-2wu72lgz6f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2wu72lgz6f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2wu72lgz6f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2wu72lgz6f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2wu72lgz6f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2wu72lgz6f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2wu72lgz6f] { filter: brightness(1.15); transform: scale(1.05); }
[b-2wu72lgz6f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2wu72lgz6f] { padding: 0.75rem; }
    .crud-header[b-2wu72lgz6f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2wu72lgz6f] { font-size: 1.1rem; }
    .btn-text[b-2wu72lgz6f] { display: none; }
    .form-row[b-2wu72lgz6f] { flex-direction: column; }
    .form-row-4[b-2wu72lgz6f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2wu72lgz6f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2wu72lgz6f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2wu72lgz6f] { padding: 0.75rem; }
    .modal-tabs[b-2wu72lgz6f] { overflow-x: auto; }
    .modal-tab[b-2wu72lgz6f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2wu72lgz6f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2wu72lgz6f] { display: grid !important; }
    .crud-cards-wrapper[b-2wu72lgz6f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2wu72lgz6f] { grid-template-columns: 1fr; }
    .card-details[b-2wu72lgz6f] { flex-direction: column; gap: 0.35rem; }
}

/* ── Clasificación full-width sobre las filas del formulario ── */
.clasificacion-header-row[b-2wu72lgz6f] {
    padding: 0.25rem 0 0.5rem 0;
    width: 100%;
}

.clasificacion-header-row .form-group[b-2wu72lgz6f] {
    margin-bottom: 0;
    width: 100%;
}

.clasificacion-header-row select[b-2wu72lgz6f] {
    width: 100%;
}

/* ── Barra de TOTAL COMPRA ──────────────────────────────── */
.dgii-total-bar[b-2wu72lgz6f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rg-primary);
    color: #fff;
    border-radius: 8px;
    padding: 0.6rem 1.25rem;
    margin: 0.5rem 0 0.75rem 0;
    gap: 1rem;
}

.dgii-total-label[b-2wu72lgz6f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.03em;
}

.dgii-total-hint[b-2wu72lgz6f] {
    font-weight: 400;
    font-size: 0.78rem;
    opacity: 0.8;
}

.dgii-total-value[b-2wu72lgz6f] {
    font-size: 1.35rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    min-width: 140px;
    text-align: right;
}

[data-mode="dark"] .dgii-total-bar[b-2wu72lgz6f] {
    background: var(--rg-primary);
    color: #fff;
}

/* ── Badges: Fecha Proceso + Mes Cerrado ─────────────────── */
.dgii-param-badges[b-2wu72lgz6f] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.dgii-param-chip[b-2wu72lgz6f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(26, 58, 92, 0.08);
    border: 1px solid rgba(26, 58, 92, 0.2);
    border-radius: 8px;
    padding: 0.25rem 0.65rem;
    min-width: 90px;
}

.dgii-param-chip-warn[b-2wu72lgz6f] {
    background: rgba(234, 88, 12, 0.08);
    border-color: rgba(234, 88, 12, 0.25);
}

.dgii-param-label[b-2wu72lgz6f] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dgii-param-value[b-2wu72lgz6f] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
}

.dgii-param-chip-warn .dgii-param-value[b-2wu72lgz6f] {
    color: #ea580c;
}

[data-mode="dark"] .dgii-param-chip[b-2wu72lgz6f] {
    background: rgba(99, 179, 237, 0.08);
    border-color: rgba(99, 179, 237, 0.2);
}

[data-mode="dark"] .dgii-param-chip-warn[b-2wu72lgz6f] {
    background: rgba(251, 146, 60, 0.1);
    border-color: rgba(251, 146, 60, 0.3);
}

[data-mode="dark"] .dgii-param-chip-warn .dgii-param-value[b-2wu72lgz6f] {
    color: #fb923c;
}

/* ── Modal Duplicado: info box ── */
.dup-info-box[b-2wu72lgz6f] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.65rem 0.85rem;
    margin-bottom: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.dup-info-row[b-2wu72lgz6f] {
    display: flex;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    align-items: baseline;
}

.dup-lbl[b-2wu72lgz6f] {
    font-weight: 600;
    color: var(--rg-text-muted);
    min-width: 80px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dup-action-label[b-2wu72lgz6f] {
    margin: 0.5rem 0 0;
    font-size: 0.85rem;
    color: var(--rg-text-secondary);
}

/* ── Galería de miniaturas del duplicado ── */
.dup-galeria-section[b-2wu72lgz6f] {
    margin-bottom: 0.75rem;
}

.dup-galeria-label[b-2wu72lgz6f] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: block;
    margin-bottom: 0.4rem;
}

.dup-galeria-grid[b-2wu72lgz6f] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.dup-thumb[b-2wu72lgz6f] {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 6px;
    overflow: hidden;
    border: 2px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    cursor: pointer;
    padding: 0;
    transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.dup-thumb:hover[b-2wu72lgz6f] {
    transform: scale(1.06);
    border-color: var(--rg-primary);
    box-shadow: 0 4px 12px rgba(0,0,0,0.18);
}

.dup-thumb img[b-2wu72lgz6f] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.dup-thumb-badge[b-2wu72lgz6f] {
    position: absolute;
    bottom: 3px;
    right: 3px;
    font-size: 0.65rem;
    line-height: 1;
    border-radius: 50%;
    background: #fff;
}

.dup-thumb-badge.ok[b-2wu72lgz6f] { color: #16a34a; }

.dup-thumb-placeholder[b-2wu72lgz6f] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rg-text-muted);
    font-size: 1.6rem;
}

.dup-galeria-loading[b-2wu72lgz6f] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    padding: 0.4rem 0;
    margin-bottom: 0.5rem;
}

/* ── Visor fullscreen de imagen ── */
.img-viewer-backdrop[b-2wu72lgz6f] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.88);
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-viewer-container[b-2wu72lgz6f] {
    position: relative;
    max-width: 92vw;
    max-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.img-viewer-img[b-2wu72lgz6f] {
    max-width: 90vw;
    max-height: 88vh;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.6);
    object-fit: contain;
    display: block;
}

.img-viewer-close[b-2wu72lgz6f] {
    position: absolute;
    top: -2rem;
    right: -0.5rem;
    background: rgba(255,255,255,0.15);
    border: none;
    color: #fff;
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1rem;
    transition: background 0.15s;
}

.img-viewer-close:hover[b-2wu72lgz6f] {
    background: rgba(255,255,255,0.3);
}

/* ── Autocomplete RNC / Cédula ──────────────────────────────────── */
.rnc-ac-field[b-2wu72lgz6f] { position: relative; }
.rnc-ac-dropdown[b-2wu72lgz6f] {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 60;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    box-shadow: 0 12px 30px rgba(0,0,0,0.18);
    max-height: 280px;
    overflow-y: auto;
}
.rnc-ac-item[b-2wu72lgz6f] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.7rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border);
    font-size: 0.84rem;
}
.rnc-ac-item:last-child[b-2wu72lgz6f] { border-bottom: none; }
.rnc-ac-item:hover[b-2wu72lgz6f] { background: var(--rg-bg-hover); }
.rnc-ac-code[b-2wu72lgz6f] {
    font-family: 'Cascadia Code', monospace;
    font-size: 0.76rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    padding: 0.08rem 0.4rem;
    border-radius: 0.3rem;
    white-space: nowrap;
}
.rnc-ac-name[b-2wu72lgz6f] { color: var(--rg-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rnc-ac-empty[b-2wu72lgz6f] { display: flex; align-items: center; gap: 0.45rem; padding: 0.6rem 0.7rem; font-size: 0.8rem; color: var(--rg-text-muted); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmdiariogeneral.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-wxvlq06as6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wxvlq06as6 0.3s ease-out; }
@keyframes slideUp-b-wxvlq06as6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wxvlq06as6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wxvlq06as6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wxvlq06as6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wxvlq06as6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wxvlq06as6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wxvlq06as6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wxvlq06as6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wxvlq06as6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wxvlq06as6] { filter: brightness(1.1); }
.btn-outline[b-wxvlq06as6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wxvlq06as6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wxvlq06as6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wxvlq06as6] { filter: brightness(1.1); }
.btn-icon[b-wxvlq06as6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wxvlq06as6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wxvlq06as6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wxvlq06as6] { color: #ef4444; }
.btn-delete:hover[b-wxvlq06as6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-wxvlq06as6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wxvlq06as6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wxvlq06as6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wxvlq06as6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wxvlq06as6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wxvlq06as6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-wxvlq06as6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wxvlq06as6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-wxvlq06as6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wxvlq06as6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wxvlq06as6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wxvlq06as6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wxvlq06as6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wxvlq06as6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wxvlq06as6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-wxvlq06as6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-wxvlq06as6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-wxvlq06as6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-wxvlq06as6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-wxvlq06as6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-wxvlq06as6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-wxvlq06as6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-wxvlq06as6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-wxvlq06as6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-wxvlq06as6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-wxvlq06as6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-wxvlq06as6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-wxvlq06as6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-wxvlq06as6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-wxvlq06as6] { display: block; }
.hide-on-cards[b-wxvlq06as6] { display: none !important; }
.show-on-cards[b-wxvlq06as6] { display: grid; }
.hide-on-grid[b-wxvlq06as6] { display: none !important; }

/* Badges */
.badge[b-wxvlq06as6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wxvlq06as6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wxvlq06as6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-wxvlq06as6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wxvlq06as6] { text-align: center; }
.text-muted[b-wxvlq06as6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wxvlq06as6], .crud-empty-state[b-wxvlq06as6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wxvlq06as6] { font-size: 2rem; }
.crud-spinner[b-wxvlq06as6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wxvlq06as6 0.6s linear infinite; }
.crud-spinner-sm[b-wxvlq06as6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wxvlq06as6 0.6s linear infinite; }
@keyframes spin-b-wxvlq06as6 { to { transform: rotate(360deg); } }
.spin[b-wxvlq06as6] { animation: spin-b-wxvlq06as6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-wxvlq06as6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wxvlq06as6 0.15s ease-out; }
.modal-container[b-wxvlq06as6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wxvlq06as6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wxvlq06as6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-wxvlq06as6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-wxvlq06as6] { max-width: 420px; }
@keyframes fadeIn-b-wxvlq06as6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wxvlq06as6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wxvlq06as6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wxvlq06as6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-wxvlq06as6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-wxvlq06as6] { color: #dc2626; }
.modal-close[b-wxvlq06as6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wxvlq06as6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wxvlq06as6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wxvlq06as6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wxvlq06as6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-wxvlq06as6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wxvlq06as6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wxvlq06as6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wxvlq06as6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wxvlq06as6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wxvlq06as6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wxvlq06as6] { flex: 2; }
.form-group label[b-wxvlq06as6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wxvlq06as6], .form-group select[b-wxvlq06as6], .form-textarea[b-wxvlq06as6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wxvlq06as6], .form-group select:focus[b-wxvlq06as6], .form-textarea:focus[b-wxvlq06as6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wxvlq06as6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wxvlq06as6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wxvlq06as6] { flex: 1; display: flex; align-items: center; }
.form-check[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wxvlq06as6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-wxvlq06as6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-wxvlq06as6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-wxvlq06as6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-wxvlq06as6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-wxvlq06as6] { font-size: 3rem; }
.photo-placeholder span[b-wxvlq06as6] { font-size: 0.78rem; }
.photo-actions[b-wxvlq06as6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-wxvlq06as6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-wxvlq06as6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-wxvlq06as6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-wxvlq06as6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-wxvlq06as6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-wxvlq06as6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-wxvlq06as6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-wxvlq06as6] { filter: brightness(1.15); transform: scale(1.05); }
[b-wxvlq06as6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wxvlq06as6] { padding: 0.75rem; }
    .crud-header[b-wxvlq06as6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wxvlq06as6] { font-size: 1.1rem; }
    .btn-text[b-wxvlq06as6] { display: none; }
    .form-row[b-wxvlq06as6] { flex-direction: column; }
    .form-row-4[b-wxvlq06as6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wxvlq06as6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wxvlq06as6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-wxvlq06as6] { padding: 0.75rem; }
    .modal-tabs[b-wxvlq06as6] { overflow-x: auto; }
    .modal-tab[b-wxvlq06as6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-wxvlq06as6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-wxvlq06as6] { display: grid !important; }
    .crud-cards-wrapper[b-wxvlq06as6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-wxvlq06as6] { grid-template-columns: 1fr; }
    .card-details[b-wxvlq06as6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-wxvlq06as6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wxvlq06as6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wxvlq06as6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wxvlq06as6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmeliminadocumento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-236tpedu2a] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-236tpedu2a 0.3s ease-out; }
@keyframes slideUp-b-236tpedu2a { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-236tpedu2a] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-236tpedu2a] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-236tpedu2a] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-236tpedu2a] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-236tpedu2a] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-236tpedu2a] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-236tpedu2a] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-236tpedu2a] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-236tpedu2a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-236tpedu2a] { filter: brightness(1.1); }
.btn-outline[b-236tpedu2a] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-236tpedu2a] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-236tpedu2a] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-236tpedu2a] { filter: brightness(1.1); }
.btn-icon[b-236tpedu2a] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-236tpedu2a] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-236tpedu2a] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-236tpedu2a] { color: #ef4444; }
.btn-delete:hover[b-236tpedu2a] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-236tpedu2a] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-236tpedu2a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-236tpedu2a] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-236tpedu2a] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-236tpedu2a] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-236tpedu2a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-236tpedu2a] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-236tpedu2a] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-236tpedu2a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-236tpedu2a] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-236tpedu2a] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-236tpedu2a] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-236tpedu2a] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-236tpedu2a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-236tpedu2a] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-236tpedu2a] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-236tpedu2a] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-236tpedu2a] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-236tpedu2a] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-236tpedu2a] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-236tpedu2a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-236tpedu2a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-236tpedu2a] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-236tpedu2a] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-236tpedu2a] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-236tpedu2a] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-236tpedu2a] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-236tpedu2a] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-236tpedu2a] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-236tpedu2a] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-236tpedu2a] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-236tpedu2a] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-236tpedu2a] { display: block; }
.hide-on-cards[b-236tpedu2a] { display: none !important; }
.show-on-cards[b-236tpedu2a] { display: grid; }
.hide-on-grid[b-236tpedu2a] { display: none !important; }

/* Badges */
.badge[b-236tpedu2a] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-236tpedu2a] { background: #ecfdf5; color: #065f46; }
.badge-no[b-236tpedu2a] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-236tpedu2a] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-236tpedu2a] { text-align: center; }
.text-muted[b-236tpedu2a] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-236tpedu2a], .crud-empty-state[b-236tpedu2a] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-236tpedu2a] { font-size: 2rem; }
.crud-spinner[b-236tpedu2a] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-236tpedu2a 0.6s linear infinite; }
.crud-spinner-sm[b-236tpedu2a] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-236tpedu2a 0.6s linear infinite; }
@keyframes spin-b-236tpedu2a { to { transform: rotate(360deg); } }
.spin[b-236tpedu2a] { animation: spin-b-236tpedu2a 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-236tpedu2a] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-236tpedu2a 0.15s ease-out; }
.modal-container[b-236tpedu2a] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-236tpedu2a] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-236tpedu2a 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-236tpedu2a] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-236tpedu2a] { max-width: 420px; }
@keyframes fadeIn-b-236tpedu2a { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-236tpedu2a { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-236tpedu2a] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-236tpedu2a] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-236tpedu2a] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-236tpedu2a] { color: #dc2626; }
.modal-close[b-236tpedu2a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-236tpedu2a] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-236tpedu2a] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-236tpedu2a] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-236tpedu2a] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-236tpedu2a] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-236tpedu2a] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-236tpedu2a] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-236tpedu2a] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-236tpedu2a] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-236tpedu2a] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-236tpedu2a] { flex: 2; }
.form-group label[b-236tpedu2a] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-236tpedu2a], .form-group select[b-236tpedu2a], .form-textarea[b-236tpedu2a] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-236tpedu2a], .form-group select:focus[b-236tpedu2a], .form-textarea:focus[b-236tpedu2a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-236tpedu2a] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-236tpedu2a] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-236tpedu2a] { flex: 1; display: flex; align-items: center; }
.form-check[b-236tpedu2a] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-236tpedu2a] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-236tpedu2a] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-236tpedu2a] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-236tpedu2a] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-236tpedu2a] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-236tpedu2a] { font-size: 3rem; }
.photo-placeholder span[b-236tpedu2a] { font-size: 0.78rem; }
.photo-actions[b-236tpedu2a] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-236tpedu2a] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-236tpedu2a] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-236tpedu2a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-236tpedu2a] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-236tpedu2a] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-236tpedu2a] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-236tpedu2a] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-236tpedu2a] { filter: brightness(1.15); transform: scale(1.05); }
[b-236tpedu2a] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-236tpedu2a] { padding: 0.75rem; }
    .crud-header[b-236tpedu2a] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-236tpedu2a] { font-size: 1.1rem; }
    .btn-text[b-236tpedu2a] { display: none; }
    .form-row[b-236tpedu2a] { flex-direction: column; }
    .form-row-4[b-236tpedu2a] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-236tpedu2a] { width: 98%; max-height: 95vh; }
    .modal-lg[b-236tpedu2a] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-236tpedu2a] { padding: 0.75rem; }
    .modal-tabs[b-236tpedu2a] { overflow-x: auto; }
    .modal-tab[b-236tpedu2a] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-236tpedu2a] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-236tpedu2a] { display: grid !important; }
    .crud-cards-wrapper[b-236tpedu2a] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-236tpedu2a] { grid-template-columns: 1fr; }
    .card-details[b-236tpedu2a] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-236tpedu2a] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-236tpedu2a] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-236tpedu2a] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-236tpedu2a] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmencfvalidacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ta8k4n2x55] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ta8k4n2x55 0.3s ease-out; }
@keyframes slideUp-b-ta8k4n2x55 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ta8k4n2x55] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ta8k4n2x55] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ta8k4n2x55] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ta8k4n2x55] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ta8k4n2x55] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ta8k4n2x55] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ta8k4n2x55] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ta8k4n2x55] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ta8k4n2x55] { filter: brightness(1.1); }
.btn-outline[b-ta8k4n2x55] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ta8k4n2x55] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ta8k4n2x55] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ta8k4n2x55] { filter: brightness(1.1); }
.btn-icon[b-ta8k4n2x55] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ta8k4n2x55] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ta8k4n2x55] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ta8k4n2x55] { color: #ef4444; }
.btn-delete:hover[b-ta8k4n2x55] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ta8k4n2x55] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ta8k4n2x55] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ta8k4n2x55] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ta8k4n2x55] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ta8k4n2x55] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ta8k4n2x55] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ta8k4n2x55] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ta8k4n2x55] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ta8k4n2x55] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ta8k4n2x55] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ta8k4n2x55] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ta8k4n2x55] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ta8k4n2x55] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ta8k4n2x55] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ta8k4n2x55] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ta8k4n2x55] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ta8k4n2x55] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ta8k4n2x55] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ta8k4n2x55] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ta8k4n2x55] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ta8k4n2x55] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ta8k4n2x55] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ta8k4n2x55] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ta8k4n2x55] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ta8k4n2x55] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ta8k4n2x55] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ta8k4n2x55] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ta8k4n2x55] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ta8k4n2x55] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ta8k4n2x55] { display: block; }
.hide-on-cards[b-ta8k4n2x55] { display: none !important; }
.show-on-cards[b-ta8k4n2x55] { display: grid; }
.hide-on-grid[b-ta8k4n2x55] { display: none !important; }

/* Badges */
.badge[b-ta8k4n2x55] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ta8k4n2x55] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ta8k4n2x55] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ta8k4n2x55] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ta8k4n2x55] { text-align: center; }
.text-muted[b-ta8k4n2x55] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ta8k4n2x55], .crud-empty-state[b-ta8k4n2x55] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ta8k4n2x55] { font-size: 2rem; }
.crud-spinner[b-ta8k4n2x55] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ta8k4n2x55 0.6s linear infinite; }
.crud-spinner-sm[b-ta8k4n2x55] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ta8k4n2x55 0.6s linear infinite; }
@keyframes spin-b-ta8k4n2x55 { to { transform: rotate(360deg); } }
.spin[b-ta8k4n2x55] { animation: spin-b-ta8k4n2x55 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ta8k4n2x55] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ta8k4n2x55 0.15s ease-out; }
.modal-container[b-ta8k4n2x55] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ta8k4n2x55] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ta8k4n2x55 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ta8k4n2x55] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ta8k4n2x55] { max-width: 420px; }
@keyframes fadeIn-b-ta8k4n2x55 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ta8k4n2x55 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ta8k4n2x55] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ta8k4n2x55] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ta8k4n2x55] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ta8k4n2x55] { color: #dc2626; }
.modal-close[b-ta8k4n2x55] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ta8k4n2x55] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ta8k4n2x55] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ta8k4n2x55] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ta8k4n2x55] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ta8k4n2x55] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ta8k4n2x55] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ta8k4n2x55] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ta8k4n2x55] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ta8k4n2x55] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ta8k4n2x55] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ta8k4n2x55] { flex: 2; }
.form-group label[b-ta8k4n2x55] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ta8k4n2x55], .form-group select[b-ta8k4n2x55], .form-textarea[b-ta8k4n2x55] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ta8k4n2x55], .form-group select:focus[b-ta8k4n2x55], .form-textarea:focus[b-ta8k4n2x55] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ta8k4n2x55] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ta8k4n2x55] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ta8k4n2x55] { flex: 1; display: flex; align-items: center; }
.form-check[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ta8k4n2x55] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ta8k4n2x55] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ta8k4n2x55] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ta8k4n2x55] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ta8k4n2x55] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ta8k4n2x55] { font-size: 3rem; }
.photo-placeholder span[b-ta8k4n2x55] { font-size: 0.78rem; }
.photo-actions[b-ta8k4n2x55] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ta8k4n2x55] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ta8k4n2x55] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ta8k4n2x55] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ta8k4n2x55] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ta8k4n2x55] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ta8k4n2x55] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ta8k4n2x55] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ta8k4n2x55] { filter: brightness(1.15); transform: scale(1.05); }
[b-ta8k4n2x55] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ta8k4n2x55] { padding: 0.75rem; }
    .crud-header[b-ta8k4n2x55] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ta8k4n2x55] { font-size: 1.1rem; }
    .btn-text[b-ta8k4n2x55] { display: none; }
    .form-row[b-ta8k4n2x55] { flex-direction: column; }
    .form-row-4[b-ta8k4n2x55] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ta8k4n2x55] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ta8k4n2x55] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ta8k4n2x55] { padding: 0.75rem; }
    .modal-tabs[b-ta8k4n2x55] { overflow-x: auto; }
    .modal-tab[b-ta8k4n2x55] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ta8k4n2x55] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ta8k4n2x55] { display: grid !important; }
    .crud-cards-wrapper[b-ta8k4n2x55] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ta8k4n2x55] { grid-template-columns: 1fr; }
    .card-details[b-ta8k4n2x55] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ta8k4n2x55] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ta8k4n2x55] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ta8k4n2x55] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ta8k4n2x55] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmimpresioncatalogo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xaiamvwlki] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xaiamvwlki 0.3s ease-out; }
@keyframes slideUp-b-xaiamvwlki { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xaiamvwlki] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xaiamvwlki] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xaiamvwlki] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xaiamvwlki] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xaiamvwlki] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xaiamvwlki] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xaiamvwlki] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xaiamvwlki] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xaiamvwlki] { filter: brightness(1.1); }
.btn-outline[b-xaiamvwlki] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xaiamvwlki] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xaiamvwlki] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xaiamvwlki] { filter: brightness(1.1); }
.btn-icon[b-xaiamvwlki] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xaiamvwlki] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xaiamvwlki] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xaiamvwlki] { color: #ef4444; }
.btn-delete:hover[b-xaiamvwlki] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xaiamvwlki] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xaiamvwlki] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xaiamvwlki] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xaiamvwlki] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xaiamvwlki] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xaiamvwlki] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xaiamvwlki] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xaiamvwlki] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xaiamvwlki] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xaiamvwlki] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xaiamvwlki] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xaiamvwlki] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xaiamvwlki] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xaiamvwlki] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xaiamvwlki] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xaiamvwlki] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xaiamvwlki] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xaiamvwlki] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xaiamvwlki] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xaiamvwlki] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xaiamvwlki] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xaiamvwlki] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xaiamvwlki] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xaiamvwlki] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xaiamvwlki] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xaiamvwlki] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xaiamvwlki] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xaiamvwlki] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xaiamvwlki] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xaiamvwlki] { display: block; }
.hide-on-cards[b-xaiamvwlki] { display: none !important; }
.show-on-cards[b-xaiamvwlki] { display: grid; }
.hide-on-grid[b-xaiamvwlki] { display: none !important; }

/* Badges */
.badge[b-xaiamvwlki] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xaiamvwlki] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xaiamvwlki] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xaiamvwlki] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xaiamvwlki] { text-align: center; }
.text-muted[b-xaiamvwlki] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xaiamvwlki], .crud-empty-state[b-xaiamvwlki] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xaiamvwlki] { font-size: 2rem; }
.crud-spinner[b-xaiamvwlki] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xaiamvwlki 0.6s linear infinite; }
.crud-spinner-sm[b-xaiamvwlki] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xaiamvwlki 0.6s linear infinite; }
@keyframes spin-b-xaiamvwlki { to { transform: rotate(360deg); } }
.spin[b-xaiamvwlki] { animation: spin-b-xaiamvwlki 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xaiamvwlki] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xaiamvwlki 0.15s ease-out; }
.modal-container[b-xaiamvwlki] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xaiamvwlki] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xaiamvwlki 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xaiamvwlki] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xaiamvwlki] { max-width: 420px; }
@keyframes fadeIn-b-xaiamvwlki { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xaiamvwlki { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xaiamvwlki] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xaiamvwlki] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xaiamvwlki] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xaiamvwlki] { color: #dc2626; }
.modal-close[b-xaiamvwlki] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xaiamvwlki] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xaiamvwlki] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xaiamvwlki] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xaiamvwlki] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xaiamvwlki] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xaiamvwlki] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xaiamvwlki] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xaiamvwlki] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xaiamvwlki] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xaiamvwlki] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xaiamvwlki] { flex: 2; }
.form-group label[b-xaiamvwlki] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xaiamvwlki], .form-group select[b-xaiamvwlki], .form-textarea[b-xaiamvwlki] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xaiamvwlki], .form-group select:focus[b-xaiamvwlki], .form-textarea:focus[b-xaiamvwlki] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xaiamvwlki] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xaiamvwlki] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xaiamvwlki] { flex: 1; display: flex; align-items: center; }
.form-check[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xaiamvwlki] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xaiamvwlki] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xaiamvwlki] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xaiamvwlki] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xaiamvwlki] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xaiamvwlki] { font-size: 3rem; }
.photo-placeholder span[b-xaiamvwlki] { font-size: 0.78rem; }
.photo-actions[b-xaiamvwlki] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xaiamvwlki] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xaiamvwlki] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xaiamvwlki] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xaiamvwlki] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xaiamvwlki] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xaiamvwlki] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xaiamvwlki] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xaiamvwlki] { filter: brightness(1.15); transform: scale(1.05); }
[b-xaiamvwlki] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xaiamvwlki] { padding: 0.75rem; }
    .crud-header[b-xaiamvwlki] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xaiamvwlki] { font-size: 1.1rem; }
    .btn-text[b-xaiamvwlki] { display: none; }
    .form-row[b-xaiamvwlki] { flex-direction: column; }
    .form-row-4[b-xaiamvwlki] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xaiamvwlki] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xaiamvwlki] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xaiamvwlki] { padding: 0.75rem; }
    .modal-tabs[b-xaiamvwlki] { overflow-x: auto; }
    .modal-tab[b-xaiamvwlki] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xaiamvwlki] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xaiamvwlki] { display: grid !important; }
    .crud-cards-wrapper[b-xaiamvwlki] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xaiamvwlki] { grid-template-columns: 1fr; }
    .card-details[b-xaiamvwlki] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xaiamvwlki] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xaiamvwlki] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xaiamvwlki] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xaiamvwlki] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmmayor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8ytxw1tdbx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8ytxw1tdbx 0.3s ease-out; }
@keyframes slideUp-b-8ytxw1tdbx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8ytxw1tdbx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8ytxw1tdbx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8ytxw1tdbx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8ytxw1tdbx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8ytxw1tdbx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8ytxw1tdbx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8ytxw1tdbx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8ytxw1tdbx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8ytxw1tdbx] { filter: brightness(1.1); }
.btn-outline[b-8ytxw1tdbx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8ytxw1tdbx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8ytxw1tdbx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8ytxw1tdbx] { filter: brightness(1.1); }
.btn-icon[b-8ytxw1tdbx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8ytxw1tdbx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8ytxw1tdbx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8ytxw1tdbx] { color: #ef4444; }
.btn-delete:hover[b-8ytxw1tdbx] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8ytxw1tdbx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8ytxw1tdbx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8ytxw1tdbx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8ytxw1tdbx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8ytxw1tdbx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8ytxw1tdbx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8ytxw1tdbx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8ytxw1tdbx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8ytxw1tdbx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8ytxw1tdbx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8ytxw1tdbx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8ytxw1tdbx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8ytxw1tdbx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8ytxw1tdbx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8ytxw1tdbx] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8ytxw1tdbx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8ytxw1tdbx] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8ytxw1tdbx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8ytxw1tdbx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8ytxw1tdbx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8ytxw1tdbx] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8ytxw1tdbx] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8ytxw1tdbx] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8ytxw1tdbx] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8ytxw1tdbx] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8ytxw1tdbx] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8ytxw1tdbx] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8ytxw1tdbx] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8ytxw1tdbx] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8ytxw1tdbx] { display: block; }
.hide-on-cards[b-8ytxw1tdbx] { display: none !important; }
.show-on-cards[b-8ytxw1tdbx] { display: grid; }
.hide-on-grid[b-8ytxw1tdbx] { display: none !important; }

/* Badges */
.badge[b-8ytxw1tdbx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8ytxw1tdbx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8ytxw1tdbx] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8ytxw1tdbx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8ytxw1tdbx] { text-align: center; }
.text-muted[b-8ytxw1tdbx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8ytxw1tdbx], .crud-empty-state[b-8ytxw1tdbx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8ytxw1tdbx] { font-size: 2rem; }
.crud-spinner[b-8ytxw1tdbx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8ytxw1tdbx 0.6s linear infinite; }
.crud-spinner-sm[b-8ytxw1tdbx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8ytxw1tdbx 0.6s linear infinite; }
@keyframes spin-b-8ytxw1tdbx { to { transform: rotate(360deg); } }
.spin[b-8ytxw1tdbx] { animation: spin-b-8ytxw1tdbx 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8ytxw1tdbx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8ytxw1tdbx 0.15s ease-out; }
.modal-container[b-8ytxw1tdbx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8ytxw1tdbx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8ytxw1tdbx 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8ytxw1tdbx] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8ytxw1tdbx] { max-width: 420px; }
@keyframes fadeIn-b-8ytxw1tdbx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8ytxw1tdbx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8ytxw1tdbx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8ytxw1tdbx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8ytxw1tdbx] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8ytxw1tdbx] { color: #dc2626; }
.modal-close[b-8ytxw1tdbx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8ytxw1tdbx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8ytxw1tdbx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8ytxw1tdbx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8ytxw1tdbx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8ytxw1tdbx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8ytxw1tdbx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8ytxw1tdbx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8ytxw1tdbx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8ytxw1tdbx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8ytxw1tdbx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8ytxw1tdbx] { flex: 2; }
.form-group label[b-8ytxw1tdbx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8ytxw1tdbx], .form-group select[b-8ytxw1tdbx], .form-textarea[b-8ytxw1tdbx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8ytxw1tdbx], .form-group select:focus[b-8ytxw1tdbx], .form-textarea:focus[b-8ytxw1tdbx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8ytxw1tdbx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8ytxw1tdbx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8ytxw1tdbx] { flex: 1; display: flex; align-items: center; }
.form-check[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8ytxw1tdbx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8ytxw1tdbx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8ytxw1tdbx] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8ytxw1tdbx] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8ytxw1tdbx] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8ytxw1tdbx] { font-size: 3rem; }
.photo-placeholder span[b-8ytxw1tdbx] { font-size: 0.78rem; }
.photo-actions[b-8ytxw1tdbx] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8ytxw1tdbx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8ytxw1tdbx] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8ytxw1tdbx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8ytxw1tdbx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8ytxw1tdbx] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8ytxw1tdbx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8ytxw1tdbx] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8ytxw1tdbx] { filter: brightness(1.15); transform: scale(1.05); }
[b-8ytxw1tdbx] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8ytxw1tdbx] { padding: 0.75rem; }
    .crud-header[b-8ytxw1tdbx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8ytxw1tdbx] { font-size: 1.1rem; }
    .btn-text[b-8ytxw1tdbx] { display: none; }
    .form-row[b-8ytxw1tdbx] { flex-direction: column; }
    .form-row-4[b-8ytxw1tdbx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8ytxw1tdbx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8ytxw1tdbx] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8ytxw1tdbx] { padding: 0.75rem; }
    .modal-tabs[b-8ytxw1tdbx] { overflow-x: auto; }
    .modal-tab[b-8ytxw1tdbx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8ytxw1tdbx] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8ytxw1tdbx] { display: grid !important; }
    .crud-cards-wrapper[b-8ytxw1tdbx] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8ytxw1tdbx] { grid-template-columns: 1fr; }
    .card-details[b-8ytxw1tdbx] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8ytxw1tdbx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8ytxw1tdbx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8ytxw1tdbx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8ytxw1tdbx] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmmovimientos_contabilidad.razor.rz.scp.css */
/* Frmmovimientos_contabilidad — wrapper de página */
.mc-page[b-b44ftavpcl] { padding: 1.25rem; }

.mc-page-header[b-b44ftavpcl] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 1rem; gap: 1rem; flex-wrap: wrap;
}
.mc-page-header-left[b-b44ftavpcl] { display: flex; align-items: center; gap: .85rem; }
.mc-page-icon[b-b44ftavpcl] {
    font-size: 1.6rem;
    color: var(--rg-primary);
    background: rgba(26,58,92,.1);
    padding: .55rem;
    border-radius: 10px;
}
[data-mode="dark"] .mc-page-icon[b-b44ftavpcl] { background: rgba(147,197,253,.12); color: #93c5fd; }
.mc-page-title[b-b44ftavpcl]    { font-size: 1.15rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.mc-page-subtitle[b-b44ftavpcl] { font-size: .78rem; color: var(--rg-text-secondary); }
.mc-page-actions[b-b44ftavpcl]  { display: flex; gap: .5rem; }

/* ── Barra de control del documento ──────────────────────────── */
.mc-doc-bar[b-b44ftavpcl] {
    display: flex;
    align-items: flex-end;
    gap: .75rem;
    flex-wrap: wrap;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    padding: .75rem 1rem;
    margin-bottom: .75rem;
}

.mc-doc-field[b-b44ftavpcl] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.mc-doc-lbl[b-b44ftavpcl] {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--rg-text-muted);
}

.mc-doc-sel[b-b44ftavpcl],
.mc-doc-input[b-b44ftavpcl] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: .38rem .6rem;
    font-size: .85rem;
    height: 34px;
    min-width: 100px;
}
.mc-doc-sel:focus[b-b44ftavpcl],
.mc-doc-input:focus[b-b44ftavpcl] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 2px rgba(26,58,92,.15);
}
.mc-doc-input.err[b-b44ftavpcl] {
    border-color: var(--rg-danger);
    background: rgba(220,38,38,.05);
}
.mc-doc-input:disabled[b-b44ftavpcl],
.mc-doc-sel:disabled[b-b44ftavpcl] { opacity: .55; cursor: not-allowed; }

.mc-doc-input-wrap[b-b44ftavpcl] {
    position: relative;
    display: flex;
    align-items: center;
}
.mc-doc-char-hint[b-b44ftavpcl] {
    position: absolute;
    right: .4rem;
    font-size: .65rem;
    color: var(--rg-text-muted);
    pointer-events: none;
}

.mc-doc-val-hint[b-b44ftavpcl] {
    font-size: .68rem;
    margin-top: .1rem;
}
.mc-doc-val-hint.err[b-b44ftavpcl] { color: var(--rg-danger); }

.mc-doc-separator[b-b44ftavpcl] {
    width: 1px;
    height: 34px;
    background: var(--rg-border);
    margin: 0 .25rem;
    align-self: flex-end;
}

.mc-doc-load-wrap[b-b44ftavpcl] {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}

.mc-load-btn[b-b44ftavpcl] { height: 34px; padding: 0 .75rem; font-size: .82rem; }

.mc-edit-badge[b-b44ftavpcl] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: rgba(37,99,235,.12);
    color: var(--rg-accent);
    border: 1px solid rgba(37,99,235,.25);
    border-radius: 20px;
    padding: .2rem .65rem;
    font-size: .72rem;
    font-weight: 600;
}
[data-mode="dark"] .mc-edit-badge[b-b44ftavpcl] { color: #93c5fd; background: rgba(147,197,253,.12); }

.mc-readonly-badge[b-b44ftavpcl] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: rgba(220,38,38,.1);
    color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,.25);
    border-radius: 20px;
    padding: .2rem .65rem;
    font-size: .72rem;
    font-weight: 600;
}
[data-mode="dark"] .mc-readonly-badge[b-b44ftavpcl] { color: #fca5a5; }

/* ── Alerta ───────────────────────────────────────────────────── */
.crud-alert[b-b44ftavpcl] {
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    border-radius: 8px;
    display: flex; justify-content: space-between; align-items: center;
    font-size: .85rem; font-weight: 500;
}
.crud-alert.success[b-b44ftavpcl] { background: rgba(22,163,74,.12); color: var(--rg-success); border: 1px solid rgba(22,163,74,.3); }
.crud-alert.error[b-b44ftavpcl]   { background: rgba(220,38,38,.12); color: var(--rg-danger);  border: 1px solid rgba(220,38,38,.3); }
[data-mode="dark"] .crud-alert.success[b-b44ftavpcl] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-b44ftavpcl]   { color: #fca5a5; }
.crud-alert-close[b-b44ftavpcl] { background: none; border: none; color: inherit; cursor: pointer; padding: 2px 6px; }

/* ── Modal estándar ───────────────────────────────────────────── */
.modal-backdrop[b-b44ftavpcl] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 1000;
}
.modal-container[b-b44ftavpcl] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001;
    padding: 1rem;
}
.modal-dialog[b-b44ftavpcl] {
    pointer-events: auto;             /* ← Override Bootstrap '.modal-dialog{pointer-events:none}' */
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 12px;
    width: 100%;
    max-width: 520px;
    display: flex; flex-direction: column;
    max-height: calc(100vh - 2rem);
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.modal-sm[b-b44ftavpcl] { max-width: 380px; }
.modal-header[b-b44ftavpcl] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.modal-header h2[b-b44ftavpcl] { font-size: .95rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: .4rem; }
.modal-close[b-b44ftavpcl] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: .25rem .4rem; border-radius: 6px; font-size: 1rem; }
.modal-close:hover[b-b44ftavpcl] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.modal-body[b-b44ftavpcl] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: .75rem; }
.modal-footer[b-b44ftavpcl] { display: flex; justify-content: flex-end; gap: .5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* Modales anidados */
.modal-backdrop-nested[b-b44ftavpcl]  { z-index: 2000 !important; }
.modal-container-nested[b-b44ftavpcl] { z-index: 2001 !important; }

/* ── Botones estándar CRUD (necesarios por CSS isolation de Blazor) ─── */
.btn-crud[b-b44ftavpcl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-b44ftavpcl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-b44ftavpcl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-b44ftavpcl] { filter: brightness(1.1); }
.btn-outline[b-b44ftavpcl] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-b44ftavpcl] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-b44ftavpcl] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-b44ftavpcl] { filter: brightness(1.1); }
[data-mode="dark"] .btn-outline[b-b44ftavpcl] { color: var(--rg-text-secondary); border-color: var(--rg-border); }
[data-mode="dark"] .btn-outline:hover:not(:disabled)[b-b44ftavpcl] { background: var(--rg-bg-hover); }

/* ── Post-grabado ─────────────────────────────────────────────── */
.ps-modal[b-b44ftavpcl] { max-width: 380px; }
.ps-recibo-info[b-b44ftavpcl] {
    display: flex; align-items: baseline; gap: .6rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem;
}
.ps-label[b-b44ftavpcl] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-b44ftavpcl] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-acciones[b-b44ftavpcl] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-b44ftavpcl] { width: 100%; justify-content: center; }
.ps-pdf-error[b-b44ftavpcl] {
    display: flex; align-items: center; gap: .4rem;
    background: rgba(220,38,38,.10); color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,.25); border-radius: .4rem;
    padding: .4rem .65rem; font-size: .75rem; font-weight: 500;
}
[data-mode="dark"] .ps-pdf-error[b-b44ftavpcl] { color: #fca5a5; }

/* ── Form group (modal envío) ────────────────────────────────── */
.form-group[b-b44ftavpcl] { display: flex; flex-direction: column; gap: .3rem; }
.form-group label[b-b44ftavpcl] { font-size: .78rem; font-weight: 600; color: var(--rg-text-secondary); display: flex; align-items: center; gap: .35rem; }
.form-group input[b-b44ftavpcl] {
    background: var(--rg-bg-input); color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 6px;
    padding: .45rem .65rem; font-size: .85rem;
}
.form-group input:focus[b-b44ftavpcl] { border-color: var(--rg-primary); outline: none; box-shadow: 0 0 0 2px rgba(26,58,92,.15); }

/* ── Misc ─────────────────────────────────────────────────────── */
.font-mono[b-b44ftavpcl] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.spin[b-b44ftavpcl] { animation: mcp-spin-b-b44ftavpcl 1s linear infinite; }
@keyframes mcp-spin-b-b44ftavpcl { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frmsacingresolotencf.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kcfnr4g8al] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kcfnr4g8al 0.3s ease-out; }
@keyframes slideUp-b-kcfnr4g8al { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kcfnr4g8al] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kcfnr4g8al] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kcfnr4g8al] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kcfnr4g8al] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kcfnr4g8al] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kcfnr4g8al] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kcfnr4g8al] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kcfnr4g8al] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kcfnr4g8al] { filter: brightness(1.1); }
.btn-outline[b-kcfnr4g8al] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kcfnr4g8al] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kcfnr4g8al] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kcfnr4g8al] { filter: brightness(1.1); }
.btn-icon[b-kcfnr4g8al] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kcfnr4g8al] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kcfnr4g8al] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kcfnr4g8al] { color: #ef4444; }
.btn-delete:hover[b-kcfnr4g8al] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kcfnr4g8al] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kcfnr4g8al] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kcfnr4g8al] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kcfnr4g8al] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kcfnr4g8al] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kcfnr4g8al] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kcfnr4g8al] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kcfnr4g8al] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kcfnr4g8al] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kcfnr4g8al] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kcfnr4g8al] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kcfnr4g8al] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kcfnr4g8al] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kcfnr4g8al] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kcfnr4g8al] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kcfnr4g8al] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kcfnr4g8al] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kcfnr4g8al] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kcfnr4g8al] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kcfnr4g8al] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kcfnr4g8al] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kcfnr4g8al] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kcfnr4g8al] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kcfnr4g8al] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kcfnr4g8al] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kcfnr4g8al] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kcfnr4g8al] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kcfnr4g8al] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kcfnr4g8al] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kcfnr4g8al] { display: block; }
.hide-on-cards[b-kcfnr4g8al] { display: none !important; }
.show-on-cards[b-kcfnr4g8al] { display: grid; }
.hide-on-grid[b-kcfnr4g8al] { display: none !important; }

/* Badges */
.badge[b-kcfnr4g8al] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kcfnr4g8al] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kcfnr4g8al] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kcfnr4g8al] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kcfnr4g8al] { text-align: center; }
.text-muted[b-kcfnr4g8al] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kcfnr4g8al], .crud-empty-state[b-kcfnr4g8al] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kcfnr4g8al] { font-size: 2rem; }
.crud-spinner[b-kcfnr4g8al] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kcfnr4g8al 0.6s linear infinite; }
.crud-spinner-sm[b-kcfnr4g8al] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kcfnr4g8al 0.6s linear infinite; }
@keyframes spin-b-kcfnr4g8al { to { transform: rotate(360deg); } }
.spin[b-kcfnr4g8al] { animation: spin-b-kcfnr4g8al 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kcfnr4g8al] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kcfnr4g8al 0.15s ease-out; }
.modal-container[b-kcfnr4g8al] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kcfnr4g8al] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kcfnr4g8al 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kcfnr4g8al] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kcfnr4g8al] { max-width: 420px; }
@keyframes fadeIn-b-kcfnr4g8al { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kcfnr4g8al { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kcfnr4g8al] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kcfnr4g8al] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kcfnr4g8al] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kcfnr4g8al] { color: #dc2626; }
.modal-close[b-kcfnr4g8al] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kcfnr4g8al] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kcfnr4g8al] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kcfnr4g8al] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kcfnr4g8al] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kcfnr4g8al] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kcfnr4g8al] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kcfnr4g8al] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kcfnr4g8al] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kcfnr4g8al] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kcfnr4g8al] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kcfnr4g8al] { flex: 2; }
.form-group label[b-kcfnr4g8al] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kcfnr4g8al], .form-group select[b-kcfnr4g8al], .form-textarea[b-kcfnr4g8al] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kcfnr4g8al], .form-group select:focus[b-kcfnr4g8al], .form-textarea:focus[b-kcfnr4g8al] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kcfnr4g8al] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kcfnr4g8al] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kcfnr4g8al] { flex: 1; display: flex; align-items: center; }
.form-check[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kcfnr4g8al] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kcfnr4g8al] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kcfnr4g8al] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kcfnr4g8al] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kcfnr4g8al] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kcfnr4g8al] { font-size: 3rem; }
.photo-placeholder span[b-kcfnr4g8al] { font-size: 0.78rem; }
.photo-actions[b-kcfnr4g8al] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kcfnr4g8al] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kcfnr4g8al] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kcfnr4g8al] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kcfnr4g8al] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kcfnr4g8al] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kcfnr4g8al] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kcfnr4g8al] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kcfnr4g8al] { filter: brightness(1.15); transform: scale(1.05); }
[b-kcfnr4g8al] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kcfnr4g8al] { padding: 0.75rem; }
    .crud-header[b-kcfnr4g8al] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kcfnr4g8al] { font-size: 1.1rem; }
    .btn-text[b-kcfnr4g8al] { display: none; }
    .form-row[b-kcfnr4g8al] { flex-direction: column; }
    .form-row-4[b-kcfnr4g8al] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kcfnr4g8al] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kcfnr4g8al] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kcfnr4g8al] { padding: 0.75rem; }
    .modal-tabs[b-kcfnr4g8al] { overflow-x: auto; }
    .modal-tab[b-kcfnr4g8al] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kcfnr4g8al] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kcfnr4g8al] { display: grid !important; }
    .crud-cards-wrapper[b-kcfnr4g8al] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kcfnr4g8al] { grid-template-columns: 1fr; }
    .card-details[b-kcfnr4g8al] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kcfnr4g8al] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kcfnr4g8al] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kcfnr4g8al] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kcfnr4g8al] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frm_fx_providers.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rlrpcbqcbe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rlrpcbqcbe 0.3s ease-out; }
@keyframes slideUp-b-rlrpcbqcbe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rlrpcbqcbe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rlrpcbqcbe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rlrpcbqcbe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rlrpcbqcbe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rlrpcbqcbe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rlrpcbqcbe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rlrpcbqcbe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rlrpcbqcbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rlrpcbqcbe] { filter: brightness(1.1); }
.btn-outline[b-rlrpcbqcbe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rlrpcbqcbe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rlrpcbqcbe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rlrpcbqcbe] { filter: brightness(1.1); }
.btn-icon[b-rlrpcbqcbe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rlrpcbqcbe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rlrpcbqcbe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rlrpcbqcbe] { color: #ef4444; }
.btn-delete:hover[b-rlrpcbqcbe] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rlrpcbqcbe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rlrpcbqcbe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rlrpcbqcbe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rlrpcbqcbe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rlrpcbqcbe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rlrpcbqcbe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rlrpcbqcbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rlrpcbqcbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rlrpcbqcbe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rlrpcbqcbe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rlrpcbqcbe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rlrpcbqcbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rlrpcbqcbe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rlrpcbqcbe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rlrpcbqcbe] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rlrpcbqcbe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rlrpcbqcbe] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rlrpcbqcbe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rlrpcbqcbe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rlrpcbqcbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rlrpcbqcbe] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rlrpcbqcbe] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rlrpcbqcbe] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rlrpcbqcbe] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rlrpcbqcbe] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rlrpcbqcbe] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rlrpcbqcbe] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rlrpcbqcbe] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rlrpcbqcbe] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rlrpcbqcbe] { display: block; }
.hide-on-cards[b-rlrpcbqcbe] { display: none !important; }
.show-on-cards[b-rlrpcbqcbe] { display: grid; }
.hide-on-grid[b-rlrpcbqcbe] { display: none !important; }

/* Badges */
.badge[b-rlrpcbqcbe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rlrpcbqcbe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rlrpcbqcbe] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rlrpcbqcbe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rlrpcbqcbe] { text-align: center; }
.text-muted[b-rlrpcbqcbe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rlrpcbqcbe], .crud-empty-state[b-rlrpcbqcbe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rlrpcbqcbe] { font-size: 2rem; }
.crud-spinner[b-rlrpcbqcbe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rlrpcbqcbe 0.6s linear infinite; }
.crud-spinner-sm[b-rlrpcbqcbe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rlrpcbqcbe 0.6s linear infinite; }
@keyframes spin-b-rlrpcbqcbe { to { transform: rotate(360deg); } }
.spin[b-rlrpcbqcbe] { animation: spin-b-rlrpcbqcbe 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rlrpcbqcbe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rlrpcbqcbe 0.15s ease-out; }
.modal-container[b-rlrpcbqcbe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rlrpcbqcbe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rlrpcbqcbe 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-rlrpcbqcbe] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rlrpcbqcbe] { max-width: 420px; }
@keyframes fadeIn-b-rlrpcbqcbe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rlrpcbqcbe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rlrpcbqcbe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rlrpcbqcbe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rlrpcbqcbe] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rlrpcbqcbe] { color: #dc2626; }
.modal-close[b-rlrpcbqcbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rlrpcbqcbe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rlrpcbqcbe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rlrpcbqcbe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rlrpcbqcbe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rlrpcbqcbe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rlrpcbqcbe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rlrpcbqcbe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rlrpcbqcbe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rlrpcbqcbe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rlrpcbqcbe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rlrpcbqcbe] { flex: 2; }
.form-group label[b-rlrpcbqcbe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rlrpcbqcbe], .form-group select[b-rlrpcbqcbe], .form-textarea[b-rlrpcbqcbe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rlrpcbqcbe], .form-group select:focus[b-rlrpcbqcbe], .form-textarea:focus[b-rlrpcbqcbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rlrpcbqcbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rlrpcbqcbe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rlrpcbqcbe] { flex: 1; display: flex; align-items: center; }
.form-check[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rlrpcbqcbe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rlrpcbqcbe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rlrpcbqcbe] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rlrpcbqcbe] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rlrpcbqcbe] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rlrpcbqcbe] { font-size: 3rem; }
.photo-placeholder span[b-rlrpcbqcbe] { font-size: 0.78rem; }
.photo-actions[b-rlrpcbqcbe] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rlrpcbqcbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-rlrpcbqcbe] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rlrpcbqcbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rlrpcbqcbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rlrpcbqcbe] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rlrpcbqcbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rlrpcbqcbe] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rlrpcbqcbe] { filter: brightness(1.15); transform: scale(1.05); }
[b-rlrpcbqcbe] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rlrpcbqcbe] { padding: 0.75rem; }
    .crud-header[b-rlrpcbqcbe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rlrpcbqcbe] { font-size: 1.1rem; }
    .btn-text[b-rlrpcbqcbe] { display: none; }
    .form-row[b-rlrpcbqcbe] { flex-direction: column; }
    .form-row-4[b-rlrpcbqcbe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rlrpcbqcbe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rlrpcbqcbe] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rlrpcbqcbe] { padding: 0.75rem; }
    .modal-tabs[b-rlrpcbqcbe] { overflow-x: auto; }
    .modal-tab[b-rlrpcbqcbe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rlrpcbqcbe] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rlrpcbqcbe] { display: grid !important; }
    .crud-cards-wrapper[b-rlrpcbqcbe] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rlrpcbqcbe] { grid-template-columns: 1fr; }
    .card-details[b-rlrpcbqcbe] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-rlrpcbqcbe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rlrpcbqcbe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rlrpcbqcbe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rlrpcbqcbe] { background:rgba(37,99,235,.25); }

/* ── Específicos de Frm_fx_providers ─────────────────────── */
.ffp-url a[b-rlrpcbqcbe] {
    color: var(--rg-accent, #2563eb);
    text-decoration: none;
    font-family: var(--font-mono, monospace);
    font-size: .82rem;
}
.ffp-url a:hover[b-rlrpcbqcbe] { text-decoration: underline; }

.ffp-prueba-result[b-rlrpcbqcbe] {
    padding: .65rem .85rem;
    border-radius: .5rem;
    font-size: .85rem;
}
.ffp-prueba-result.ok[b-rlrpcbqcbe] {
    background: rgba(34, 197, 94, .08);
    border: 1px solid rgba(34, 197, 94, .3);
    color: #166534;
}
.ffp-prueba-result.fail[b-rlrpcbqcbe] {
    background: rgba(220, 38, 38, .08);
    border: 1px solid rgba(220, 38, 38, .3);
    color: #991b1b;
}
[data-mode="dark"] .ffp-prueba-result.ok[b-rlrpcbqcbe]   { color: #86efac; }
[data-mode="dark"] .ffp-prueba-result.fail[b-rlrpcbqcbe] { color: #fca5a5; }
.ffp-prueba-vals[b-rlrpcbqcbe] {
    display: flex; flex-direction: column; gap: .2rem;
    margin-top: .4rem;
    font-size: .8rem;
    color: var(--rg-text-secondary);
}
.ffp-prueba-vals small[b-rlrpcbqcbe] {
    background: var(--rg-bg-subtle);
    padding: 1px 5px; border-radius: 3px;
    margin-left: .3rem;
}

.rg-check[b-rlrpcbqcbe] {
    display: inline-flex; align-items: center; gap: .55rem;
    color: var(--rg-text-primary); font-size: .9rem; cursor: pointer;
}
.rg-check input[type="checkbox"][b-rlrpcbqcbe] { width: 18px; height: 18px; cursor: pointer; }

/* Botón Capturar ahora — rayo distintivo */
.ffp-btn-capturar[b-rlrpcbqcbe] {
    background: rgba(234, 88, 12, .10);
    color: #c2410c;
    border: 1px solid rgba(234, 88, 12, .25);
}
.ffp-btn-capturar:hover[b-rlrpcbqcbe] {
    background: rgba(234, 88, 12, .20);
    border-color: rgba(234, 88, 12, .45);
}
[data-mode="dark"] .ffp-btn-capturar[b-rlrpcbqcbe] {
    background: rgba(251, 146, 60, .15);
    color: #fdba74;
    border-color: rgba(251, 146, 60, .35);
}
[data-mode="dark"] .ffp-btn-capturar:hover[b-rlrpcbqcbe] { background: rgba(251, 146, 60, .25); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frm_monedas.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ea23bua5yn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ea23bua5yn 0.3s ease-out; }
@keyframes slideUp-b-ea23bua5yn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ea23bua5yn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ea23bua5yn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ea23bua5yn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ea23bua5yn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ea23bua5yn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ea23bua5yn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ea23bua5yn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ea23bua5yn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ea23bua5yn] { filter: brightness(1.1); }
.btn-outline[b-ea23bua5yn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ea23bua5yn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ea23bua5yn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ea23bua5yn] { filter: brightness(1.1); }
.btn-icon[b-ea23bua5yn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ea23bua5yn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ea23bua5yn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ea23bua5yn] { color: #ef4444; }
.btn-delete:hover[b-ea23bua5yn] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ea23bua5yn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ea23bua5yn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ea23bua5yn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ea23bua5yn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ea23bua5yn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ea23bua5yn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ea23bua5yn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ea23bua5yn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ea23bua5yn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ea23bua5yn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ea23bua5yn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ea23bua5yn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ea23bua5yn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ea23bua5yn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ea23bua5yn] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ea23bua5yn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ea23bua5yn] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ea23bua5yn] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ea23bua5yn] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ea23bua5yn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ea23bua5yn] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ea23bua5yn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ea23bua5yn] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ea23bua5yn] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ea23bua5yn] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ea23bua5yn] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ea23bua5yn] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ea23bua5yn] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ea23bua5yn] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ea23bua5yn] { display: block; }
.hide-on-cards[b-ea23bua5yn] { display: none !important; }
.show-on-cards[b-ea23bua5yn] { display: grid; }
.hide-on-grid[b-ea23bua5yn] { display: none !important; }

/* Badges */
.badge[b-ea23bua5yn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ea23bua5yn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ea23bua5yn] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ea23bua5yn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ea23bua5yn] { text-align: center; }
.text-muted[b-ea23bua5yn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ea23bua5yn], .crud-empty-state[b-ea23bua5yn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ea23bua5yn] { font-size: 2rem; }
.crud-spinner[b-ea23bua5yn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ea23bua5yn 0.6s linear infinite; }
.crud-spinner-sm[b-ea23bua5yn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ea23bua5yn 0.6s linear infinite; }
@keyframes spin-b-ea23bua5yn { to { transform: rotate(360deg); } }
.spin[b-ea23bua5yn] { animation: spin-b-ea23bua5yn 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ea23bua5yn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ea23bua5yn 0.15s ease-out; }
.modal-container[b-ea23bua5yn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ea23bua5yn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ea23bua5yn 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-ea23bua5yn] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ea23bua5yn] { max-width: 420px; }
@keyframes fadeIn-b-ea23bua5yn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ea23bua5yn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ea23bua5yn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ea23bua5yn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ea23bua5yn] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ea23bua5yn] { color: #dc2626; }
.modal-close[b-ea23bua5yn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ea23bua5yn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ea23bua5yn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ea23bua5yn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ea23bua5yn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ea23bua5yn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ea23bua5yn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ea23bua5yn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ea23bua5yn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ea23bua5yn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ea23bua5yn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ea23bua5yn] { flex: 2; }
.form-group label[b-ea23bua5yn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ea23bua5yn], .form-group select[b-ea23bua5yn], .form-textarea[b-ea23bua5yn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ea23bua5yn], .form-group select:focus[b-ea23bua5yn], .form-textarea:focus[b-ea23bua5yn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ea23bua5yn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ea23bua5yn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ea23bua5yn] { flex: 1; display: flex; align-items: center; }
.form-check[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ea23bua5yn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ea23bua5yn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ea23bua5yn] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ea23bua5yn] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ea23bua5yn] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ea23bua5yn] { font-size: 3rem; }
.photo-placeholder span[b-ea23bua5yn] { font-size: 0.78rem; }
.photo-actions[b-ea23bua5yn] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ea23bua5yn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-ea23bua5yn] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ea23bua5yn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ea23bua5yn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ea23bua5yn] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ea23bua5yn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ea23bua5yn] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ea23bua5yn] { filter: brightness(1.15); transform: scale(1.05); }
[b-ea23bua5yn] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ea23bua5yn] { padding: 0.75rem; }
    .crud-header[b-ea23bua5yn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ea23bua5yn] { font-size: 1.1rem; }
    .btn-text[b-ea23bua5yn] { display: none; }
    .form-row[b-ea23bua5yn] { flex-direction: column; }
    .form-row-4[b-ea23bua5yn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ea23bua5yn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ea23bua5yn] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ea23bua5yn] { padding: 0.75rem; }
    .modal-tabs[b-ea23bua5yn] { overflow-x: auto; }
    .modal-tab[b-ea23bua5yn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ea23bua5yn] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ea23bua5yn] { display: grid !important; }
    .crud-cards-wrapper[b-ea23bua5yn] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ea23bua5yn] { grid-template-columns: 1fr; }
    .card-details[b-ea23bua5yn] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ea23bua5yn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ea23bua5yn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ea23bua5yn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ea23bua5yn] { background:rgba(37,99,235,.25); }

/* ── Específicos de Frm_monedas ─────────────────────────── */
.fmon-row-local[b-ea23bua5yn] { background: rgba(34,197,94,.04); }
[data-mode="dark"] .fmon-row-local[b-ea23bua5yn] { background: rgba(34,197,94,.10); }

.fmon-icon[b-ea23bua5yn] {
    width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: 8px; font-weight: 700; color: var(--rg-text-primary);
    font-family: var(--font-mono, monospace);
}

.fmon-flag[b-ea23bua5yn] {
    width: 36px;
    height: 27px;
    object-fit: cover;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    display: block;
    box-shadow: 0 1px 2px rgba(0,0,0,.08);
}
[data-mode="dark"] .fmon-flag[b-ea23bua5yn] { border-color: rgba(255,255,255,.15); }

.rg-check[b-ea23bua5yn] {
    display: inline-flex; align-items: center; gap: .55rem;
    color: var(--rg-text-primary); font-size: .9rem; cursor: pointer;
}
.rg-check input[type="checkbox"][b-ea23bua5yn] { width: 18px; height: 18px; cursor: pointer; }
.rg-check i[b-ea23bua5yn] { color: var(--rg-text-secondary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Frm_tasa_moneda_diaria.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2elkx1ltbh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2elkx1ltbh 0.3s ease-out; }
@keyframes slideUp-b-2elkx1ltbh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2elkx1ltbh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2elkx1ltbh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2elkx1ltbh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2elkx1ltbh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2elkx1ltbh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2elkx1ltbh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2elkx1ltbh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2elkx1ltbh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2elkx1ltbh] { filter: brightness(1.1); }
.btn-outline[b-2elkx1ltbh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2elkx1ltbh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2elkx1ltbh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2elkx1ltbh] { filter: brightness(1.1); }
.btn-icon[b-2elkx1ltbh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2elkx1ltbh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2elkx1ltbh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2elkx1ltbh] { color: #ef4444; }
.btn-delete:hover[b-2elkx1ltbh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2elkx1ltbh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2elkx1ltbh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2elkx1ltbh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2elkx1ltbh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2elkx1ltbh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2elkx1ltbh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2elkx1ltbh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2elkx1ltbh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2elkx1ltbh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2elkx1ltbh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2elkx1ltbh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2elkx1ltbh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2elkx1ltbh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2elkx1ltbh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2elkx1ltbh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2elkx1ltbh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2elkx1ltbh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2elkx1ltbh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2elkx1ltbh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2elkx1ltbh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2elkx1ltbh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2elkx1ltbh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2elkx1ltbh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2elkx1ltbh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2elkx1ltbh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2elkx1ltbh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2elkx1ltbh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2elkx1ltbh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2elkx1ltbh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2elkx1ltbh] { display: block; }
.hide-on-cards[b-2elkx1ltbh] { display: none !important; }
.show-on-cards[b-2elkx1ltbh] { display: grid; }
.hide-on-grid[b-2elkx1ltbh] { display: none !important; }

/* Badges */
.badge[b-2elkx1ltbh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2elkx1ltbh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2elkx1ltbh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2elkx1ltbh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2elkx1ltbh] { text-align: center; }
.text-muted[b-2elkx1ltbh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2elkx1ltbh], .crud-empty-state[b-2elkx1ltbh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2elkx1ltbh] { font-size: 2rem; }
.crud-spinner[b-2elkx1ltbh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2elkx1ltbh 0.6s linear infinite; }
.crud-spinner-sm[b-2elkx1ltbh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2elkx1ltbh 0.6s linear infinite; }
@keyframes spin-b-2elkx1ltbh { to { transform: rotate(360deg); } }
.spin[b-2elkx1ltbh] { animation: spin-b-2elkx1ltbh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2elkx1ltbh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2elkx1ltbh 0.15s ease-out; }
.modal-container[b-2elkx1ltbh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2elkx1ltbh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2elkx1ltbh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-2elkx1ltbh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2elkx1ltbh] { max-width: 420px; }
@keyframes fadeIn-b-2elkx1ltbh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2elkx1ltbh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2elkx1ltbh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2elkx1ltbh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2elkx1ltbh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2elkx1ltbh] { color: #dc2626; }
.modal-close[b-2elkx1ltbh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2elkx1ltbh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2elkx1ltbh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2elkx1ltbh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2elkx1ltbh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2elkx1ltbh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2elkx1ltbh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2elkx1ltbh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2elkx1ltbh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2elkx1ltbh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2elkx1ltbh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2elkx1ltbh] { flex: 2; }
.form-group label[b-2elkx1ltbh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2elkx1ltbh], .form-group select[b-2elkx1ltbh], .form-textarea[b-2elkx1ltbh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2elkx1ltbh], .form-group select:focus[b-2elkx1ltbh], .form-textarea:focus[b-2elkx1ltbh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2elkx1ltbh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2elkx1ltbh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2elkx1ltbh] { flex: 1; display: flex; align-items: center; }
.form-check[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2elkx1ltbh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2elkx1ltbh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2elkx1ltbh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2elkx1ltbh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2elkx1ltbh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2elkx1ltbh] { font-size: 3rem; }
.photo-placeholder span[b-2elkx1ltbh] { font-size: 0.78rem; }
.photo-actions[b-2elkx1ltbh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2elkx1ltbh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-2elkx1ltbh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2elkx1ltbh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2elkx1ltbh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2elkx1ltbh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2elkx1ltbh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2elkx1ltbh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2elkx1ltbh] { filter: brightness(1.15); transform: scale(1.05); }
[b-2elkx1ltbh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2elkx1ltbh] { padding: 0.75rem; }
    .crud-header[b-2elkx1ltbh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2elkx1ltbh] { font-size: 1.1rem; }
    .btn-text[b-2elkx1ltbh] { display: none; }
    .form-row[b-2elkx1ltbh] { flex-direction: column; }
    .form-row-4[b-2elkx1ltbh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2elkx1ltbh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2elkx1ltbh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2elkx1ltbh] { padding: 0.75rem; }
    .modal-tabs[b-2elkx1ltbh] { overflow-x: auto; }
    .modal-tab[b-2elkx1ltbh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2elkx1ltbh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2elkx1ltbh] { display: grid !important; }
    .crud-cards-wrapper[b-2elkx1ltbh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2elkx1ltbh] { grid-template-columns: 1fr; }
    .card-details[b-2elkx1ltbh] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-2elkx1ltbh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2elkx1ltbh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2elkx1ltbh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2elkx1ltbh] { background:rgba(37,99,235,.25); }

/* ── Específicos de Frm_tasa_moneda_diaria ───────────────── */
.ftm-capture-card[b-2elkx1ltbh] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-left: 4px solid var(--rg-primary, #1a3a5c);
    border-radius: .65rem;
    padding: 1rem 1.25rem;
    margin: 1rem 1.25rem;
}
.ftm-capture-title[b-2elkx1ltbh] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .95rem; font-weight: 700;
    color: var(--rg-text-primary);
    margin-bottom: .75rem;
}
.ftm-capture-date[b-2elkx1ltbh] {
    margin-left: auto;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    padding: 2px 10px; border-radius: 999px;
    font-family: var(--font-mono, monospace); font-size: .8rem;
    color: var(--rg-text-secondary); font-weight: 600;
}
.ftm-capture-row[b-2elkx1ltbh] { display: flex; gap: .75rem; flex-wrap: wrap; }
.ftm-capture-hint[b-2elkx1ltbh] {
    margin: .65rem 0 0;
    font-size: .8rem; color: var(--rg-text-secondary);
}
.ftm-capture-hint i[b-2elkx1ltbh] { color: var(--rg-accent, #2563eb); margin-right: .25rem; }

.ftm-delta-up[b-2elkx1ltbh]   { color: var(--rg-success, #16a34a); }
.ftm-delta-down[b-2elkx1ltbh] { color: var(--rg-danger,  #dc2626); }
[data-mode="dark"] .ftm-delta-up[b-2elkx1ltbh]   { color: #86efac; }
[data-mode="dark"] .ftm-delta-down[b-2elkx1ltbh] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Informeycontroles/FrmCtbAnalisisGerencialV2.razor.rz.scp.css */
.ag-container[b-94l8upa2uy] { padding: 1.2rem 1.4rem; }

.ag-header[b-94l8upa2uy] { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.ag-header-left[b-94l8upa2uy] { display:flex; align-items:center; gap:.8rem; }
.ag-header-icon[b-94l8upa2uy] { font-size:1.8rem; color:var(--rg-primary); }
.ag-title[b-94l8upa2uy] { font-size:1.5rem; font-weight:800; color:var(--rg-text-primary); margin:0; }
.ag-subtitle[b-94l8upa2uy] { font-size:.82rem; color:var(--rg-text-secondary); }
.ag-filters[b-94l8upa2uy] { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.ag-filters label[b-94l8upa2uy] { font-size:.74rem; font-weight:700; color:var(--rg-text-secondary); text-transform:uppercase; }
.ag-filters select[b-94l8upa2uy], .ag-toolbar input[type=date][b-94l8upa2uy] {
    background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border);
    border-radius:7px; padding:.42rem .6rem; font-size:.84rem;
}

.ag-tabs[b-94l8upa2uy] { display:flex; gap:.4rem; flex-wrap:wrap; border-bottom:1px solid var(--rg-border); padding-bottom:.6rem; margin-bottom:1rem; }
.ag-tab[b-94l8upa2uy] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:8px; padding:.5rem .9rem; font-size:.8rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; align-items:center; gap:.4rem; }
.ag-tab:hover[b-94l8upa2uy] { background:var(--rg-bg-hover); }
.ag-tab.active[b-94l8upa2uy] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }

.ag-toolbar[b-94l8upa2uy] { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:10px; padding:.7rem .9rem; margin-bottom:1rem; }
.ag-toolbar label[b-94l8upa2uy] { font-size:.74rem; font-weight:700; color:var(--rg-text-secondary); text-transform:uppercase; }

.ag-doc[b-94l8upa2uy] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:14px; padding:1.5rem; margin-bottom:1.2rem; }
.ag-doc-head[b-94l8upa2uy] { border-bottom:2px solid var(--rg-border); padding-bottom:.7rem; margin-bottom:1rem; text-align:center; }
.ag-doc-head .ti[b-94l8upa2uy] { color:var(--rg-primary); font-weight:800; font-size:1.1rem; }
.ag-doc-head .pe[b-94l8upa2uy] { color:var(--rg-text-secondary); font-size:.8rem; margin-top:.15rem; }

.ag-table[b-94l8upa2uy] { width:100%; border-collapse:collapse; font-size:.84rem; }
.ag-table th[b-94l8upa2uy] { text-align:left; color:var(--rg-text-secondary); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; padding:.5rem .6rem; background:var(--rg-bg-subtle); border-bottom:1px solid var(--rg-border); }
.ag-table td[b-94l8upa2uy] { padding:.42rem .6rem; border-bottom:1px solid var(--rg-border); color:var(--rg-text-primary); }
.ag-table td.r[b-94l8upa2uy], .ag-table th.r[b-94l8upa2uy] { text-align:right; font-variant-numeric:tabular-nums; }
.ag-tot td[b-94l8upa2uy] { font-weight:800; background:var(--rg-primary); color:#fff; }
.ag-code[b-94l8upa2uy] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.74rem; color:var(--rg-text-muted); }
.ag-pos[b-94l8upa2uy] { color:var(--rg-success); }
.ag-neg[b-94l8upa2uy] { color:var(--rg-danger); }
.ag-bar[b-94l8upa2uy] { display:inline-block; height:8px; border-radius:4px; vertical-align:middle; min-width:2px; }

.ag-kpis[b-94l8upa2uy] { display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem; margin-bottom:1rem; }
.ag-kpi[b-94l8upa2uy] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.85rem; }
.ag-kpi .l[b-94l8upa2uy] { font-size:.66rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.05em; }
.ag-kpi .v[b-94l8upa2uy] { font-size:1.25rem; font-weight:800; margin-top:.25rem; color:var(--rg-text-primary); }

.ag-ratios[b-94l8upa2uy] { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }
.ag-rcard[b-94l8upa2uy] { background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:12px; padding:1rem; }
.ag-rcard .rn[b-94l8upa2uy] { font-size:.72rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.ag-rcard .rv[b-94l8upa2uy] { font-size:1.6rem; font-weight:800; margin:.3rem 0; }
.ag-rcard .rd[b-94l8upa2uy] { font-size:.72rem; color:var(--rg-text-muted); }
.ag-track[b-94l8upa2uy] { height:7px; background:var(--rg-bg-input); border-radius:4px; overflow:hidden; margin-top:.5rem; }
.ag-fill[b-94l8upa2uy] { height:100%; border-radius:4px; }

.ag-chart[b-94l8upa2uy] { display:flex; align-items:flex-end; gap:.6rem; height:210px; padding:1rem .4rem 0; border-bottom:1px solid var(--rg-border); }
.ag-col[b-94l8upa2uy] { flex:1; display:flex; flex-direction:column; align-items:center; height:100%; justify-content:flex-end; }
.ag-col .bars[b-94l8upa2uy] { display:flex; align-items:flex-end; gap:3px; height:100%; }
.ag-col .b[b-94l8upa2uy] { width:14px; border-radius:3px 3px 0 0; min-height:2px; }
.ag-col .mm[b-94l8upa2uy] { font-size:.66rem; color:var(--rg-text-muted); margin-top:.3rem; }
.ag-legend[b-94l8upa2uy] { display:flex; gap:1rem; justify-content:center; margin-top:.7rem; font-size:.74rem; color:var(--rg-text-secondary); }
.ag-legend span[b-94l8upa2uy] { display:inline-flex; align-items:center; gap:.3rem; }
.ag-legend .dot[b-94l8upa2uy] { width:10px; height:10px; border-radius:3px; display:inline-block; }

.ag-loading[b-94l8upa2uy] { display:flex; align-items:center; justify-content:center; gap:.7rem; padding:3rem; color:var(--rg-text-secondary); }
.ag-spinner[b-94l8upa2uy] { width:24px; height:24px; border:3px solid var(--rg-border); border-top-color:var(--rg-primary); border-radius:50%; animation:ag-spin-b-94l8upa2uy .7s linear infinite; }
@keyframes ag-spin-b-94l8upa2uy { to { transform:rotate(360deg); } }

@media (max-width:760px){ .ag-kpis[b-94l8upa2uy], .ag-ratios[b-94l8upa2uy] { grid-template-columns:repeat(2,1fr); } }

/* Toggle Grid/Tarjeta + Cards (reutilizable) */
.iv-toggle[b-94l8upa2uy] { display:inline-flex; border:1px solid var(--rg-border); border-radius:8px; overflow:hidden; }
.iv-tb[b-94l8upa2uy] { background:var(--rg-bg-card); border:none; padding:.42rem .8rem; font-size:.78rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; gap:.35rem; align-items:center; }
.iv-tb:hover[b-94l8upa2uy] { background:var(--rg-bg-hover); }
.iv-tb.active[b-94l8upa2uy] { background:var(--rg-primary); color:#fff; }
.iv-tb + .iv-tb[b-94l8upa2uy] { border-left:1px solid var(--rg-border); }
.iv-cards[b-94l8upa2uy] { display:grid; grid-template-columns:1fr; gap:.55rem; }
.iv-card[b-94l8upa2uy] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.75rem .9rem; }
.iv-card-head[b-94l8upa2uy] { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; flex-wrap:wrap; font-weight:700; color:var(--rg-text-primary); font-size:.88rem; margin-bottom:.45rem; }
.iv-card-head .code[b-94l8upa2uy] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.72rem; color:var(--rg-text-muted); font-weight:400; }
.iv-card-grid[b-94l8upa2uy] { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:.4rem .8rem; font-size:.82rem; }
.iv-kv[b-94l8upa2uy] { display:flex; flex-direction:column; gap:.05rem; }
.iv-kv .k[b-94l8upa2uy] { font-size:.65rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.iv-kv .v[b-94l8upa2uy] { color:var(--rg-text-primary); font-variant-numeric:tabular-nums; }
.iv-kv .v.pos[b-94l8upa2uy] { color:var(--rg-success); }
.iv-kv .v.neg[b-94l8upa2uy] { color:var(--rg-danger); }
.iv-card-group[b-94l8upa2uy] { background:var(--rg-bg-subtle); padding:.55rem .8rem; border-radius:8px; font-weight:800; font-size:.74rem; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-primary); margin:.5rem 0 .2rem; }
.iv-card-tot[b-94l8upa2uy] { background:var(--rg-primary); color:#fff; padding:.6rem .9rem; border-radius:8px; font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.85rem; }

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-94l8upa2uy]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-94l8upa2uy] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-94l8upa2uy]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-94l8upa2uy]        { max-width:720px; }
.modal-header[b-94l8upa2uy]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-94l8upa2uy] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-94l8upa2uy]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-94l8upa2uy] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-94l8upa2uy]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-94l8upa2uy]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-94l8upa2uy]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-94l8upa2uy]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-94l8upa2uy] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-94l8upa2uy]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-94l8upa2uy] { color:var(--rg-primary); }
.btn-help[b-94l8upa2uy]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-94l8upa2uy]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Informeycontroles/FrmCtbAuditoriaControlV2.razor.rz.scp.css */
.au-container[b-fclnwrp4wz] { padding: 1.2rem 1.4rem; }

.au-header[b-fclnwrp4wz] { display:flex; align-items:center; gap:.8rem; margin-bottom:1rem; }
.au-header-left[b-fclnwrp4wz] { display:flex; align-items:center; gap:.8rem; }
.au-header-icon[b-fclnwrp4wz] { font-size:1.8rem; color:var(--rg-primary); }
.au-title[b-fclnwrp4wz] { font-size:1.5rem; font-weight:800; color:var(--rg-text-primary); margin:0; }
.au-subtitle[b-fclnwrp4wz] { font-size:.82rem; color:var(--rg-text-secondary); }

.au-tabs[b-fclnwrp4wz] { display:flex; gap:.4rem; flex-wrap:wrap; border-bottom:1px solid var(--rg-border); padding-bottom:.6rem; margin-bottom:1rem; }
.au-tab[b-fclnwrp4wz] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:8px; padding:.5rem .9rem; font-size:.8rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; align-items:center; gap:.4rem; }
.au-tab:hover[b-fclnwrp4wz] { background:var(--rg-bg-hover); }
.au-tab.active[b-fclnwrp4wz] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }

.au-toolbar[b-fclnwrp4wz] { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:10px; padding:.7rem .9rem; margin-bottom:1rem; }
.au-toolbar input[type=text][b-fclnwrp4wz] { flex:1; min-width:240px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:7px; padding:.45rem .7rem; font-size:.84rem; }
.au-btn[b-fclnwrp4wz] { display:inline-flex; align-items:center; gap:.4rem; border-radius:8px; padding:.45rem .9rem; font-size:.82rem; font-weight:600; border:1px solid var(--rg-border); background:var(--rg-bg-card); color:var(--rg-text-primary); cursor:pointer; }
.au-btn-primary[b-fclnwrp4wz] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }

.au-banner[b-fclnwrp4wz] { display:flex; align-items:center; gap:.7rem; padding:1rem 1.2rem; border-radius:12px; margin-bottom:1rem; font-size:.9rem; font-weight:600; }
.au-banner i[b-fclnwrp4wz] { font-size:1.4rem; }
.au-banner.ok[b-fclnwrp4wz] { background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.35); color:#16a34a; }
.au-banner.warn[b-fclnwrp4wz] { background:rgba(217,119,6,.1); border:1px solid rgba(217,119,6,.35); color:#d97706; }
[data-mode="dark"] .au-banner.ok[b-fclnwrp4wz] { color:#86efac; }
[data-mode="dark"] .au-banner.warn[b-fclnwrp4wz] { color:#fcd34d; }

.au-doc[b-fclnwrp4wz] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:14px; padding:1.5rem; margin-bottom:1.2rem; }
.au-doc-head[b-fclnwrp4wz] { border-bottom:2px solid var(--rg-border); padding-bottom:.7rem; margin-bottom:1rem; text-align:center; }
.au-doc-head .ti[b-fclnwrp4wz] { color:var(--rg-primary); font-weight:800; font-size:1.1rem; }
.au-doc-head .pe[b-fclnwrp4wz] { color:var(--rg-text-secondary); font-size:.8rem; margin-top:.15rem; }

.au-table[b-fclnwrp4wz] { width:100%; border-collapse:collapse; font-size:.84rem; }
.au-table th[b-fclnwrp4wz] { text-align:left; color:var(--rg-text-secondary); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; padding:.5rem .6rem; background:var(--rg-bg-subtle); border-bottom:1px solid var(--rg-border); }
.au-table td[b-fclnwrp4wz] { padding:.42rem .6rem; border-bottom:1px solid var(--rg-border); color:var(--rg-text-primary); }
.au-table td.r[b-fclnwrp4wz], .au-table th.r[b-fclnwrp4wz] { text-align:right; font-variant-numeric:tabular-nums; }
.au-code[b-fclnwrp4wz] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.74rem; color:var(--rg-text-muted); }
.au-pos[b-fclnwrp4wz] { color:var(--rg-success); }
.au-neg[b-fclnwrp4wz] { color:var(--rg-danger); }
.au-empty[b-fclnwrp4wz] { text-align:center; color:var(--rg-text-muted); padding:1.5rem; }
.au-badge[b-fclnwrp4wz] { display:inline-block; padding:.15rem .55rem; border-radius:20px; font-size:.7rem; font-weight:700; }
.au-badge.ok[b-fclnwrp4wz] { background:rgba(34,197,94,.15); color:#16a34a; }
[data-mode="dark"] .au-badge.ok[b-fclnwrp4wz] { color:#86efac; }

.au-kpis[b-fclnwrp4wz] { display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem; margin-bottom:1rem; }
.au-kpi[b-fclnwrp4wz] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.85rem; }
.au-kpi .l[b-fclnwrp4wz] { font-size:.66rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.05em; }
.au-kpi .v[b-fclnwrp4wz] { font-size:1.3rem; font-weight:800; margin-top:.25rem; color:var(--rg-text-primary); }

.au-note[b-fclnwrp4wz] { margin-top:.8rem; font-size:.78rem; color:var(--rg-text-muted); }

.au-loading[b-fclnwrp4wz] { display:flex; align-items:center; justify-content:center; gap:.7rem; padding:3rem; color:var(--rg-text-secondary); }
.au-spinner[b-fclnwrp4wz] { width:24px; height:24px; border:3px solid var(--rg-border); border-top-color:var(--rg-primary); border-radius:50%; animation:au-spin-b-fclnwrp4wz .7s linear infinite; }
@keyframes au-spin-b-fclnwrp4wz { to { transform:rotate(360deg); } }

@media (max-width:760px){ .au-kpis[b-fclnwrp4wz] { grid-template-columns:repeat(2,1fr); } }

/* Toggle Grid/Tarjeta + Cards (reutilizable) */
.iv-toggle[b-fclnwrp4wz] { display:inline-flex; border:1px solid var(--rg-border); border-radius:8px; overflow:hidden; }
.iv-tb[b-fclnwrp4wz] { background:var(--rg-bg-card); border:none; padding:.42rem .8rem; font-size:.78rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; gap:.35rem; align-items:center; }
.iv-tb:hover[b-fclnwrp4wz] { background:var(--rg-bg-hover); }
.iv-tb.active[b-fclnwrp4wz] { background:var(--rg-primary); color:#fff; }
.iv-tb + .iv-tb[b-fclnwrp4wz] { border-left:1px solid var(--rg-border); }
.iv-cards[b-fclnwrp4wz] { display:grid; grid-template-columns:1fr; gap:.55rem; }
.iv-card[b-fclnwrp4wz] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.75rem .9rem; }
.iv-card-head[b-fclnwrp4wz] { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; flex-wrap:wrap; font-weight:700; color:var(--rg-text-primary); font-size:.88rem; margin-bottom:.45rem; }
.iv-card-head .code[b-fclnwrp4wz] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.72rem; color:var(--rg-text-muted); font-weight:400; }
.iv-card-grid[b-fclnwrp4wz] { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:.4rem .8rem; font-size:.82rem; }
.iv-kv[b-fclnwrp4wz] { display:flex; flex-direction:column; gap:.05rem; }
.iv-kv .k[b-fclnwrp4wz] { font-size:.65rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.iv-kv .v[b-fclnwrp4wz] { color:var(--rg-text-primary); font-variant-numeric:tabular-nums; }
.iv-kv .v.pos[b-fclnwrp4wz] { color:var(--rg-success); }
.iv-kv .v.neg[b-fclnwrp4wz] { color:var(--rg-danger); }
.iv-card-tot[b-fclnwrp4wz] { background:var(--rg-primary); color:#fff; padding:.6rem .9rem; border-radius:8px; font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.85rem; }

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-fclnwrp4wz]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-fclnwrp4wz] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-fclnwrp4wz]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-fclnwrp4wz]        { max-width:720px; }
.modal-header[b-fclnwrp4wz]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-fclnwrp4wz] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-fclnwrp4wz]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-fclnwrp4wz] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-fclnwrp4wz]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-fclnwrp4wz]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-fclnwrp4wz]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-fclnwrp4wz]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-fclnwrp4wz] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-fclnwrp4wz]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-fclnwrp4wz] { color:var(--rg-primary); }
.btn-help[b-fclnwrp4wz]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-fclnwrp4wz]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Contabilidad/Informeycontroles/FrmCtbFinancieroFormalesEstadosV2.razor.rz.scp.css */
.ic-container[b-u823rgv256] { padding: 1.2rem 1.4rem; }

/* Header */
.ic-header[b-u823rgv256] { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; flex-wrap:wrap; gap:.8rem; }
.ic-header-left[b-u823rgv256] { display:flex; align-items:center; gap:.8rem; }
.ic-header-actions[b-u823rgv256] { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }

/* Toggle Grid/Tarjeta (reutilizable) */
.iv-toggle[b-u823rgv256] { display:inline-flex; border:1px solid var(--rg-border); border-radius:8px; overflow:hidden; }
.iv-tb[b-u823rgv256] { background:var(--rg-bg-card); border:none; padding:.42rem .8rem; font-size:.78rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; gap:.35rem; align-items:center; }
.iv-tb:hover[b-u823rgv256] { background:var(--rg-bg-hover); }
.iv-tb.active[b-u823rgv256] { background:var(--rg-primary); color:#fff; }
.iv-tb + .iv-tb[b-u823rgv256] { border-left:1px solid var(--rg-border); }

/* Vista Tarjeta (reutilizable) */
.iv-cards[b-u823rgv256] { display:grid; grid-template-columns:1fr; gap:.55rem; }
.iv-card[b-u823rgv256] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.75rem .9rem; }
.iv-card-head[b-u823rgv256] { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; flex-wrap:wrap; font-weight:700; color:var(--rg-text-primary); font-size:.88rem; margin-bottom:.45rem; }
.iv-card-head .code[b-u823rgv256] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.72rem; color:var(--rg-text-muted); font-weight:400; }
.iv-card-grid[b-u823rgv256] { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:.4rem .8rem; font-size:.82rem; }
.iv-kv[b-u823rgv256] { display:flex; flex-direction:column; gap:.05rem; }
.iv-kv .k[b-u823rgv256] { font-size:.65rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.iv-kv .v[b-u823rgv256] { color:var(--rg-text-primary); font-variant-numeric:tabular-nums; }
.iv-kv .v.pos[b-u823rgv256] { color:var(--rg-success); }
.iv-kv .v.neg[b-u823rgv256] { color:var(--rg-danger); }
.iv-card-group[b-u823rgv256] { background:var(--rg-bg-subtle); padding:.55rem .8rem; border-radius:8px; font-weight:800; font-size:.74rem; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-primary); margin:.5rem 0 .2rem; }
.iv-card-tot[b-u823rgv256] { background:var(--rg-primary); color:#fff; padding:.6rem .9rem; border-radius:8px; font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.85rem; }
.ic-header-icon[b-u823rgv256] { font-size:1.8rem; color:var(--rg-primary); }
.ic-title[b-u823rgv256] { font-size:1.5rem; font-weight:800; color:var(--rg-text-primary); margin:0; }
.ic-subtitle[b-u823rgv256] { font-size:.82rem; color:var(--rg-text-secondary); }

/* Tabs */
.ic-tabs[b-u823rgv256] { display:flex; gap:.4rem; flex-wrap:wrap; border-bottom:1px solid var(--rg-border); padding-bottom:.6rem; margin-bottom:1rem; }
.ic-tab[b-u823rgv256] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:8px; padding:.5rem .9rem; font-size:.82rem; font-weight:600; color:var(--rg-text-secondary); cursor:pointer; display:inline-flex; align-items:center; gap:.4rem; }
.ic-tab:hover[b-u823rgv256] { background:var(--rg-bg-hover); }
.ic-tab.active[b-u823rgv256] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }

/* Toolbar */
.ic-toolbar[b-u823rgv256] { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:10px; padding:.7rem .9rem; margin-bottom:1rem; }
.ic-toolbar label[b-u823rgv256] { font-size:.76rem; font-weight:700; color:var(--rg-text-secondary); text-transform:uppercase; letter-spacing:.03em; }
.ic-toolbar input[type=date][b-u823rgv256], .ic-toolbar select[b-u823rgv256], .ic-toolbar input[type=text][b-u823rgv256] {
    background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border);
    border-radius:7px; padding:.42rem .6rem; font-size:.84rem;
}
.ic-toolbar input:focus[b-u823rgv256], .ic-toolbar select:focus[b-u823rgv256] { border-color:var(--rg-primary); box-shadow:0 0 0 3px rgba(26,58,92,.15); outline:none; }

/* Lookup cuenta (Libro Mayor) */
.ic-lookup[b-u823rgv256] { position:relative; min-width:280px; }
.ic-lookup input[b-u823rgv256] { width:100%; }
.ic-lookup-list[b-u823rgv256] { position:absolute; z-index:30; top:100%; left:0; right:0; background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:8px; margin-top:3px; max-height:260px; overflow-y:auto; box-shadow:0 8px 24px rgba(0,0,0,.25); }
.ic-lookup-item[b-u823rgv256] { padding:.5rem .7rem; font-size:.82rem; color:var(--rg-text-primary); cursor:pointer; border-bottom:1px solid var(--rg-border); }
.ic-lookup-item:hover[b-u823rgv256] { background:var(--rg-bg-hover); }
.ic-selected[b-u823rgv256] { font-size:.85rem; color:var(--rg-text-secondary); margin-bottom:.8rem; }

/* Buttons */
.ic-btn[b-u823rgv256] { display:inline-flex; align-items:center; gap:.4rem; border-radius:8px; padding:.45rem .9rem; font-size:.82rem; font-weight:600; border:1px solid var(--rg-border); background:var(--rg-bg-card); color:var(--rg-text-primary); cursor:pointer; }
.ic-btn-primary[b-u823rgv256] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }
.ic-btn:disabled[b-u823rgv256] { opacity:.55; cursor:not-allowed; }

/* Documento */
.ic-doc[b-u823rgv256] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:14px; padding:1.5rem; margin-bottom:1.2rem; }
.ic-doc-head[b-u823rgv256] { text-align:center; border-bottom:2px solid var(--rg-border); padding-bottom:.8rem; margin-bottom:1rem; }
.ic-co[b-u823rgv256] { font-weight:800; font-size:1.05rem; color:var(--rg-text-primary); }
.ic-ti[b-u823rgv256] { color:var(--rg-primary); font-weight:800; font-size:1.15rem; margin-top:.2rem; }
.ic-pe[b-u823rgv256] { color:var(--rg-text-secondary); font-size:.8rem; margin-top:.15rem; }

/* Tablas */
.ic-grid-scroll[b-u823rgv256] { max-height:calc(100vh - 360px); overflow:auto; }
.ic-table[b-u823rgv256] { width:100%; border-collapse:collapse; font-size:.84rem; }
.ic-table-fixed[b-u823rgv256] { table-layout:fixed; }
.ic-table th[b-u823rgv256] { position:sticky; top:0; text-align:left; color:var(--rg-text-secondary); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; padding:.5rem .6rem; background:var(--rg-bg-subtle); border-bottom:1px solid var(--rg-border); }
.ic-table td[b-u823rgv256] { padding:.42rem .6rem; border-bottom:1px solid var(--rg-border); color:var(--rg-text-primary); vertical-align:top; overflow-wrap:anywhere; word-break:break-word; }
.ic-table td.r[b-u823rgv256], .ic-table th.r[b-u823rgv256] { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.ic-grp td[b-u823rgv256] { background:var(--rg-bg-subtle); font-weight:800; text-transform:uppercase; font-size:.74rem; letter-spacing:.04em; color:var(--rg-text-primary); }
.ic-sub td[b-u823rgv256] { font-weight:700; background:rgba(37,99,235,.08); }
.ic-tot td[b-u823rgv256] { font-weight:800; background:var(--rg-primary); color:#fff; font-size:.9rem; }
.ic-code[b-u823rgv256] { font-family:'Cascadia Code','Fira Code',monospace; font-size:.74rem; color:var(--rg-text-muted); }
.ic-pos[b-u823rgv256] { color:var(--rg-success); }
.ic-neg[b-u823rgv256] { color:var(--rg-danger); }

/* KPIs */
.ic-kpis[b-u823rgv256] { display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem; margin-bottom:1rem; }
.ic-kpi[b-u823rgv256] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:10px; padding:.85rem; }
.ic-kpi .l[b-u823rgv256] { font-size:.66rem; color:var(--rg-text-muted); text-transform:uppercase; letter-spacing:.05em; }
.ic-kpi .v[b-u823rgv256] { font-size:1.25rem; font-weight:800; margin-top:.25rem; color:var(--rg-text-primary); }

/* Cuadre / checks */
.ic-check-wrap[b-u823rgv256] { text-align:center; margin-top:1rem; }
.ic-chk[b-u823rgv256] { display:inline-flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:700; padding:.35rem .8rem; border-radius:20px; }
.ic-chk.ok[b-u823rgv256] { background:rgba(34,197,94,.15); color:#16a34a; }
.ic-chk.warn[b-u823rgv256] { background:rgba(217,119,6,.15); color:#d97706; }
.ic-chk.sm[b-u823rgv256] { padding:.15rem .5rem; font-size:.72rem; }
[data-mode="dark"] .ic-chk.ok[b-u823rgv256] { color:#86efac; }
[data-mode="dark"] .ic-chk.warn[b-u823rgv256] { color:#fcd34d; }

.ic-warn-bar[b-u823rgv256] { background:rgba(217,119,6,.1); border:1px solid rgba(217,119,6,.3); color:#d97706; padding:.6rem .9rem; border-radius:8px; font-size:.82rem; margin-bottom:1rem; }
[data-mode="dark"] .ic-warn-bar[b-u823rgv256] { color:#fcd34d; }

/* Asiento (Libro Diario) */
.ic-asiento[b-u823rgv256] { border:1px solid var(--rg-border); border-radius:10px; margin-bottom:.9rem; overflow:hidden; }
.ic-asiento-head[b-u823rgv256] { display:flex; align-items:center; justify-content:space-between; background:var(--rg-bg-subtle); padding:.5rem .8rem; font-size:.82rem; font-weight:700; color:var(--rg-text-primary); }

/* Loading */
.ic-loading[b-u823rgv256] { display:flex; align-items:center; justify-content:center; gap:.7rem; padding:3rem; color:var(--rg-text-secondary); }
.ic-spinner[b-u823rgv256] { width:24px; height:24px; border:3px solid var(--rg-border); border-top-color:var(--rg-primary); border-radius:50%; animation:ic-spin-b-u823rgv256 .7s linear infinite; }
@keyframes ic-spin-b-u823rgv256 { to { transform:rotate(360deg); } }

@media (max-width:760px){ .ic-kpis[b-u823rgv256] { grid-template-columns:repeat(2,1fr); } }

/* ── Modal Ayuda ─────────────────────────────────────────────────────── */
.modal-backdrop[b-u823rgv256]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-u823rgv256] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-u823rgv256]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:680px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-lg[b-u823rgv256]        { max-width:720px; }
.modal-header[b-u823rgv256]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-u823rgv256] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary,#1e293b);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-u823rgv256]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted,#94a3b8);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-u823rgv256] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-u823rgv256]      { padding:0;overflow-y:auto;flex:1; }
.modal-footer[b-u823rgv256]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.help-body[b-u823rgv256]       { padding:1.25rem;display:flex;flex-direction:column;gap:1rem; }
.help-section[b-u823rgv256]    { border:1px solid var(--rg-border);border-radius:.5rem;padding:1rem; }
.help-section-title[b-u823rgv256] { font-weight:700;color:var(--rg-text-primary);margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem; }
.help-tip[b-u823rgv256]        { background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.83rem;display:flex;align-items:flex-start;gap:.5rem;margin-top:.5rem; }
.help-icon-header[b-u823rgv256] { color:var(--rg-primary); }
.btn-help[b-u823rgv256]        { background:none;border:1px solid var(--rg-border);border-radius:.375rem;padding:.35rem .6rem;cursor:pointer;color:var(--rg-text-secondary);font-size:1rem; }
.btn-help:hover[b-u823rgv256]  { background:var(--rg-bg-hover);color:var(--rg-primary); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/ApuTreeNode.razor.rz.scp.css */
/* ════════════════════════════════════════════════════════════════════════
   Estilos del nodo recursivo del árbol de asignación.
   Copiados desde Frmasignapantallausuario.razor.css porque el CSS isolation
   de Blazor NO comparte estilos entre componentes (este componente necesita
   sus propias reglas scoped para verse igual que el diseño original).
   ════════════════════════════════════════════════════════════════════════ */

/* ── Fila módulo padre (carpeta) ─────────────────────────────────── */
.apu-modulo-row[b-ozuez2ag13] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: var(--rg-bg-card, #fff);
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: background 0.1s;
    user-select: none;
}
.apu-modulo-row:hover[b-ozuez2ag13] { background: var(--rg-bg-hover, #f8fafc); }

/* Nivel 2 — sub-grupo */
.apu-modulo-row.apu-modulo-row-l2[b-ozuez2ag13] {
    padding-left: 1.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-left: 2px solid rgba(245,158,11,0.3);
}
[data-mode="dark"] .apu-modulo-row.apu-modulo-row-l2[b-ozuez2ag13] { background: rgba(255,255,255,0.03); }

/* Nivel 3+ — sub-sub-grupo */
.apu-modulo-row.apu-modulo-row-l3[b-ozuez2ag13] {
    padding-left: 3.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-left: 2px solid rgba(79,70,229,0.25);
}
[data-mode="dark"] .apu-modulo-row.apu-modulo-row-l3[b-ozuez2ag13] { background: rgba(255,255,255,0.02); }

/* ── Chevron expandir/colapsar (plano, sin caja) ─────────────────── */
.apu-modulo-chevron[b-ozuez2ag13] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.7rem;
    padding: 0.1rem 0.2rem;
    border-radius: 0.2rem;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color 0.12s, background 0.12s;
    line-height: 1;
}
.apu-modulo-chevron:hover[b-ozuez2ag13] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }

/* ── Ícono de carpeta ────────────────────────────────────────────── */
.apu-folder-icon[b-ozuez2ag13] { color: #f59e0b; font-size: 0.9rem; flex-shrink: 0; }
.apu-folder-l2[b-ozuez2ag13] { color: #f59e0b; opacity: 0.75; }
.apu-folder-on[b-ozuez2ag13] { color: #f59e0b !important; filter: brightness(0.85); }
[data-mode="dark"] .apu-folder-on[b-ozuez2ag13] { filter: brightness(1.1); }

/* ── Nombre y contador del módulo ────────────────────────────────── */
.apu-modulo-nombre[b-ozuez2ag13] {
    flex: 1;
    font-size: 0.79rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}
.apu-modulo-count[b-ozuez2ag13] {
    font-size: 0.67rem;
    color: var(--rg-text-muted, #94a3b8);
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}
.apu-count-on[b-ozuez2ag13] {
    color: var(--rg-warning, #d97706);
    font-weight: 700;
}

/* ── Fila pantalla hija ──────────────────────────────────────────── */
.apu-pantalla-row[b-ozuez2ag13] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.75rem 0.35rem 2rem;
    background: var(--rg-bg-card, #fff);
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: background 0.1s;
    cursor: pointer;
}
.apu-pantalla-row:last-child[b-ozuez2ag13] { border-bottom: none; }
.apu-pantalla-row:hover[b-ozuez2ag13] { background: var(--rg-bg-hover, #f8fafc); }
.apu-pantalla-row.apu-pantalla-on[b-ozuez2ag13] { background: rgba(79,70,229,0.04); }
[data-mode="dark"] .apu-pantalla-row.apu-pantalla-on[b-ozuez2ag13] { background: rgba(79,70,229,0.1); }

/* Pantalla bajo sub-grupo nivel 2 */
.apu-pantalla-row.apu-pantalla-row-l2[b-ozuez2ag13] {
    padding-left: 3.25rem;
    border-left: 2px solid rgba(245,158,11,0.2);
}
/* Pantalla bajo sub-sub-grupo nivel 3+ */
.apu-pantalla-row.apu-pantalla-row-l3[b-ozuez2ag13] {
    padding-left: 4.75rem;
    border-left: 2px solid rgba(79,70,229,0.15);
}

.apu-pantalla-icon[b-ozuez2ag13] { color: var(--rg-text-muted, #94a3b8); font-size: 0.8rem; flex-shrink: 0; }
.apu-pantalla-nombre[b-ozuez2ag13] { flex: 1; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.apu-pantalla-id[b-ozuez2ag13] { font-size: 0.67rem; color: var(--rg-text-muted, #94a3b8); }
.font-mono[b-ozuez2ag13] { font-family: 'Cascadia Code', 'Consolas', monospace; }

/* ── Checkbox ────────────────────────────────────────────────────── */
.apu-chk[b-ozuez2ag13] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
    cursor: pointer;
}
.apu-chk-parcial[b-ozuez2ag13] {
    accent-color: var(--rg-warning, #d97706);
    cursor: default;
}
.apu-modulo-row .apu-chk[b-ozuez2ag13] { cursor: default; }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Clsprasignacionperfilusuarios_class1_frmprasignacionperfilesusr.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-dq8wuwcqir] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-dq8wuwcqir 0.3s ease-out; }
@keyframes slideUp-b-dq8wuwcqir { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-dq8wuwcqir] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dq8wuwcqir] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-dq8wuwcqir] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-dq8wuwcqir] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-dq8wuwcqir] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-dq8wuwcqir] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dq8wuwcqir] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dq8wuwcqir] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dq8wuwcqir] { filter: brightness(1.1); }
.btn-outline[b-dq8wuwcqir] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dq8wuwcqir] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dq8wuwcqir] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dq8wuwcqir] { filter: brightness(1.1); }
.btn-icon[b-dq8wuwcqir] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-dq8wuwcqir] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-dq8wuwcqir] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-dq8wuwcqir] { color: #ef4444; }
.btn-delete:hover[b-dq8wuwcqir] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-dq8wuwcqir] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-dq8wuwcqir] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-dq8wuwcqir] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-dq8wuwcqir] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-dq8wuwcqir] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-dq8wuwcqir] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-dq8wuwcqir] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-dq8wuwcqir] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-dq8wuwcqir] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-dq8wuwcqir] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-dq8wuwcqir] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dq8wuwcqir] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-dq8wuwcqir] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-dq8wuwcqir] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-dq8wuwcqir] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-dq8wuwcqir] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-dq8wuwcqir] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-dq8wuwcqir] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-dq8wuwcqir] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-dq8wuwcqir] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-dq8wuwcqir] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-dq8wuwcqir] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-dq8wuwcqir] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-dq8wuwcqir] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-dq8wuwcqir] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-dq8wuwcqir] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-dq8wuwcqir] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-dq8wuwcqir] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-dq8wuwcqir] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-dq8wuwcqir] { display: block; }
.hide-on-cards[b-dq8wuwcqir] { display: none !important; }
.show-on-cards[b-dq8wuwcqir] { display: grid; }
.hide-on-grid[b-dq8wuwcqir] { display: none !important; }

/* Badges */
.badge[b-dq8wuwcqir] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-dq8wuwcqir] { background: #ecfdf5; color: #065f46; }
.badge-no[b-dq8wuwcqir] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-dq8wuwcqir] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-dq8wuwcqir] { text-align: center; }
.text-muted[b-dq8wuwcqir] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-dq8wuwcqir], .crud-empty-state[b-dq8wuwcqir] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-dq8wuwcqir] { font-size: 2rem; }
.crud-spinner[b-dq8wuwcqir] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-dq8wuwcqir 0.6s linear infinite; }
.crud-spinner-sm[b-dq8wuwcqir] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-dq8wuwcqir 0.6s linear infinite; }
@keyframes spin-b-dq8wuwcqir { to { transform: rotate(360deg); } }
.spin[b-dq8wuwcqir] { animation: spin-b-dq8wuwcqir 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-dq8wuwcqir] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-dq8wuwcqir 0.15s ease-out; }
.modal-container[b-dq8wuwcqir] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-dq8wuwcqir] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-dq8wuwcqir 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-dq8wuwcqir] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-dq8wuwcqir] { max-width: 420px; }
@keyframes fadeIn-b-dq8wuwcqir { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-dq8wuwcqir { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-dq8wuwcqir] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-dq8wuwcqir] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-dq8wuwcqir] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-dq8wuwcqir] { color: #dc2626; }
.modal-close[b-dq8wuwcqir] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-dq8wuwcqir] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-dq8wuwcqir] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-dq8wuwcqir] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-dq8wuwcqir] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-dq8wuwcqir] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-dq8wuwcqir] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-dq8wuwcqir] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-dq8wuwcqir] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-dq8wuwcqir] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dq8wuwcqir] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-dq8wuwcqir] { flex: 2; }
.form-group label[b-dq8wuwcqir] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dq8wuwcqir], .form-group select[b-dq8wuwcqir], .form-textarea[b-dq8wuwcqir] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-dq8wuwcqir], .form-group select:focus[b-dq8wuwcqir], .form-textarea:focus[b-dq8wuwcqir] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-dq8wuwcqir] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-dq8wuwcqir] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-dq8wuwcqir] { flex: 1; display: flex; align-items: center; }
.form-check[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-dq8wuwcqir] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-dq8wuwcqir] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-dq8wuwcqir] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-dq8wuwcqir] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-dq8wuwcqir] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-dq8wuwcqir] { font-size: 3rem; }
.photo-placeholder span[b-dq8wuwcqir] { font-size: 0.78rem; }
.photo-actions[b-dq8wuwcqir] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-dq8wuwcqir] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-dq8wuwcqir] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-dq8wuwcqir] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-dq8wuwcqir] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-dq8wuwcqir] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-dq8wuwcqir] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-dq8wuwcqir] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-dq8wuwcqir] { filter: brightness(1.15); transform: scale(1.05); }
[b-dq8wuwcqir] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-dq8wuwcqir] { padding: 0.75rem; }
    .crud-header[b-dq8wuwcqir] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-dq8wuwcqir] { font-size: 1.1rem; }
    .btn-text[b-dq8wuwcqir] { display: none; }
    .form-row[b-dq8wuwcqir] { flex-direction: column; }
    .form-row-4[b-dq8wuwcqir] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-dq8wuwcqir] { width: 98%; max-height: 95vh; }
    .modal-lg[b-dq8wuwcqir] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-dq8wuwcqir] { padding: 0.75rem; }
    .modal-tabs[b-dq8wuwcqir] { overflow-x: auto; }
    .modal-tab[b-dq8wuwcqir] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-dq8wuwcqir] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-dq8wuwcqir] { display: grid !important; }
    .crud-cards-wrapper[b-dq8wuwcqir] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-dq8wuwcqir] { grid-template-columns: 1fr; }
    .card-details[b-dq8wuwcqir] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-dq8wuwcqir] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-dq8wuwcqir] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-dq8wuwcqir] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-dq8wuwcqir] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Clsprmaestraperfiles_class1_frmprmaestraperfiles.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-u1fndiemxh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-u1fndiemxh 0.3s ease-out; }
@keyframes slideUp-b-u1fndiemxh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-u1fndiemxh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-u1fndiemxh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-u1fndiemxh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-u1fndiemxh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-u1fndiemxh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-u1fndiemxh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-u1fndiemxh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-u1fndiemxh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-u1fndiemxh] { filter: brightness(1.1); }
.btn-outline[b-u1fndiemxh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-u1fndiemxh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-u1fndiemxh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-u1fndiemxh] { filter: brightness(1.1); }
.btn-icon[b-u1fndiemxh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-u1fndiemxh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-u1fndiemxh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-u1fndiemxh] { color: #ef4444; }
.btn-delete:hover[b-u1fndiemxh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-u1fndiemxh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-u1fndiemxh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-u1fndiemxh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-u1fndiemxh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-u1fndiemxh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-u1fndiemxh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-u1fndiemxh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-u1fndiemxh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-u1fndiemxh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-u1fndiemxh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-u1fndiemxh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-u1fndiemxh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-u1fndiemxh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-u1fndiemxh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-u1fndiemxh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-u1fndiemxh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-u1fndiemxh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-u1fndiemxh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-u1fndiemxh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-u1fndiemxh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-u1fndiemxh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-u1fndiemxh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-u1fndiemxh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-u1fndiemxh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-u1fndiemxh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-u1fndiemxh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-u1fndiemxh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-u1fndiemxh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-u1fndiemxh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-u1fndiemxh] { display: block; }
.hide-on-cards[b-u1fndiemxh] { display: none !important; }
.show-on-cards[b-u1fndiemxh] { display: grid; }
.hide-on-grid[b-u1fndiemxh] { display: none !important; }

/* Badges */
.badge[b-u1fndiemxh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-u1fndiemxh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-u1fndiemxh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-u1fndiemxh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-u1fndiemxh] { text-align: center; }
.text-muted[b-u1fndiemxh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-u1fndiemxh], .crud-empty-state[b-u1fndiemxh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-u1fndiemxh] { font-size: 2rem; }
.crud-spinner[b-u1fndiemxh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-u1fndiemxh 0.6s linear infinite; }
.crud-spinner-sm[b-u1fndiemxh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-u1fndiemxh 0.6s linear infinite; }
@keyframes spin-b-u1fndiemxh { to { transform: rotate(360deg); } }
.spin[b-u1fndiemxh] { animation: spin-b-u1fndiemxh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-u1fndiemxh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-u1fndiemxh 0.15s ease-out; }
.modal-container[b-u1fndiemxh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-u1fndiemxh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-u1fndiemxh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-u1fndiemxh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-u1fndiemxh] { max-width: 420px; }
@keyframes fadeIn-b-u1fndiemxh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-u1fndiemxh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-u1fndiemxh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-u1fndiemxh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-u1fndiemxh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-u1fndiemxh] { color: #dc2626; }
.modal-close[b-u1fndiemxh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-u1fndiemxh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-u1fndiemxh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-u1fndiemxh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-u1fndiemxh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-u1fndiemxh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-u1fndiemxh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-u1fndiemxh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-u1fndiemxh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-u1fndiemxh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-u1fndiemxh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-u1fndiemxh] { flex: 2; }
.form-group label[b-u1fndiemxh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-u1fndiemxh], .form-group select[b-u1fndiemxh], .form-textarea[b-u1fndiemxh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-u1fndiemxh], .form-group select:focus[b-u1fndiemxh], .form-textarea:focus[b-u1fndiemxh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-u1fndiemxh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-u1fndiemxh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-u1fndiemxh] { flex: 1; display: flex; align-items: center; }
.form-check[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-u1fndiemxh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-u1fndiemxh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-u1fndiemxh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-u1fndiemxh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-u1fndiemxh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-u1fndiemxh] { font-size: 3rem; }
.photo-placeholder span[b-u1fndiemxh] { font-size: 0.78rem; }
.photo-actions[b-u1fndiemxh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-u1fndiemxh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-u1fndiemxh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-u1fndiemxh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-u1fndiemxh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-u1fndiemxh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-u1fndiemxh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-u1fndiemxh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-u1fndiemxh] { filter: brightness(1.15); transform: scale(1.05); }
[b-u1fndiemxh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-u1fndiemxh] { padding: 0.75rem; }
    .crud-header[b-u1fndiemxh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-u1fndiemxh] { font-size: 1.1rem; }
    .btn-text[b-u1fndiemxh] { display: none; }
    .form-row[b-u1fndiemxh] { flex-direction: column; }
    .form-row-4[b-u1fndiemxh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-u1fndiemxh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-u1fndiemxh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-u1fndiemxh] { padding: 0.75rem; }
    .modal-tabs[b-u1fndiemxh] { overflow-x: auto; }
    .modal-tab[b-u1fndiemxh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-u1fndiemxh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-u1fndiemxh] { display: grid !important; }
    .crud-cards-wrapper[b-u1fndiemxh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-u1fndiemxh] { grid-template-columns: 1fr; }
    .card-details[b-u1fndiemxh] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-u1fndiemxh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-u1fndiemxh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-u1fndiemxh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-u1fndiemxh] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmasignapantallausuario.razor.rz.scp.css */
/* ============================================================
   Frmasignapantallausuario — Asignación de Pantallas a Usuarios
   Patrón: estándar CRUD + 3-panel assignment layout
   Tokens: --rg-* (soporte dark/light automático)
   ============================================================ */

/* ── Animación de entrada ─────────────────────────────────────────── */
.crud-container[b-689rt8vph1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-689rt8vph1 0.3s ease-out; }
@keyframes slideUp-b-689rt8vph1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header estándar ─────────────────────────────────────────────── */
.crud-header[b-689rt8vph1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-689rt8vph1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-689rt8vph1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-689rt8vph1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-689rt8vph1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-689rt8vph1] { display: flex; gap: 0.5rem; }

/* ── Botones estándar ────────────────────────────────────────────── */
.btn-crud[b-689rt8vph1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-689rt8vph1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-689rt8vph1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-689rt8vph1] { filter: brightness(1.1); }
.btn-outline[b-689rt8vph1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-689rt8vph1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-689rt8vph1] { padding: 0.3rem 0.6rem; font-size: 0.72rem; }

/* ── Alert flash ──────────────────────────────────────────────────── */
.crud-alert[b-689rt8vph1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-689rt8vph1] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-689rt8vph1]   { background: rgba(239,68,68,0.1);  color: #991b1b;  border: 1px solid rgba(239,68,68,0.25); }
[data-mode="dark"] .crud-alert.success[b-689rt8vph1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-689rt8vph1]   { color: #fca5a5; }
.crud-alert-close[b-689rt8vph1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── Utilidades ──────────────────────────────────────────────────── */
.font-mono[b-689rt8vph1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.72rem; }
.crud-loading[b-689rt8vph1]   { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state[b-689rt8vph1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-689rt8vph1] { font-size: 2rem; }
.crud-spinner[b-689rt8vph1]   { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-689rt8vph1 0.6s linear infinite; }
.crud-spinner-sm[b-689rt8vph1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-689rt8vph1 0.6s linear infinite; }
@keyframes spin-b-689rt8vph1 { to { transform: rotate(360deg); } }

/* ── Toolbar de sucursal ─────────────────────────────────────────── */
.apu-toolbar[b-689rt8vph1] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
}
/* Toolbar colapsado: una sola línea compacta */
.apu-toolbar.apu-toolbar-collapsed[b-689rt8vph1] {
    align-items: center;
    padding: 0.4rem 0.75rem;
    gap: 0.5rem;
}
.apu-toolbar-toggle[b-689rt8vph1] {
    background: none;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    cursor: pointer;
    color: var(--rg-text-secondary, #475569);
    width: 1.75rem; height: 1.75rem;
    display: inline-flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    transition: all 0.12s;
}
.apu-toolbar-toggle:hover[b-689rt8vph1] { background: var(--rg-bg-hover, #f1f5f9); color: var(--rg-accent, #4f46e5); }
.apu-toolbar-summary[b-689rt8vph1] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    display: inline-flex; align-items: center; gap: 0.45rem;
}
.apu-toolbar-summary i[b-689rt8vph1] { color: var(--rg-accent, #4f46e5); }

.apu-toolbar .form-group[b-689rt8vph1] { display: flex; flex-direction: column; gap: 0.2rem; }
.apu-toolbar .form-group label[b-689rt8vph1] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.apu-select[b-689rt8vph1] {
    padding: 0.375rem 0.625rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    min-width: 280px;
    transition: border-color 0.15s;
}
.apu-select:focus[b-689rt8vph1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.apu-loading-inline[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted, #94a3b8);
    padding-bottom: 0.15rem;
}

/* ── Layout 3 paneles ────────────────────────────────────────────── */
.apu-panels[b-689rt8vph1] {
    display: grid;
    grid-template-columns: 250px 1fr;   /* izquierda (Usuario+Plantilla apilados) | Pantallas */
    gap: 0.75rem;
    align-items: start;
    min-height: 0;
}

/* Columna izquierda: Usuario (arriba) + Plantilla (abajo) apilados */
.apu-col-left[b-689rt8vph1] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ── Panel base ──────────────────────────────────────────────────── */
.apu-panel[b-689rt8vph1] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 240px);
}

/* Paneles A y B apilados — cada uno con altura fija que llena su mitad */
.apu-col-left .apu-panel[b-689rt8vph1] {
    height: calc((100vh - 260px) / 2);
    max-height: none;
}

.apu-panel-wide[b-689rt8vph1] {
    /* el panel C se expande en su columna 1fr */
}

/* ── Cabecera de panel ───────────────────────────────────────────── */
.apu-panel-header[b-689rt8vph1] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.75rem 0.875rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
    flex-shrink: 0;
}

.apu-panel-icon[b-689rt8vph1] { font-size: 1.35rem; flex-shrink: 0; margin-top: 1px; }
.apu-icon-a[b-689rt8vph1] { color: var(--rg-accent, #4f46e5); }
.apu-icon-b[b-689rt8vph1] { color: #10b981; }
.apu-icon-c[b-689rt8vph1] { color: var(--rg-primary, #1a3a5c); }

.apu-panel-title[b-689rt8vph1] {
    display: block;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.apu-panel-sub[b-689rt8vph1] {
    display: block;
    font-size: 0.68rem;
    color: var(--rg-text-muted, #94a3b8);
    margin-top: 1px;
}

.apu-badge-optional[b-689rt8vph1] {
    font-size: 0.6rem;
    font-weight: 600;
    padding: 0.1rem 0.4rem;
    border-radius: 1rem;
    background: rgba(16,185,129,0.12);
    color: #065f46;
    border: 1px solid rgba(16,185,129,0.25);
}
[data-mode="dark"] .apu-badge-optional[b-689rt8vph1] { color: #6ee7b7; }

/* ── Lista de usuarios (paneles A y B) ───────────────────────────── */
.apu-user-list[b-689rt8vph1] {
    overflow-y: auto;
    flex: 1;
    padding: 0.375rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.apu-user-row[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.5rem;
    border-radius: 0.375rem;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    text-align: left;
    width: 100%;
    transition: all 0.12s;
    color: var(--rg-text-primary, #1e293b);
}
.apu-user-row:hover[b-689rt8vph1] { background: var(--rg-bg-hover, #f1f5f9); border-color: var(--rg-border, #e2e8f0); }

/* Selección Panel A (accent/azul) */
.apu-user-row.selected-a[b-689rt8vph1] {
    background: rgba(79,70,229,0.08);
    border-color: rgba(79,70,229,0.3);
}
[data-mode="dark"] .apu-user-row.selected-a[b-689rt8vph1] { background: rgba(79,70,229,0.15); }

/* Selección Panel B (verde) */
.apu-user-row.selected-b[b-689rt8vph1] {
    background: rgba(16,185,129,0.08);
    border-color: rgba(16,185,129,0.3);
}
[data-mode="dark"] .apu-user-row.selected-b[b-689rt8vph1] { background: rgba(16,185,129,0.15); }

.apu-user-avatar[b-689rt8vph1] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--rg-bg-subtle, #f1f5f9);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    flex-shrink: 0;
    color: var(--rg-text-muted, #94a3b8);
    transition: all 0.12s;
}
.apu-avatar-a[b-689rt8vph1] { background: rgba(79,70,229,0.15); color: var(--rg-accent, #4f46e5); }
.apu-avatar-b[b-689rt8vph1] { background: rgba(16,185,129,0.15); color: #10b981; }
.apu-avatar-none[b-689rt8vph1] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #94a3b8); }

.apu-user-info[b-689rt8vph1] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.05rem; }
.apu-user-name[b-689rt8vph1] { font-size: 0.78rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.apu-user-id[b-689rt8vph1]   { font-size: 0.67rem; color: var(--rg-text-muted, #94a3b8); }

.apu-check-a[b-689rt8vph1] { color: var(--rg-accent, #4f46e5); font-size: 0.85rem; flex-shrink: 0; }
.apu-check-b[b-689rt8vph1] { color: #10b981; font-size: 0.85rem; flex-shrink: 0; }

.apu-empty-list[b-689rt8vph1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.78rem;
    text-align: center;
}
.apu-empty-list i[b-689rt8vph1] { font-size: 1.5rem; }

/* ── Panel C: lista de opciones ─────────────────────────────────── */
.apu-opciones-list[b-689rt8vph1] {
    overflow-y: auto;
    flex: 1;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* ── Bloque por aplicación ───────────────────────────────────────── */
.apu-app-block[b-689rt8vph1] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: hidden;
}

.apu-app-header[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rg-primary, #1a3a5c);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
[data-mode="dark"] .apu-app-header[b-689rt8vph1] { color: var(--rg-text-secondary, #94a3b8); }
.apu-app-count[b-689rt8vph1] {
    margin-left: auto;
    font-size: 0.67rem;
    font-weight: 500;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: none;
    letter-spacing: 0;
}

/* ── Fila módulo padre ───────────────────────────────────────────── */
.apu-modulo-row[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: var(--rg-bg-card, #fff);
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: background 0.1s;
    user-select: none;
}
.apu-modulo-row:hover[b-689rt8vph1] { background: var(--rg-bg-hover, #f8fafc); }

/* Nivel 2 — sub-grupo: indentación ~1rem adicional */
.apu-modulo-row.apu-modulo-row-l2[b-689rt8vph1] {
    padding-left: 1.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-left: 2px solid rgba(245,158,11,0.3);
}
[data-mode="dark"] .apu-modulo-row.apu-modulo-row-l2[b-689rt8vph1] { background: rgba(255,255,255,0.03); }

/* Nivel 3 — sub-sub-grupo */
.apu-modulo-row.apu-modulo-row-l3[b-689rt8vph1] {
    padding-left: 3.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-left: 2px solid rgba(79,70,229,0.25);
}
[data-mode="dark"] .apu-modulo-row.apu-modulo-row-l3[b-689rt8vph1] { background: rgba(255,255,255,0.02); }

.apu-folder-icon[b-689rt8vph1] { color: #f59e0b; font-size: 0.9rem; flex-shrink: 0; }
/* Ícono de carpeta para nivel 2+ (tono más suave) */
.apu-folder-l2[b-689rt8vph1] { color: #f59e0b; opacity: 0.75; }

.apu-modulo-nombre[b-689rt8vph1] {
    flex: 1;
    font-size: 0.79rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}
.apu-modulo-count[b-689rt8vph1] {
    font-size: 0.67rem;
    color: var(--rg-text-muted, #94a3b8);
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}
/* Contador en naranja cuando hay pantallas activas en el módulo */
.apu-count-on[b-689rt8vph1] {
    color: var(--rg-warning, #d97706);
    font-weight: 700;
}

/* ── Fila pantalla hija ──────────────────────────────────────────── */
.apu-pantalla-row[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.75rem 0.35rem 2rem;   /* indentación izquierda */
    background: var(--rg-bg-card, #fff);
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: background 0.1s;
    cursor: pointer;
}
.apu-pantalla-row:last-child[b-689rt8vph1] { border-bottom: none; }
.apu-pantalla-row:hover[b-689rt8vph1] { background: var(--rg-bg-hover, #f8fafc); }
.apu-pantalla-row.apu-pantalla-on[b-689rt8vph1] { background: rgba(79,70,229,0.04); }
[data-mode="dark"] .apu-pantalla-row.apu-pantalla-on[b-689rt8vph1] { background: rgba(79,70,229,0.1); }

/* Pantalla bajo sub-grupo nivel 2 */
.apu-pantalla-row.apu-pantalla-row-l2[b-689rt8vph1] {
    padding-left: 3.25rem;
    border-left: 2px solid rgba(245,158,11,0.2);
}
/* Pantalla bajo sub-sub-grupo nivel 3 */
.apu-pantalla-row.apu-pantalla-row-l3[b-689rt8vph1] {
    padding-left: 4.75rem;
    border-left: 2px solid rgba(79,70,229,0.15);
}

.apu-pantalla-icon[b-689rt8vph1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.8rem; flex-shrink: 0; }
.apu-pantalla-nombre[b-689rt8vph1] { flex: 1; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.apu-pantalla-id[b-689rt8vph1] { font-size: 0.67rem; color: var(--rg-text-muted, #94a3b8); }

/* ── Checkbox estándar ───────────────────────────────────────────── */
.apu-chk[b-689rt8vph1] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
    cursor: pointer;
}

/* Checkbox padre con estado parcial (algunos hijos on, no todos) */
.apu-chk-parcial[b-689rt8vph1] {
    accent-color: var(--rg-warning, #d97706);
    cursor: default;    /* no clickeable — es solo indicador */
}

/* Cursor not-allowed en el checkbox del padre para dejar claro que es visual */
.apu-modulo-row .apu-chk[b-689rt8vph1] { cursor: default; }

/* ── Tabs de aplicaciones (Panel C) ─────────────────────────────── */
.apu-tabs-bar[b-689rt8vph1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
    padding: 0.5rem 0.5rem 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
    flex-shrink: 0;
}

.apu-tab[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.4rem 0.4rem 0 0;
    background: transparent;
    cursor: pointer;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    transition: all 0.15s;
    margin-bottom: -2px;
    white-space: nowrap;
}
.apu-tab:hover[b-689rt8vph1] {
    background: var(--rg-bg-hover, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.apu-tab-active[b-689rt8vph1] {
    background: var(--rg-bg-card, #fff);
    border-color: var(--rg-border, #e2e8f0);
    border-bottom-color: var(--rg-bg-card, #fff);
    color: var(--rg-accent, #4f46e5);
}
[data-mode="dark"] .apu-tab-active[b-689rt8vph1] {
    background: var(--rg-bg-card, #1e293b);
    border-bottom-color: var(--rg-bg-card, #1e293b);
}

.apu-tab-label[b-689rt8vph1] {
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: 0.68rem;
}

.apu-tab-badge[b-689rt8vph1] {
    display: inline-flex;
    align-items: center;
    padding: 0.05rem 0.35rem;
    border-radius: 0.75rem;
    font-size: 0.6rem;
    font-weight: 700;
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    border: 1px solid var(--rg-border, #e2e8f0);
    font-variant-numeric: tabular-nums;
}
.apu-tab-badge-on[b-689rt8vph1] {
    background: rgba(79,70,229,0.1);
    color: var(--rg-accent, #4f46e5);
    border-color: rgba(79,70,229,0.25);
}
[data-mode="dark"] .apu-tab-badge-on[b-689rt8vph1] { background: rgba(79,70,229,0.2); }

/* Separador vertical entre grupos de botones */
.apu-sep[b-689rt8vph1] {
    width: 1px;
    height: 1.2rem;
    background: var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Búsqueda dentro de paneles A y B ───────────────────────────── */
.apu-panel-search[b-689rt8vph1] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.5rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-card, #fff);
    flex-shrink: 0;
}

.apu-search-icon[b-689rt8vph1] {
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.75rem;
    flex-shrink: 0;
}

.apu-search-input[b-689rt8vph1] {
    flex: 1;
    background: var(--rg-bg-input, #f8fafc);
    color: var(--rg-text-primary, #1e293b);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.35rem;
    padding: 0.3rem 0.5rem;
    font-size: 0.75rem;
    outline: none;
    transition: border-color 0.15s;
    min-width: 0;
}
.apu-search-input[b-689rt8vph1]::placeholder { color: var(--rg-text-muted, #94a3b8); }
.apu-search-input:focus[b-689rt8vph1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.1); }

.apu-search-clear[b-689rt8vph1] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.7rem;
    padding: 0.15rem 0.25rem;
    border-radius: 0.25rem;
    line-height: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}
.apu-search-clear:hover[b-689rt8vph1] { color: var(--rg-danger, #dc2626); background: rgba(220,38,38,0.08); }

/* ── Chevron expand/collapse en módulos ──────────────────────────── */
.apu-modulo-chevron[b-689rt8vph1] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.7rem;
    padding: 0.1rem 0.2rem;
    border-radius: 0.2rem;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    transition: color 0.12s, background 0.12s;
    line-height: 1;
}
.apu-modulo-chevron:hover[b-689rt8vph1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }

/* Chevron en cabecera de aplicación */
.apu-app-chevron[b-689rt8vph1] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    transition: transform 0.15s;
}

/* Carpeta activa (algunos hijos seleccionados) */
.apu-folder-on[b-689rt8vph1] { color: #f59e0b !important; filter: brightness(0.85); }
[data-mode="dark"] .apu-folder-on[b-689rt8vph1] { filter: brightness(1.1); }

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .apu-panels[b-689rt8vph1] {
        grid-template-columns: 220px 1fr;
    }
}

@media (max-width: 860px) {
    .apu-panels[b-689rt8vph1] {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
    }
    .apu-col-left[b-689rt8vph1] { flex-direction: row; }
    .apu-col-left .apu-panel[b-689rt8vph1] { max-height: 300px; }
    .apu-panel-wide[b-689rt8vph1] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 580px) {
    .apu-panels[b-689rt8vph1] { grid-template-columns: 1fr; }
    .apu-col-left[b-689rt8vph1] { flex-direction: column; }
    .apu-panel[b-689rt8vph1] { max-height: 300px; }
    .apu-panel-wide[b-689rt8vph1] { max-height: calc(100vh - 420px); }
    .apu-select[b-689rt8vph1] { min-width: unset; width: 100%; }
    .crud-header[b-689rt8vph1] { flex-direction: column; align-items: flex-start; }
}
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmasignapermisousuario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-b22fcy3mcm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-b22fcy3mcm 0.3s ease-out; }
@keyframes slideUp-b-b22fcy3mcm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-b22fcy3mcm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-b22fcy3mcm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-b22fcy3mcm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-b22fcy3mcm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-b22fcy3mcm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-b22fcy3mcm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-b22fcy3mcm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-b22fcy3mcm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-b22fcy3mcm] { filter: brightness(1.1); }
.btn-outline[b-b22fcy3mcm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-b22fcy3mcm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-b22fcy3mcm] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-b22fcy3mcm] { filter: brightness(1.1); }
.btn-icon[b-b22fcy3mcm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-b22fcy3mcm] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-b22fcy3mcm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-b22fcy3mcm] { color: #ef4444; }
.btn-delete:hover[b-b22fcy3mcm] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-b22fcy3mcm] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-b22fcy3mcm] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-b22fcy3mcm] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-b22fcy3mcm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-b22fcy3mcm] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-b22fcy3mcm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-b22fcy3mcm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-b22fcy3mcm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-b22fcy3mcm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-b22fcy3mcm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-b22fcy3mcm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-b22fcy3mcm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-b22fcy3mcm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-b22fcy3mcm] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-b22fcy3mcm] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-b22fcy3mcm] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-b22fcy3mcm] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-b22fcy3mcm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-b22fcy3mcm] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-b22fcy3mcm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-b22fcy3mcm] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-b22fcy3mcm] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-b22fcy3mcm] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-b22fcy3mcm] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-b22fcy3mcm] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-b22fcy3mcm] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-b22fcy3mcm] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-b22fcy3mcm] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-b22fcy3mcm] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-b22fcy3mcm] { display: block; }
.hide-on-cards[b-b22fcy3mcm] { display: none !important; }
.show-on-cards[b-b22fcy3mcm] { display: grid; }
.hide-on-grid[b-b22fcy3mcm] { display: none !important; }

/* Badges */
.badge[b-b22fcy3mcm] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-b22fcy3mcm] { background: #ecfdf5; color: #065f46; }
.badge-no[b-b22fcy3mcm] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-b22fcy3mcm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-b22fcy3mcm] { text-align: center; }
.text-muted[b-b22fcy3mcm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-b22fcy3mcm], .crud-empty-state[b-b22fcy3mcm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-b22fcy3mcm] { font-size: 2rem; }
.crud-spinner[b-b22fcy3mcm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-b22fcy3mcm 0.6s linear infinite; }
.crud-spinner-sm[b-b22fcy3mcm] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-b22fcy3mcm 0.6s linear infinite; }
@keyframes spin-b-b22fcy3mcm { to { transform: rotate(360deg); } }
.spin[b-b22fcy3mcm] { animation: spin-b-b22fcy3mcm 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-b22fcy3mcm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-b22fcy3mcm 0.15s ease-out; }
.modal-container[b-b22fcy3mcm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-b22fcy3mcm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-b22fcy3mcm 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-b22fcy3mcm] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-b22fcy3mcm] { max-width: 420px; }
@keyframes fadeIn-b-b22fcy3mcm { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-b22fcy3mcm { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-b22fcy3mcm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-b22fcy3mcm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-b22fcy3mcm] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-b22fcy3mcm] { color: #dc2626; }
.modal-close[b-b22fcy3mcm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-b22fcy3mcm] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-b22fcy3mcm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-b22fcy3mcm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-b22fcy3mcm] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-b22fcy3mcm] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-b22fcy3mcm] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-b22fcy3mcm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-b22fcy3mcm] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-b22fcy3mcm] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-b22fcy3mcm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-b22fcy3mcm] { flex: 2; }
.form-group label[b-b22fcy3mcm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-b22fcy3mcm], .form-group select[b-b22fcy3mcm], .form-textarea[b-b22fcy3mcm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-b22fcy3mcm], .form-group select:focus[b-b22fcy3mcm], .form-textarea:focus[b-b22fcy3mcm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-b22fcy3mcm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-b22fcy3mcm] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-b22fcy3mcm] { flex: 1; display: flex; align-items: center; }
.form-check[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-b22fcy3mcm] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-b22fcy3mcm] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-b22fcy3mcm] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-b22fcy3mcm] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-b22fcy3mcm] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-b22fcy3mcm] { font-size: 3rem; }
.photo-placeholder span[b-b22fcy3mcm] { font-size: 0.78rem; }
.photo-actions[b-b22fcy3mcm] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-b22fcy3mcm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-b22fcy3mcm] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-b22fcy3mcm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-b22fcy3mcm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-b22fcy3mcm] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-b22fcy3mcm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-b22fcy3mcm] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-b22fcy3mcm] { filter: brightness(1.15); transform: scale(1.05); }
[b-b22fcy3mcm] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-b22fcy3mcm] { padding: 0.75rem; }
    .crud-header[b-b22fcy3mcm] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-b22fcy3mcm] { font-size: 1.1rem; }
    .btn-text[b-b22fcy3mcm] { display: none; }
    .form-row[b-b22fcy3mcm] { flex-direction: column; }
    .form-row-4[b-b22fcy3mcm] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-b22fcy3mcm] { width: 98%; max-height: 95vh; }
    .modal-lg[b-b22fcy3mcm] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-b22fcy3mcm] { padding: 0.75rem; }
    .modal-tabs[b-b22fcy3mcm] { overflow-x: auto; }
    .modal-tab[b-b22fcy3mcm] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-b22fcy3mcm] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-b22fcy3mcm] { display: grid !important; }
    .crud-cards-wrapper[b-b22fcy3mcm] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-b22fcy3mcm] { grid-template-columns: 1fr; }
    .card-details[b-b22fcy3mcm] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-b22fcy3mcm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-b22fcy3mcm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-b22fcy3mcm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-b22fcy3mcm] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmcrearusuario.razor.rz.scp.css */
/* ============================================================
   Frmcrearusuario — Administración de Usuarios
   Patrón CRUD estándar + estilos password strength + badges
   Tokens: --rg-* (soporte dark/light automático)
   ============================================================ */

.crud-container[b-1x1n3nizu1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1x1n3nizu1 0.3s ease-out; }
@keyframes slideUp-b-1x1n3nizu1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ──────────────────────────────────────────────────────── */
.crud-header[b-1x1n3nizu1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1x1n3nizu1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1x1n3nizu1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1x1n3nizu1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1x1n3nizu1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1x1n3nizu1] { display: flex; gap: 0.5rem; }

/* ── Botones ─────────────────────────────────────────────────────── */
.btn-crud[b-1x1n3nizu1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1x1n3nizu1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1x1n3nizu1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1x1n3nizu1] { filter: brightness(1.1); }
.btn-outline[b-1x1n3nizu1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1x1n3nizu1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1x1n3nizu1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1x1n3nizu1] { filter: brightness(1.1); }
.btn-icon[b-1x1n3nizu1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1x1n3nizu1]   { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1x1n3nizu1]   { background: rgba(79,70,229,0.1); }
.btn-delete[b-1x1n3nizu1] { color: #ef4444; }
.btn-delete:hover[b-1x1n3nizu1] { background: rgba(239,68,68,0.1); }
.btn-unlock[b-1x1n3nizu1] { color: #10b981; }
.btn-unlock:hover[b-1x1n3nizu1] { background: rgba(16,185,129,0.1); }
.btn-toggle[b-1x1n3nizu1] { color: var(--rg-text-secondary, #475569); }
.btn-toggle:hover[b-1x1n3nizu1] { background: var(--rg-bg-hover, #f1f5f9); }

/* ── Alert flash ─────────────────────────────────────────────────── */
.crud-alert[b-1x1n3nizu1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1x1n3nizu1] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.25); }
.crud-alert.error[b-1x1n3nizu1]   { background: rgba(239,68,68,0.1);  color: #991b1b;  border: 1px solid rgba(239,68,68,0.2); }
[data-mode="dark"] .crud-alert.success[b-1x1n3nizu1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-1x1n3nizu1]   { color: #fca5a5; }
.crud-alert-close[b-1x1n3nizu1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── Barra de búsqueda ───────────────────────────────────────────── */
.crud-search-bar[b-1x1n3nizu1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-1x1n3nizu1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 0.9rem; display: flex; padding: 0.1rem; }
.crud-search-bar input[b-1x1n3nizu1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-bar input[b-1x1n3nizu1]::placeholder { color: var(--rg-text-muted, #94a3b8); }
.crud-search-clear[b-1x1n3nizu1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 0.75rem; }
.crud-search-clear:hover[b-1x1n3nizu1] { color: var(--rg-danger, #dc2626); }
.crud-count[b-1x1n3nizu1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* ── Grid ────────────────────────────────────────────────────────── */
.crud-grid-wrapper[b-1x1n3nizu1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1x1n3nizu1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1x1n3nizu1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1x1n3nizu1] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1x1n3nizu1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1x1n3nizu1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1x1n3nizu1] { width: 110px; text-align: center; white-space: nowrap; }
.text-center[b-1x1n3nizu1] { text-align: center; }
.font-mono[b-1x1n3nizu1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* ── Fila bloqueada ──────────────────────────────────────────────── */
.row-bloqueado[b-1x1n3nizu1] { background: rgba(239,68,68,0.04) !important; }
[data-mode="dark"] .row-bloqueado[b-1x1n3nizu1] { background: rgba(239,68,68,0.08) !important; }

/* ── Avatar usuario ─────────────────────────────────────────────── */
.usr-avatar[b-1x1n3nizu1] {
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; transition: all 0.15s;
}
.usr-avatar-on[b-1x1n3nizu1]  { background: rgba(79,70,229,0.12); color: var(--rg-accent, #4f46e5); }
.usr-avatar-off[b-1x1n3nizu1] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #94a3b8); }

/* ── Badges ──────────────────────────────────────────────────────── */
.badge[b-1x1n3nizu1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1x1n3nizu1]    { background: rgba(34,197,94,0.12);  color: #166534; border: 1px solid rgba(34,197,94,0.25); }
.badge-no[b-1x1n3nizu1]     { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); border: 1px solid var(--rg-border, #e2e8f0); }
.badge-locked[b-1x1n3nizu1] { background: rgba(239,68,68,0.1);   color: #991b1b; border: 1px solid rgba(239,68,68,0.2); }
[data-mode="dark"] .badge-yes[b-1x1n3nizu1]    { color: #86efac; }
[data-mode="dark"] .badge-locked[b-1x1n3nizu1] { color: #fca5a5; }

/* ── Estados ─────────────────────────────────────────────────────── */
.crud-loading[b-1x1n3nizu1], .crud-empty-state[b-1x1n3nizu1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1x1n3nizu1] { font-size: 2rem; }
.crud-spinner[b-1x1n3nizu1]    { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1x1n3nizu1 0.6s linear infinite; }
.crud-spinner-sm[b-1x1n3nizu1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1x1n3nizu1 0.6s linear infinite; }
@keyframes spin-b-1x1n3nizu1 { to { transform: rotate(360deg); } }
.spin[b-1x1n3nizu1] { animation: spin-b-1x1n3nizu1 0.8s linear infinite; }

/* ── Modal ───────────────────────────────────────────────────────── */
.modal-backdrop[b-1x1n3nizu1] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1x1n3nizu1 0.15s; }
.modal-container[b-1x1n3nizu1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1x1n3nizu1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1x1n3nizu1 0.18s ease-out; }
.modal-sm[b-1x1n3nizu1] { max-width: 420px; }
.modal-lg[b-1x1n3nizu1] { max-width: 680px; }
@keyframes fadeIn-b-1x1n3nizu1  { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1x1n3nizu1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1x1n3nizu1] { display: flex; justify-content: space-between; align-items: center; padding: 0.875rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; background: var(--rg-bg-subtle, #f8fafc); }
.modal-header h2[b-1x1n3nizu1] { margin: 0; font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.modal-close[b-1x1n3nizu1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1x1n3nizu1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1x1n3nizu1] { padding: 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1x1n3nizu1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ── Formulario ─────────────────────────────────────────────────── */
.form-row[b-1x1n3nizu1] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; }
.form-group[b-1x1n3nizu1] { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; margin-bottom: 0.5rem; }
.form-group label[b-1x1n3nizu1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-control[b-1x1n3nizu1] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
}
.form-control:focus[b-1x1n3nizu1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.12); }
.form-control:disabled[b-1x1n3nizu1] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); cursor: not-allowed; }
.form-control[b-1x1n3nizu1]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.form-check-group[b-1x1n3nizu1] { display: flex; align-items: center; margin-bottom: 0.25rem; }
.check-label[b-1x1n3nizu1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.check-label input[type="checkbox"][b-1x1n3nizu1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); cursor: pointer; }

/* ── Input con prefijo fijo (RGCLOUDS_) ─────────────────────────── */
.input-prefix-group[b-1x1n3nizu1] {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    overflow: hidden;
    background: var(--rg-bg-input, #fff);
    transition: border-color 0.15s;
}
.input-prefix-group:focus-within[b-1x1n3nizu1] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79,70,229,0.12);
}
.input-prefix-badge[b-1x1n3nizu1] {
    display: flex;
    align-items: center;
    padding: 0 0.55rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-right: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-muted, #94a3b8);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
    user-select: none;
}
.input-prefix-group .form-control[b-1x1n3nizu1] {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    flex: 1;
}
.input-prefix-group .form-control:focus[b-1x1n3nizu1] {
    border: none;
    box-shadow: none;
}
.input-prefix-group .form-control:disabled[b-1x1n3nizu1] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-muted, #94a3b8);
}
[data-mode="dark"] .input-prefix-badge[b-1x1n3nizu1] {
    background: rgba(255,255,255,0.04);
    border-right-color: var(--rg-border, #334155);
}

/* ── Campo contraseña con ojo ────────────────────────────────────── */
.pwd-wrapper[b-1x1n3nizu1] {
    position: relative;
    display: flex;
    align-items: center;
}
.pwd-wrapper .form-control[b-1x1n3nizu1] { padding-right: 2.25rem; }
.pwd-toggle[b-1x1n3nizu1] {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.85rem;
    padding: 0.2rem;
    line-height: 1;
    display: flex;
    align-items: center;
}
.pwd-toggle:hover[b-1x1n3nizu1] { color: var(--rg-text-primary, #1e293b); }

/* ── Barra de fortaleza de contraseña ────────────────────────────── */
.pwd-strength-bar[b-1x1n3nizu1] {
    height: 4px;
    border-radius: 2px;
    background: var(--rg-border, #e2e8f0);
    overflow: hidden;
    margin-top: 0.3rem;
}
.pwd-bar[b-1x1n3nizu1] {
    height: 100%;
    border-radius: 2px;
    transition: width 0.3s ease, background 0.3s;
}
.strength-weak   .pwd-bar[b-1x1n3nizu1], .pwd-bar.strength-weak[b-1x1n3nizu1]   { background: #ef4444; }
.strength-medium .pwd-bar[b-1x1n3nizu1], .pwd-bar.strength-medium[b-1x1n3nizu1] { background: #f59e0b; }
.strength-good   .pwd-bar[b-1x1n3nizu1], .pwd-bar.strength-good[b-1x1n3nizu1]   { background: #10b981; }
.strength-great  .pwd-bar[b-1x1n3nizu1], .pwd-bar.strength-great[b-1x1n3nizu1]  { background: #4f46e5; }

.pwd-hint[b-1x1n3nizu1] { font-size: 0.67rem; margin-top: 0.15rem; display: block; }
.pwd-hint.strength-weak[b-1x1n3nizu1]   { color: #ef4444; }
.pwd-hint.strength-medium[b-1x1n3nizu1] { color: #f59e0b; }
.pwd-hint.strength-good[b-1x1n3nizu1]   { color: #10b981; }
.pwd-hint.strength-great[b-1x1n3nizu1]  { color: var(--rg-accent, #4f46e5); }
.pwd-hint.error[b-1x1n3nizu1]           { color: #ef4444; }

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-1x1n3nizu1] { padding: 0.75rem; }
    .crud-header[b-1x1n3nizu1] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-1x1n3nizu1] { display: none; }
    .form-row[b-1x1n3nizu1] { flex-direction: column; gap: 0; }
    .modal-dialog[b-1x1n3nizu1] { width: 98%; }
    .modal-body[b-1x1n3nizu1] { padding: 0.875rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmdisenoreporte.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-wstr66crz9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wstr66crz9 0.3s ease-out; }
@keyframes slideUp-b-wstr66crz9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wstr66crz9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wstr66crz9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wstr66crz9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wstr66crz9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wstr66crz9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wstr66crz9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wstr66crz9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wstr66crz9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wstr66crz9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wstr66crz9] { filter: brightness(1.1); }
.btn-outline[b-wstr66crz9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wstr66crz9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wstr66crz9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wstr66crz9] { filter: brightness(1.1); }
.btn-icon[b-wstr66crz9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wstr66crz9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wstr66crz9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wstr66crz9] { color: #ef4444; }
.btn-delete:hover[b-wstr66crz9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-wstr66crz9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wstr66crz9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wstr66crz9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wstr66crz9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wstr66crz9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wstr66crz9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wstr66crz9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wstr66crz9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-wstr66crz9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wstr66crz9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-wstr66crz9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wstr66crz9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wstr66crz9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wstr66crz9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wstr66crz9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wstr66crz9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wstr66crz9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-wstr66crz9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-wstr66crz9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-wstr66crz9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-wstr66crz9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-wstr66crz9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-wstr66crz9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-wstr66crz9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-wstr66crz9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-wstr66crz9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-wstr66crz9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-wstr66crz9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-wstr66crz9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-wstr66crz9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-wstr66crz9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-wstr66crz9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-wstr66crz9] { display: block; }
.hide-on-cards[b-wstr66crz9] { display: none !important; }
.show-on-cards[b-wstr66crz9] { display: grid; }
.hide-on-grid[b-wstr66crz9] { display: none !important; }

/* Badges */
.badge[b-wstr66crz9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wstr66crz9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wstr66crz9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-wstr66crz9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wstr66crz9] { text-align: center; }
.text-muted[b-wstr66crz9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wstr66crz9], .crud-empty-state[b-wstr66crz9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wstr66crz9] { font-size: 2rem; }
.crud-spinner[b-wstr66crz9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wstr66crz9 0.6s linear infinite; }
.crud-spinner-sm[b-wstr66crz9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wstr66crz9 0.6s linear infinite; }
@keyframes spin-b-wstr66crz9 { to { transform: rotate(360deg); } }
.spin[b-wstr66crz9] { animation: spin-b-wstr66crz9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-wstr66crz9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wstr66crz9 0.15s ease-out; }
.modal-container[b-wstr66crz9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wstr66crz9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wstr66crz9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-wstr66crz9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-wstr66crz9] { max-width: 420px; }
@keyframes fadeIn-b-wstr66crz9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wstr66crz9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wstr66crz9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wstr66crz9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-wstr66crz9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-wstr66crz9] { color: #dc2626; }
.modal-close[b-wstr66crz9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wstr66crz9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wstr66crz9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wstr66crz9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wstr66crz9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-wstr66crz9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wstr66crz9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wstr66crz9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wstr66crz9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wstr66crz9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wstr66crz9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wstr66crz9] { flex: 2; }
.form-group label[b-wstr66crz9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wstr66crz9], .form-group select[b-wstr66crz9], .form-textarea[b-wstr66crz9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wstr66crz9], .form-group select:focus[b-wstr66crz9], .form-textarea:focus[b-wstr66crz9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wstr66crz9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wstr66crz9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wstr66crz9] { flex: 1; display: flex; align-items: center; }
.form-check[b-wstr66crz9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wstr66crz9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-wstr66crz9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-wstr66crz9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-wstr66crz9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-wstr66crz9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-wstr66crz9] { font-size: 3rem; }
.photo-placeholder span[b-wstr66crz9] { font-size: 0.78rem; }
.photo-actions[b-wstr66crz9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-wstr66crz9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-wstr66crz9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-wstr66crz9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-wstr66crz9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-wstr66crz9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-wstr66crz9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-wstr66crz9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-wstr66crz9] { filter: brightness(1.15); transform: scale(1.05); }
[b-wstr66crz9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wstr66crz9] { padding: 0.75rem; }
    .crud-header[b-wstr66crz9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wstr66crz9] { font-size: 1.1rem; }
    .btn-text[b-wstr66crz9] { display: none; }
    .form-row[b-wstr66crz9] { flex-direction: column; }
    .form-row-4[b-wstr66crz9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wstr66crz9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wstr66crz9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-wstr66crz9] { padding: 0.75rem; }
    .modal-tabs[b-wstr66crz9] { overflow-x: auto; }
    .modal-tab[b-wstr66crz9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-wstr66crz9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-wstr66crz9] { display: grid !important; }
    .crud-cards-wrapper[b-wstr66crz9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-wstr66crz9] { grid-template-columns: 1fr; }
    .card-details[b-wstr66crz9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-wstr66crz9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wstr66crz9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wstr66crz9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wstr66crz9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmplantillad.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yoh6u91gxt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yoh6u91gxt 0.3s ease-out; }
@keyframes slideUp-b-yoh6u91gxt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yoh6u91gxt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yoh6u91gxt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yoh6u91gxt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yoh6u91gxt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yoh6u91gxt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yoh6u91gxt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yoh6u91gxt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yoh6u91gxt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yoh6u91gxt] { filter: brightness(1.1); }
.btn-outline[b-yoh6u91gxt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yoh6u91gxt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yoh6u91gxt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yoh6u91gxt] { filter: brightness(1.1); }
.btn-icon[b-yoh6u91gxt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yoh6u91gxt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yoh6u91gxt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yoh6u91gxt] { color: #ef4444; }
.btn-delete:hover[b-yoh6u91gxt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yoh6u91gxt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yoh6u91gxt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yoh6u91gxt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yoh6u91gxt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yoh6u91gxt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yoh6u91gxt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yoh6u91gxt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yoh6u91gxt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yoh6u91gxt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yoh6u91gxt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yoh6u91gxt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yoh6u91gxt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yoh6u91gxt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yoh6u91gxt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yoh6u91gxt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yoh6u91gxt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yoh6u91gxt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yoh6u91gxt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yoh6u91gxt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yoh6u91gxt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yoh6u91gxt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yoh6u91gxt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yoh6u91gxt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yoh6u91gxt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yoh6u91gxt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yoh6u91gxt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yoh6u91gxt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yoh6u91gxt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yoh6u91gxt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yoh6u91gxt] { display: block; }
.hide-on-cards[b-yoh6u91gxt] { display: none !important; }
.show-on-cards[b-yoh6u91gxt] { display: grid; }
.hide-on-grid[b-yoh6u91gxt] { display: none !important; }

/* Badges */
.badge[b-yoh6u91gxt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yoh6u91gxt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yoh6u91gxt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yoh6u91gxt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yoh6u91gxt] { text-align: center; }
.text-muted[b-yoh6u91gxt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yoh6u91gxt], .crud-empty-state[b-yoh6u91gxt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yoh6u91gxt] { font-size: 2rem; }
.crud-spinner[b-yoh6u91gxt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yoh6u91gxt 0.6s linear infinite; }
.crud-spinner-sm[b-yoh6u91gxt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yoh6u91gxt 0.6s linear infinite; }
@keyframes spin-b-yoh6u91gxt { to { transform: rotate(360deg); } }
.spin[b-yoh6u91gxt] { animation: spin-b-yoh6u91gxt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yoh6u91gxt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yoh6u91gxt 0.15s ease-out; }
.modal-container[b-yoh6u91gxt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yoh6u91gxt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yoh6u91gxt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yoh6u91gxt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yoh6u91gxt] { max-width: 420px; }
@keyframes fadeIn-b-yoh6u91gxt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yoh6u91gxt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yoh6u91gxt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yoh6u91gxt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yoh6u91gxt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yoh6u91gxt] { color: #dc2626; }
.modal-close[b-yoh6u91gxt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yoh6u91gxt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yoh6u91gxt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yoh6u91gxt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yoh6u91gxt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yoh6u91gxt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yoh6u91gxt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yoh6u91gxt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yoh6u91gxt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yoh6u91gxt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yoh6u91gxt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yoh6u91gxt] { flex: 2; }
.form-group label[b-yoh6u91gxt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yoh6u91gxt], .form-group select[b-yoh6u91gxt], .form-textarea[b-yoh6u91gxt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yoh6u91gxt], .form-group select:focus[b-yoh6u91gxt], .form-textarea:focus[b-yoh6u91gxt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yoh6u91gxt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yoh6u91gxt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yoh6u91gxt] { flex: 1; display: flex; align-items: center; }
.form-check[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yoh6u91gxt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yoh6u91gxt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yoh6u91gxt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yoh6u91gxt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yoh6u91gxt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yoh6u91gxt] { font-size: 3rem; }
.photo-placeholder span[b-yoh6u91gxt] { font-size: 0.78rem; }
.photo-actions[b-yoh6u91gxt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yoh6u91gxt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yoh6u91gxt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yoh6u91gxt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yoh6u91gxt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yoh6u91gxt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yoh6u91gxt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yoh6u91gxt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yoh6u91gxt] { filter: brightness(1.15); transform: scale(1.05); }
[b-yoh6u91gxt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yoh6u91gxt] { padding: 0.75rem; }
    .crud-header[b-yoh6u91gxt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yoh6u91gxt] { font-size: 1.1rem; }
    .btn-text[b-yoh6u91gxt] { display: none; }
    .form-row[b-yoh6u91gxt] { flex-direction: column; }
    .form-row-4[b-yoh6u91gxt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yoh6u91gxt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yoh6u91gxt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yoh6u91gxt] { padding: 0.75rem; }
    .modal-tabs[b-yoh6u91gxt] { overflow-x: auto; }
    .modal-tab[b-yoh6u91gxt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yoh6u91gxt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yoh6u91gxt] { display: grid !important; }
    .crud-cards-wrapper[b-yoh6u91gxt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yoh6u91gxt] { grid-template-columns: 1fr; }
    .card-details[b-yoh6u91gxt] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yoh6u91gxt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yoh6u91gxt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yoh6u91gxt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yoh6u91gxt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmregistrooficina.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-a0f9dkda97] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-a0f9dkda97 0.3s ease-out; }
@keyframes slideUp-b-a0f9dkda97 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-a0f9dkda97] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-a0f9dkda97] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-a0f9dkda97] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-a0f9dkda97] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-a0f9dkda97] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-a0f9dkda97] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-a0f9dkda97] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-a0f9dkda97] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-a0f9dkda97] { filter: brightness(1.1); }
.btn-outline[b-a0f9dkda97] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-a0f9dkda97] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-a0f9dkda97] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-a0f9dkda97] { filter: brightness(1.1); }
.btn-icon[b-a0f9dkda97] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-a0f9dkda97] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-a0f9dkda97] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-a0f9dkda97] { color: #ef4444; }
.btn-delete:hover[b-a0f9dkda97] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-a0f9dkda97] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-a0f9dkda97] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-a0f9dkda97] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-a0f9dkda97] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-a0f9dkda97] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-a0f9dkda97] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-a0f9dkda97] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-a0f9dkda97] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-a0f9dkda97] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-a0f9dkda97] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-a0f9dkda97] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-a0f9dkda97] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-a0f9dkda97] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-a0f9dkda97] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-a0f9dkda97] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-a0f9dkda97] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-a0f9dkda97] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-a0f9dkda97] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-a0f9dkda97] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-a0f9dkda97] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-a0f9dkda97] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-a0f9dkda97] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-a0f9dkda97] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-a0f9dkda97] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-a0f9dkda97] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-a0f9dkda97] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-a0f9dkda97] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-a0f9dkda97] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-a0f9dkda97] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-a0f9dkda97] { display: block; }
.hide-on-cards[b-a0f9dkda97] { display: none !important; }
.show-on-cards[b-a0f9dkda97] { display: grid; }
.hide-on-grid[b-a0f9dkda97] { display: none !important; }

/* Badges */
.badge[b-a0f9dkda97] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-a0f9dkda97] { background: #ecfdf5; color: #065f46; }
.badge-no[b-a0f9dkda97] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-a0f9dkda97] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-a0f9dkda97] { text-align: center; }
.text-muted[b-a0f9dkda97] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-a0f9dkda97], .crud-empty-state[b-a0f9dkda97] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-a0f9dkda97] { font-size: 2rem; }
.crud-spinner[b-a0f9dkda97] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-a0f9dkda97 0.6s linear infinite; }
.crud-spinner-sm[b-a0f9dkda97] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-a0f9dkda97 0.6s linear infinite; }
@keyframes spin-b-a0f9dkda97 { to { transform: rotate(360deg); } }
.spin[b-a0f9dkda97] { animation: spin-b-a0f9dkda97 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-a0f9dkda97] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-a0f9dkda97 0.15s ease-out; }
.modal-container[b-a0f9dkda97] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-a0f9dkda97] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-a0f9dkda97 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-a0f9dkda97] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-a0f9dkda97] { max-width: 420px; }
@keyframes fadeIn-b-a0f9dkda97 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-a0f9dkda97 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-a0f9dkda97] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-a0f9dkda97] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-a0f9dkda97] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-a0f9dkda97] { color: #dc2626; }
.modal-close[b-a0f9dkda97] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-a0f9dkda97] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-a0f9dkda97] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-a0f9dkda97] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-a0f9dkda97] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-a0f9dkda97] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-a0f9dkda97] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-a0f9dkda97] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-a0f9dkda97] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-a0f9dkda97] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-a0f9dkda97] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-a0f9dkda97] { flex: 2; }
.form-group label[b-a0f9dkda97] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-a0f9dkda97], .form-group select[b-a0f9dkda97], .form-textarea[b-a0f9dkda97] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-a0f9dkda97], .form-group select:focus[b-a0f9dkda97], .form-textarea:focus[b-a0f9dkda97] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-a0f9dkda97] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-a0f9dkda97] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-a0f9dkda97] { flex: 1; display: flex; align-items: center; }
.form-check[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-a0f9dkda97] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-a0f9dkda97] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-a0f9dkda97] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-a0f9dkda97] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-a0f9dkda97] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-a0f9dkda97] { font-size: 3rem; }
.photo-placeholder span[b-a0f9dkda97] { font-size: 0.78rem; }
.photo-actions[b-a0f9dkda97] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-a0f9dkda97] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-a0f9dkda97] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-a0f9dkda97] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-a0f9dkda97] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-a0f9dkda97] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-a0f9dkda97] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-a0f9dkda97] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-a0f9dkda97] { filter: brightness(1.15); transform: scale(1.05); }
[b-a0f9dkda97] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-a0f9dkda97] { padding: 0.75rem; }
    .crud-header[b-a0f9dkda97] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-a0f9dkda97] { font-size: 1.1rem; }
    .btn-text[b-a0f9dkda97] { display: none; }
    .form-row[b-a0f9dkda97] { flex-direction: column; }
    .form-row-4[b-a0f9dkda97] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-a0f9dkda97] { width: 98%; max-height: 95vh; }
    .modal-lg[b-a0f9dkda97] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-a0f9dkda97] { padding: 0.75rem; }
    .modal-tabs[b-a0f9dkda97] { overflow-x: auto; }
    .modal-tab[b-a0f9dkda97] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-a0f9dkda97] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-a0f9dkda97] { display: grid !important; }
    .crud-cards-wrapper[b-a0f9dkda97] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-a0f9dkda97] { grid-template-columns: 1fr; }
    .card-details[b-a0f9dkda97] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-a0f9dkda97] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-a0f9dkda97] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-a0f9dkda97] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-a0f9dkda97] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Frmreportenovedadesweb.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7yh4ugpgwe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7yh4ugpgwe 0.3s ease-out; }
@keyframes slideUp-b-7yh4ugpgwe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7yh4ugpgwe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7yh4ugpgwe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7yh4ugpgwe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7yh4ugpgwe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7yh4ugpgwe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7yh4ugpgwe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7yh4ugpgwe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7yh4ugpgwe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7yh4ugpgwe] { filter: brightness(1.1); }
.btn-outline[b-7yh4ugpgwe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7yh4ugpgwe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7yh4ugpgwe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7yh4ugpgwe] { filter: brightness(1.1); }
.btn-icon[b-7yh4ugpgwe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7yh4ugpgwe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7yh4ugpgwe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7yh4ugpgwe] { color: #ef4444; }
.btn-delete:hover[b-7yh4ugpgwe] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7yh4ugpgwe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7yh4ugpgwe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7yh4ugpgwe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7yh4ugpgwe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7yh4ugpgwe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7yh4ugpgwe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7yh4ugpgwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7yh4ugpgwe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7yh4ugpgwe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7yh4ugpgwe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7yh4ugpgwe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7yh4ugpgwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7yh4ugpgwe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7yh4ugpgwe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7yh4ugpgwe] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7yh4ugpgwe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7yh4ugpgwe] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7yh4ugpgwe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7yh4ugpgwe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7yh4ugpgwe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7yh4ugpgwe] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7yh4ugpgwe] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7yh4ugpgwe] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7yh4ugpgwe] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7yh4ugpgwe] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7yh4ugpgwe] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7yh4ugpgwe] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7yh4ugpgwe] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7yh4ugpgwe] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7yh4ugpgwe] { display: block; }
.hide-on-cards[b-7yh4ugpgwe] { display: none !important; }
.show-on-cards[b-7yh4ugpgwe] { display: grid; }
.hide-on-grid[b-7yh4ugpgwe] { display: none !important; }

/* Badges */
.badge[b-7yh4ugpgwe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7yh4ugpgwe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7yh4ugpgwe] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7yh4ugpgwe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7yh4ugpgwe] { text-align: center; }
.text-muted[b-7yh4ugpgwe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7yh4ugpgwe], .crud-empty-state[b-7yh4ugpgwe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7yh4ugpgwe] { font-size: 2rem; }
.crud-spinner[b-7yh4ugpgwe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7yh4ugpgwe 0.6s linear infinite; }
.crud-spinner-sm[b-7yh4ugpgwe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7yh4ugpgwe 0.6s linear infinite; }
@keyframes spin-b-7yh4ugpgwe { to { transform: rotate(360deg); } }
.spin[b-7yh4ugpgwe] { animation: spin-b-7yh4ugpgwe 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7yh4ugpgwe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7yh4ugpgwe 0.15s ease-out; }
.modal-container[b-7yh4ugpgwe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7yh4ugpgwe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7yh4ugpgwe 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7yh4ugpgwe] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7yh4ugpgwe] { max-width: 420px; }
@keyframes fadeIn-b-7yh4ugpgwe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7yh4ugpgwe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7yh4ugpgwe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7yh4ugpgwe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7yh4ugpgwe] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7yh4ugpgwe] { color: #dc2626; }
.modal-close[b-7yh4ugpgwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7yh4ugpgwe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7yh4ugpgwe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7yh4ugpgwe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7yh4ugpgwe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7yh4ugpgwe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7yh4ugpgwe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7yh4ugpgwe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7yh4ugpgwe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7yh4ugpgwe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7yh4ugpgwe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7yh4ugpgwe] { flex: 2; }
.form-group label[b-7yh4ugpgwe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7yh4ugpgwe], .form-group select[b-7yh4ugpgwe], .form-textarea[b-7yh4ugpgwe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7yh4ugpgwe], .form-group select:focus[b-7yh4ugpgwe], .form-textarea:focus[b-7yh4ugpgwe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7yh4ugpgwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7yh4ugpgwe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7yh4ugpgwe] { flex: 1; display: flex; align-items: center; }
.form-check[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7yh4ugpgwe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7yh4ugpgwe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7yh4ugpgwe] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7yh4ugpgwe] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7yh4ugpgwe] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7yh4ugpgwe] { font-size: 3rem; }
.photo-placeholder span[b-7yh4ugpgwe] { font-size: 0.78rem; }
.photo-actions[b-7yh4ugpgwe] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7yh4ugpgwe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7yh4ugpgwe] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7yh4ugpgwe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7yh4ugpgwe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7yh4ugpgwe] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7yh4ugpgwe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7yh4ugpgwe] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7yh4ugpgwe] { filter: brightness(1.15); transform: scale(1.05); }
[b-7yh4ugpgwe] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7yh4ugpgwe] { padding: 0.75rem; }
    .crud-header[b-7yh4ugpgwe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7yh4ugpgwe] { font-size: 1.1rem; }
    .btn-text[b-7yh4ugpgwe] { display: none; }
    .form-row[b-7yh4ugpgwe] { flex-direction: column; }
    .form-row-4[b-7yh4ugpgwe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7yh4ugpgwe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7yh4ugpgwe] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7yh4ugpgwe] { padding: 0.75rem; }
    .modal-tabs[b-7yh4ugpgwe] { overflow-x: auto; }
    .modal-tab[b-7yh4ugpgwe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7yh4ugpgwe] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7yh4ugpgwe] { display: grid !important; }
    .crud-cards-wrapper[b-7yh4ugpgwe] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7yh4ugpgwe] { grid-template-columns: 1fr; }
    .card-details[b-7yh4ugpgwe] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7yh4ugpgwe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7yh4ugpgwe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7yh4ugpgwe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7yh4ugpgwe] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Controlusuarios/Papelconfig.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-bq2w3bckda] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bq2w3bckda 0.3s ease-out; }
@keyframes slideUp-b-bq2w3bckda { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bq2w3bckda] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bq2w3bckda] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bq2w3bckda] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bq2w3bckda] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bq2w3bckda] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bq2w3bckda] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bq2w3bckda] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bq2w3bckda] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bq2w3bckda] { filter: brightness(1.1); }
.btn-outline[b-bq2w3bckda] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bq2w3bckda] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bq2w3bckda] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bq2w3bckda] { filter: brightness(1.1); }
.btn-icon[b-bq2w3bckda] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bq2w3bckda] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bq2w3bckda] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bq2w3bckda] { color: #ef4444; }
.btn-delete:hover[b-bq2w3bckda] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-bq2w3bckda] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bq2w3bckda] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bq2w3bckda] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bq2w3bckda] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bq2w3bckda] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bq2w3bckda] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-bq2w3bckda] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bq2w3bckda] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-bq2w3bckda] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bq2w3bckda] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bq2w3bckda] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bq2w3bckda] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bq2w3bckda] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bq2w3bckda] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bq2w3bckda] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-bq2w3bckda] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-bq2w3bckda] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-bq2w3bckda] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-bq2w3bckda] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-bq2w3bckda] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-bq2w3bckda] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-bq2w3bckda] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-bq2w3bckda] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-bq2w3bckda] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-bq2w3bckda] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-bq2w3bckda] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-bq2w3bckda] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-bq2w3bckda] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-bq2w3bckda] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-bq2w3bckda] { display: block; }
.hide-on-cards[b-bq2w3bckda] { display: none !important; }
.show-on-cards[b-bq2w3bckda] { display: grid; }
.hide-on-grid[b-bq2w3bckda] { display: none !important; }

/* Badges */
.badge[b-bq2w3bckda] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bq2w3bckda] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bq2w3bckda] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-bq2w3bckda] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bq2w3bckda] { text-align: center; }
.text-muted[b-bq2w3bckda] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bq2w3bckda], .crud-empty-state[b-bq2w3bckda] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bq2w3bckda] { font-size: 2rem; }
.crud-spinner[b-bq2w3bckda] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bq2w3bckda 0.6s linear infinite; }
.crud-spinner-sm[b-bq2w3bckda] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bq2w3bckda 0.6s linear infinite; }
@keyframes spin-b-bq2w3bckda { to { transform: rotate(360deg); } }
.spin[b-bq2w3bckda] { animation: spin-b-bq2w3bckda 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-bq2w3bckda] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bq2w3bckda 0.15s ease-out; }
.modal-container[b-bq2w3bckda] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bq2w3bckda] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bq2w3bckda 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-bq2w3bckda] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-bq2w3bckda] { max-width: 420px; }
@keyframes fadeIn-b-bq2w3bckda { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bq2w3bckda { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bq2w3bckda] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bq2w3bckda] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-bq2w3bckda] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-bq2w3bckda] { color: #dc2626; }
.modal-close[b-bq2w3bckda] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bq2w3bckda] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bq2w3bckda] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bq2w3bckda] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bq2w3bckda] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-bq2w3bckda] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bq2w3bckda] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bq2w3bckda] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bq2w3bckda] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bq2w3bckda] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bq2w3bckda] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bq2w3bckda] { flex: 2; }
.form-group label[b-bq2w3bckda] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bq2w3bckda], .form-group select[b-bq2w3bckda], .form-textarea[b-bq2w3bckda] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bq2w3bckda], .form-group select:focus[b-bq2w3bckda], .form-textarea:focus[b-bq2w3bckda] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bq2w3bckda] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bq2w3bckda] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bq2w3bckda] { flex: 1; display: flex; align-items: center; }
.form-check[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bq2w3bckda] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-bq2w3bckda] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-bq2w3bckda] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-bq2w3bckda] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-bq2w3bckda] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-bq2w3bckda] { font-size: 3rem; }
.photo-placeholder span[b-bq2w3bckda] { font-size: 0.78rem; }
.photo-actions[b-bq2w3bckda] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-bq2w3bckda] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-bq2w3bckda] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-bq2w3bckda] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-bq2w3bckda] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-bq2w3bckda] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-bq2w3bckda] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-bq2w3bckda] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-bq2w3bckda] { filter: brightness(1.15); transform: scale(1.05); }
[b-bq2w3bckda] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bq2w3bckda] { padding: 0.75rem; }
    .crud-header[b-bq2w3bckda] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bq2w3bckda] { font-size: 1.1rem; }
    .btn-text[b-bq2w3bckda] { display: none; }
    .form-row[b-bq2w3bckda] { flex-direction: column; }
    .form-row-4[b-bq2w3bckda] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bq2w3bckda] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bq2w3bckda] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-bq2w3bckda] { padding: 0.75rem; }
    .modal-tabs[b-bq2w3bckda] { overflow-x: auto; }
    .modal-tab[b-bq2w3bckda] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-bq2w3bckda] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-bq2w3bckda] { display: grid !important; }
    .crud-cards-wrapper[b-bq2w3bckda] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-bq2w3bckda] { grid-template-columns: 1fr; }
    .card-details[b-bq2w3bckda] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-bq2w3bckda] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bq2w3bckda] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bq2w3bckda] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bq2w3bckda] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmasegaplicapagopoliza.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-70vhx2xw01] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-70vhx2xw01 0.3s ease-out; }
@keyframes slideUp-b-70vhx2xw01 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-70vhx2xw01] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-70vhx2xw01] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-70vhx2xw01] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-70vhx2xw01] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-70vhx2xw01] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-70vhx2xw01] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-70vhx2xw01] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-70vhx2xw01] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-70vhx2xw01] { filter: brightness(1.1); }
.btn-outline[b-70vhx2xw01] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-70vhx2xw01] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-70vhx2xw01] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-70vhx2xw01] { filter: brightness(1.1); }
.btn-icon[b-70vhx2xw01] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-70vhx2xw01] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-70vhx2xw01] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-70vhx2xw01] { color: #ef4444; }
.btn-delete:hover[b-70vhx2xw01] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-70vhx2xw01] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-70vhx2xw01] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-70vhx2xw01] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-70vhx2xw01] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-70vhx2xw01] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-70vhx2xw01] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-70vhx2xw01] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-70vhx2xw01] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-70vhx2xw01] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-70vhx2xw01] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-70vhx2xw01] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-70vhx2xw01] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-70vhx2xw01] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-70vhx2xw01] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-70vhx2xw01] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-70vhx2xw01] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-70vhx2xw01] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-70vhx2xw01] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-70vhx2xw01] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-70vhx2xw01] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-70vhx2xw01] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-70vhx2xw01] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-70vhx2xw01] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-70vhx2xw01] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-70vhx2xw01] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-70vhx2xw01] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-70vhx2xw01] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-70vhx2xw01] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-70vhx2xw01] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-70vhx2xw01] { display: block; }
.hide-on-cards[b-70vhx2xw01] { display: none !important; }
.show-on-cards[b-70vhx2xw01] { display: grid; }
.hide-on-grid[b-70vhx2xw01] { display: none !important; }

/* Badges */
.badge[b-70vhx2xw01] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-70vhx2xw01] { background: #ecfdf5; color: #065f46; }
.badge-no[b-70vhx2xw01] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-70vhx2xw01] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-70vhx2xw01] { text-align: center; }
.text-muted[b-70vhx2xw01] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-70vhx2xw01], .crud-empty-state[b-70vhx2xw01] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-70vhx2xw01] { font-size: 2rem; }
.crud-spinner[b-70vhx2xw01] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-70vhx2xw01 0.6s linear infinite; }
.crud-spinner-sm[b-70vhx2xw01] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-70vhx2xw01 0.6s linear infinite; }
@keyframes spin-b-70vhx2xw01 { to { transform: rotate(360deg); } }
.spin[b-70vhx2xw01] { animation: spin-b-70vhx2xw01 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-70vhx2xw01] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-70vhx2xw01 0.15s ease-out; }
.modal-container[b-70vhx2xw01] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-70vhx2xw01] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-70vhx2xw01 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-70vhx2xw01] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-70vhx2xw01] { max-width: 420px; }
@keyframes fadeIn-b-70vhx2xw01 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-70vhx2xw01 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-70vhx2xw01] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-70vhx2xw01] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-70vhx2xw01] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-70vhx2xw01] { color: #dc2626; }
.modal-close[b-70vhx2xw01] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-70vhx2xw01] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-70vhx2xw01] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-70vhx2xw01] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-70vhx2xw01] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-70vhx2xw01] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-70vhx2xw01] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-70vhx2xw01] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-70vhx2xw01] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-70vhx2xw01] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-70vhx2xw01] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-70vhx2xw01] { flex: 2; }
.form-group label[b-70vhx2xw01] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-70vhx2xw01], .form-group select[b-70vhx2xw01], .form-textarea[b-70vhx2xw01] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-70vhx2xw01], .form-group select:focus[b-70vhx2xw01], .form-textarea:focus[b-70vhx2xw01] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-70vhx2xw01] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-70vhx2xw01] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-70vhx2xw01] { flex: 1; display: flex; align-items: center; }
.form-check[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-70vhx2xw01] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-70vhx2xw01] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-70vhx2xw01] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-70vhx2xw01] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-70vhx2xw01] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-70vhx2xw01] { font-size: 3rem; }
.photo-placeholder span[b-70vhx2xw01] { font-size: 0.78rem; }
.photo-actions[b-70vhx2xw01] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-70vhx2xw01] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-70vhx2xw01] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-70vhx2xw01] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-70vhx2xw01] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-70vhx2xw01] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-70vhx2xw01] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-70vhx2xw01] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-70vhx2xw01] { filter: brightness(1.15); transform: scale(1.05); }
[b-70vhx2xw01] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-70vhx2xw01] { padding: 0.75rem; }
    .crud-header[b-70vhx2xw01] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-70vhx2xw01] { font-size: 1.1rem; }
    .btn-text[b-70vhx2xw01] { display: none; }
    .form-row[b-70vhx2xw01] { flex-direction: column; }
    .form-row-4[b-70vhx2xw01] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-70vhx2xw01] { width: 98%; max-height: 95vh; }
    .modal-lg[b-70vhx2xw01] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-70vhx2xw01] { padding: 0.75rem; }
    .modal-tabs[b-70vhx2xw01] { overflow-x: auto; }
    .modal-tab[b-70vhx2xw01] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-70vhx2xw01] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-70vhx2xw01] { display: grid !important; }
    .crud-cards-wrapper[b-70vhx2xw01] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-70vhx2xw01] { grid-template-columns: 1fr; }
    .card-details[b-70vhx2xw01] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-70vhx2xw01] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-70vhx2xw01] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-70vhx2xw01] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-70vhx2xw01] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmasegcotizacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-j1ymy5bat9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-j1ymy5bat9 0.3s ease-out; }
@keyframes slideUp-b-j1ymy5bat9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-j1ymy5bat9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-j1ymy5bat9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-j1ymy5bat9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-j1ymy5bat9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-j1ymy5bat9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-j1ymy5bat9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-j1ymy5bat9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-j1ymy5bat9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-j1ymy5bat9] { filter: brightness(1.1); }
.btn-outline[b-j1ymy5bat9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-j1ymy5bat9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-j1ymy5bat9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-j1ymy5bat9] { filter: brightness(1.1); }
.btn-icon[b-j1ymy5bat9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-j1ymy5bat9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-j1ymy5bat9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-j1ymy5bat9] { color: #ef4444; }
.btn-delete:hover[b-j1ymy5bat9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-j1ymy5bat9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-j1ymy5bat9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-j1ymy5bat9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-j1ymy5bat9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-j1ymy5bat9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-j1ymy5bat9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-j1ymy5bat9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-j1ymy5bat9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-j1ymy5bat9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-j1ymy5bat9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-j1ymy5bat9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-j1ymy5bat9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-j1ymy5bat9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-j1ymy5bat9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-j1ymy5bat9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-j1ymy5bat9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-j1ymy5bat9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-j1ymy5bat9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-j1ymy5bat9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-j1ymy5bat9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-j1ymy5bat9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-j1ymy5bat9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-j1ymy5bat9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-j1ymy5bat9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-j1ymy5bat9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-j1ymy5bat9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-j1ymy5bat9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-j1ymy5bat9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-j1ymy5bat9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-j1ymy5bat9] { display: block; }
.hide-on-cards[b-j1ymy5bat9] { display: none !important; }
.show-on-cards[b-j1ymy5bat9] { display: grid; }
.hide-on-grid[b-j1ymy5bat9] { display: none !important; }

/* Badges */
.badge[b-j1ymy5bat9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-j1ymy5bat9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-j1ymy5bat9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-j1ymy5bat9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-j1ymy5bat9] { text-align: center; }
.text-muted[b-j1ymy5bat9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-j1ymy5bat9], .crud-empty-state[b-j1ymy5bat9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-j1ymy5bat9] { font-size: 2rem; }
.crud-spinner[b-j1ymy5bat9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-j1ymy5bat9 0.6s linear infinite; }
.crud-spinner-sm[b-j1ymy5bat9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-j1ymy5bat9 0.6s linear infinite; }
@keyframes spin-b-j1ymy5bat9 { to { transform: rotate(360deg); } }
.spin[b-j1ymy5bat9] { animation: spin-b-j1ymy5bat9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-j1ymy5bat9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-j1ymy5bat9 0.15s ease-out; }
.modal-container[b-j1ymy5bat9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-j1ymy5bat9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-j1ymy5bat9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-j1ymy5bat9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-j1ymy5bat9] { max-width: 420px; }
@keyframes fadeIn-b-j1ymy5bat9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-j1ymy5bat9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-j1ymy5bat9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-j1ymy5bat9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-j1ymy5bat9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-j1ymy5bat9] { color: #dc2626; }
.modal-close[b-j1ymy5bat9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-j1ymy5bat9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-j1ymy5bat9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-j1ymy5bat9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-j1ymy5bat9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-j1ymy5bat9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-j1ymy5bat9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-j1ymy5bat9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-j1ymy5bat9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-j1ymy5bat9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-j1ymy5bat9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-j1ymy5bat9] { flex: 2; }
.form-group label[b-j1ymy5bat9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-j1ymy5bat9], .form-group select[b-j1ymy5bat9], .form-textarea[b-j1ymy5bat9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-j1ymy5bat9], .form-group select:focus[b-j1ymy5bat9], .form-textarea:focus[b-j1ymy5bat9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-j1ymy5bat9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-j1ymy5bat9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-j1ymy5bat9] { flex: 1; display: flex; align-items: center; }
.form-check[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-j1ymy5bat9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-j1ymy5bat9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-j1ymy5bat9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-j1ymy5bat9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-j1ymy5bat9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-j1ymy5bat9] { font-size: 3rem; }
.photo-placeholder span[b-j1ymy5bat9] { font-size: 0.78rem; }
.photo-actions[b-j1ymy5bat9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-j1ymy5bat9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-j1ymy5bat9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-j1ymy5bat9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-j1ymy5bat9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-j1ymy5bat9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-j1ymy5bat9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-j1ymy5bat9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-j1ymy5bat9] { filter: brightness(1.15); transform: scale(1.05); }
[b-j1ymy5bat9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-j1ymy5bat9] { padding: 0.75rem; }
    .crud-header[b-j1ymy5bat9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-j1ymy5bat9] { font-size: 1.1rem; }
    .btn-text[b-j1ymy5bat9] { display: none; }
    .form-row[b-j1ymy5bat9] { flex-direction: column; }
    .form-row-4[b-j1ymy5bat9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-j1ymy5bat9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-j1ymy5bat9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-j1ymy5bat9] { padding: 0.75rem; }
    .modal-tabs[b-j1ymy5bat9] { overflow-x: auto; }
    .modal-tab[b-j1ymy5bat9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-j1ymy5bat9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-j1ymy5bat9] { display: grid !important; }
    .crud-cards-wrapper[b-j1ymy5bat9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-j1ymy5bat9] { grid-template-columns: 1fr; }
    .card-details[b-j1ymy5bat9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-j1ymy5bat9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-j1ymy5bat9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-j1ymy5bat9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-j1ymy5bat9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmasegregistragarantia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2b4h28yprk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2b4h28yprk 0.3s ease-out; }
@keyframes slideUp-b-2b4h28yprk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2b4h28yprk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2b4h28yprk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2b4h28yprk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2b4h28yprk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2b4h28yprk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2b4h28yprk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2b4h28yprk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2b4h28yprk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2b4h28yprk] { filter: brightness(1.1); }
.btn-outline[b-2b4h28yprk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2b4h28yprk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2b4h28yprk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2b4h28yprk] { filter: brightness(1.1); }
.btn-icon[b-2b4h28yprk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2b4h28yprk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2b4h28yprk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2b4h28yprk] { color: #ef4444; }
.btn-delete:hover[b-2b4h28yprk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2b4h28yprk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2b4h28yprk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2b4h28yprk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2b4h28yprk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2b4h28yprk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2b4h28yprk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2b4h28yprk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2b4h28yprk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2b4h28yprk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2b4h28yprk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2b4h28yprk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2b4h28yprk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2b4h28yprk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2b4h28yprk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2b4h28yprk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2b4h28yprk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2b4h28yprk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2b4h28yprk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2b4h28yprk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2b4h28yprk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2b4h28yprk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2b4h28yprk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2b4h28yprk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2b4h28yprk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2b4h28yprk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2b4h28yprk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2b4h28yprk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2b4h28yprk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2b4h28yprk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2b4h28yprk] { display: block; }
.hide-on-cards[b-2b4h28yprk] { display: none !important; }
.show-on-cards[b-2b4h28yprk] { display: grid; }
.hide-on-grid[b-2b4h28yprk] { display: none !important; }

/* Badges */
.badge[b-2b4h28yprk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2b4h28yprk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2b4h28yprk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2b4h28yprk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2b4h28yprk] { text-align: center; }
.text-muted[b-2b4h28yprk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2b4h28yprk], .crud-empty-state[b-2b4h28yprk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2b4h28yprk] { font-size: 2rem; }
.crud-spinner[b-2b4h28yprk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2b4h28yprk 0.6s linear infinite; }
.crud-spinner-sm[b-2b4h28yprk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2b4h28yprk 0.6s linear infinite; }
@keyframes spin-b-2b4h28yprk { to { transform: rotate(360deg); } }
.spin[b-2b4h28yprk] { animation: spin-b-2b4h28yprk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2b4h28yprk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2b4h28yprk 0.15s ease-out; }
.modal-container[b-2b4h28yprk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2b4h28yprk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2b4h28yprk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2b4h28yprk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2b4h28yprk] { max-width: 420px; }
@keyframes fadeIn-b-2b4h28yprk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2b4h28yprk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2b4h28yprk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2b4h28yprk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2b4h28yprk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2b4h28yprk] { color: #dc2626; }
.modal-close[b-2b4h28yprk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2b4h28yprk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2b4h28yprk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2b4h28yprk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2b4h28yprk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2b4h28yprk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2b4h28yprk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2b4h28yprk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2b4h28yprk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2b4h28yprk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2b4h28yprk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2b4h28yprk] { flex: 2; }
.form-group label[b-2b4h28yprk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2b4h28yprk], .form-group select[b-2b4h28yprk], .form-textarea[b-2b4h28yprk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2b4h28yprk], .form-group select:focus[b-2b4h28yprk], .form-textarea:focus[b-2b4h28yprk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2b4h28yprk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2b4h28yprk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2b4h28yprk] { flex: 1; display: flex; align-items: center; }
.form-check[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2b4h28yprk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2b4h28yprk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2b4h28yprk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2b4h28yprk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2b4h28yprk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2b4h28yprk] { font-size: 3rem; }
.photo-placeholder span[b-2b4h28yprk] { font-size: 0.78rem; }
.photo-actions[b-2b4h28yprk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2b4h28yprk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2b4h28yprk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2b4h28yprk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2b4h28yprk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2b4h28yprk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2b4h28yprk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2b4h28yprk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2b4h28yprk] { filter: brightness(1.15); transform: scale(1.05); }
[b-2b4h28yprk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2b4h28yprk] { padding: 0.75rem; }
    .crud-header[b-2b4h28yprk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2b4h28yprk] { font-size: 1.1rem; }
    .btn-text[b-2b4h28yprk] { display: none; }
    .form-row[b-2b4h28yprk] { flex-direction: column; }
    .form-row-4[b-2b4h28yprk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2b4h28yprk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2b4h28yprk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2b4h28yprk] { padding: 0.75rem; }
    .modal-tabs[b-2b4h28yprk] { overflow-x: auto; }
    .modal-tab[b-2b4h28yprk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2b4h28yprk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2b4h28yprk] { display: grid !important; }
    .crud-cards-wrapper[b-2b4h28yprk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2b4h28yprk] { grid-template-columns: 1fr; }
    .card-details[b-2b4h28yprk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2b4h28yprk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2b4h28yprk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2b4h28yprk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2b4h28yprk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmasegtipoinmuebles.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-i25j9sq80y] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-i25j9sq80y 0.3s ease-out; }
@keyframes slideUp-b-i25j9sq80y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-i25j9sq80y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-i25j9sq80y] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-i25j9sq80y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-i25j9sq80y] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-i25j9sq80y] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-i25j9sq80y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-i25j9sq80y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-i25j9sq80y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-i25j9sq80y] { filter: brightness(1.1); }
.btn-outline[b-i25j9sq80y] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-i25j9sq80y] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-i25j9sq80y] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-i25j9sq80y] { filter: brightness(1.1); }
.btn-icon[b-i25j9sq80y] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-i25j9sq80y] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-i25j9sq80y] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-i25j9sq80y] { color: #ef4444; }
.btn-delete:hover[b-i25j9sq80y] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-i25j9sq80y] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-i25j9sq80y] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-i25j9sq80y] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-i25j9sq80y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-i25j9sq80y] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-i25j9sq80y] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-i25j9sq80y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-i25j9sq80y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-i25j9sq80y] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-i25j9sq80y] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-i25j9sq80y] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-i25j9sq80y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-i25j9sq80y] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-i25j9sq80y] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-i25j9sq80y] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-i25j9sq80y] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-i25j9sq80y] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-i25j9sq80y] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-i25j9sq80y] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-i25j9sq80y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-i25j9sq80y] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-i25j9sq80y] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-i25j9sq80y] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-i25j9sq80y] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-i25j9sq80y] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-i25j9sq80y] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-i25j9sq80y] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-i25j9sq80y] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-i25j9sq80y] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-i25j9sq80y] { display: block; }
.hide-on-cards[b-i25j9sq80y] { display: none !important; }
.show-on-cards[b-i25j9sq80y] { display: grid; }
.hide-on-grid[b-i25j9sq80y] { display: none !important; }

/* Badges */
.badge[b-i25j9sq80y] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-i25j9sq80y] { background: #ecfdf5; color: #065f46; }
.badge-no[b-i25j9sq80y] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-i25j9sq80y] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-i25j9sq80y] { text-align: center; }
.text-muted[b-i25j9sq80y] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-i25j9sq80y], .crud-empty-state[b-i25j9sq80y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-i25j9sq80y] { font-size: 2rem; }
.crud-spinner[b-i25j9sq80y] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-i25j9sq80y 0.6s linear infinite; }
.crud-spinner-sm[b-i25j9sq80y] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-i25j9sq80y 0.6s linear infinite; }
@keyframes spin-b-i25j9sq80y { to { transform: rotate(360deg); } }
.spin[b-i25j9sq80y] { animation: spin-b-i25j9sq80y 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-i25j9sq80y] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-i25j9sq80y 0.15s ease-out; }
.modal-container[b-i25j9sq80y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-i25j9sq80y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-i25j9sq80y 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-i25j9sq80y] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-i25j9sq80y] { max-width: 420px; }
@keyframes fadeIn-b-i25j9sq80y { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-i25j9sq80y { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-i25j9sq80y] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-i25j9sq80y] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-i25j9sq80y] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-i25j9sq80y] { color: #dc2626; }
.modal-close[b-i25j9sq80y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-i25j9sq80y] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-i25j9sq80y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-i25j9sq80y] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-i25j9sq80y] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-i25j9sq80y] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-i25j9sq80y] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-i25j9sq80y] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-i25j9sq80y] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-i25j9sq80y] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-i25j9sq80y] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-i25j9sq80y] { flex: 2; }
.form-group label[b-i25j9sq80y] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-i25j9sq80y], .form-group select[b-i25j9sq80y], .form-textarea[b-i25j9sq80y] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-i25j9sq80y], .form-group select:focus[b-i25j9sq80y], .form-textarea:focus[b-i25j9sq80y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-i25j9sq80y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-i25j9sq80y] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-i25j9sq80y] { flex: 1; display: flex; align-items: center; }
.form-check[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-i25j9sq80y] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-i25j9sq80y] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-i25j9sq80y] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-i25j9sq80y] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-i25j9sq80y] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-i25j9sq80y] { font-size: 3rem; }
.photo-placeholder span[b-i25j9sq80y] { font-size: 0.78rem; }
.photo-actions[b-i25j9sq80y] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-i25j9sq80y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-i25j9sq80y] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-i25j9sq80y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-i25j9sq80y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-i25j9sq80y] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-i25j9sq80y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-i25j9sq80y] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-i25j9sq80y] { filter: brightness(1.15); transform: scale(1.05); }
[b-i25j9sq80y] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-i25j9sq80y] { padding: 0.75rem; }
    .crud-header[b-i25j9sq80y] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-i25j9sq80y] { font-size: 1.1rem; }
    .btn-text[b-i25j9sq80y] { display: none; }
    .form-row[b-i25j9sq80y] { flex-direction: column; }
    .form-row-4[b-i25j9sq80y] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-i25j9sq80y] { width: 98%; max-height: 95vh; }
    .modal-lg[b-i25j9sq80y] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-i25j9sq80y] { padding: 0.75rem; }
    .modal-tabs[b-i25j9sq80y] { overflow-x: auto; }
    .modal-tab[b-i25j9sq80y] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-i25j9sq80y] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-i25j9sq80y] { display: grid !important; }
    .crud-cards-wrapper[b-i25j9sq80y] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-i25j9sq80y] { grid-template-columns: 1fr; }
    .card-details[b-i25j9sq80y] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-i25j9sq80y] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-i25j9sq80y] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-i25j9sq80y] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-i25j9sq80y] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_asigna_porcientocomisionapagarporseguro.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7aybhrtlma] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7aybhrtlma 0.3s ease-out; }
@keyframes slideUp-b-7aybhrtlma { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7aybhrtlma] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7aybhrtlma] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7aybhrtlma] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7aybhrtlma] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7aybhrtlma] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7aybhrtlma] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7aybhrtlma] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7aybhrtlma] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7aybhrtlma] { filter: brightness(1.1); }
.btn-outline[b-7aybhrtlma] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7aybhrtlma] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7aybhrtlma] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7aybhrtlma] { filter: brightness(1.1); }
.btn-icon[b-7aybhrtlma] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7aybhrtlma] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7aybhrtlma] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7aybhrtlma] { color: #ef4444; }
.btn-delete:hover[b-7aybhrtlma] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7aybhrtlma] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7aybhrtlma] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7aybhrtlma] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7aybhrtlma] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7aybhrtlma] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7aybhrtlma] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7aybhrtlma] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7aybhrtlma] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7aybhrtlma] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7aybhrtlma] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7aybhrtlma] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7aybhrtlma] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7aybhrtlma] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7aybhrtlma] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7aybhrtlma] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7aybhrtlma] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7aybhrtlma] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7aybhrtlma] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7aybhrtlma] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7aybhrtlma] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7aybhrtlma] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7aybhrtlma] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7aybhrtlma] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7aybhrtlma] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7aybhrtlma] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7aybhrtlma] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7aybhrtlma] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7aybhrtlma] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7aybhrtlma] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7aybhrtlma] { display: block; }
.hide-on-cards[b-7aybhrtlma] { display: none !important; }
.show-on-cards[b-7aybhrtlma] { display: grid; }
.hide-on-grid[b-7aybhrtlma] { display: none !important; }

/* Badges */
.badge[b-7aybhrtlma] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7aybhrtlma] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7aybhrtlma] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7aybhrtlma] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7aybhrtlma] { text-align: center; }
.text-muted[b-7aybhrtlma] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7aybhrtlma], .crud-empty-state[b-7aybhrtlma] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7aybhrtlma] { font-size: 2rem; }
.crud-spinner[b-7aybhrtlma] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7aybhrtlma 0.6s linear infinite; }
.crud-spinner-sm[b-7aybhrtlma] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7aybhrtlma 0.6s linear infinite; }
@keyframes spin-b-7aybhrtlma { to { transform: rotate(360deg); } }
.spin[b-7aybhrtlma] { animation: spin-b-7aybhrtlma 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7aybhrtlma] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7aybhrtlma 0.15s ease-out; }
.modal-container[b-7aybhrtlma] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7aybhrtlma] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7aybhrtlma 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7aybhrtlma] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7aybhrtlma] { max-width: 420px; }
@keyframes fadeIn-b-7aybhrtlma { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7aybhrtlma { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7aybhrtlma] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7aybhrtlma] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7aybhrtlma] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7aybhrtlma] { color: #dc2626; }
.modal-close[b-7aybhrtlma] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7aybhrtlma] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7aybhrtlma] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7aybhrtlma] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7aybhrtlma] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7aybhrtlma] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7aybhrtlma] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7aybhrtlma] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7aybhrtlma] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7aybhrtlma] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7aybhrtlma] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7aybhrtlma] { flex: 2; }
.form-group label[b-7aybhrtlma] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7aybhrtlma], .form-group select[b-7aybhrtlma], .form-textarea[b-7aybhrtlma] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7aybhrtlma], .form-group select:focus[b-7aybhrtlma], .form-textarea:focus[b-7aybhrtlma] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7aybhrtlma] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7aybhrtlma] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7aybhrtlma] { flex: 1; display: flex; align-items: center; }
.form-check[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7aybhrtlma] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7aybhrtlma] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7aybhrtlma] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7aybhrtlma] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7aybhrtlma] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7aybhrtlma] { font-size: 3rem; }
.photo-placeholder span[b-7aybhrtlma] { font-size: 0.78rem; }
.photo-actions[b-7aybhrtlma] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7aybhrtlma] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7aybhrtlma] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7aybhrtlma] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7aybhrtlma] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7aybhrtlma] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7aybhrtlma] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7aybhrtlma] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7aybhrtlma] { filter: brightness(1.15); transform: scale(1.05); }
[b-7aybhrtlma] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7aybhrtlma] { padding: 0.75rem; }
    .crud-header[b-7aybhrtlma] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7aybhrtlma] { font-size: 1.1rem; }
    .btn-text[b-7aybhrtlma] { display: none; }
    .form-row[b-7aybhrtlma] { flex-direction: column; }
    .form-row-4[b-7aybhrtlma] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7aybhrtlma] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7aybhrtlma] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7aybhrtlma] { padding: 0.75rem; }
    .modal-tabs[b-7aybhrtlma] { overflow-x: auto; }
    .modal-tab[b-7aybhrtlma] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7aybhrtlma] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7aybhrtlma] { display: grid !important; }
    .crud-cards-wrapper[b-7aybhrtlma] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7aybhrtlma] { grid-template-columns: 1fr; }
    .card-details[b-7aybhrtlma] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7aybhrtlma] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7aybhrtlma] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7aybhrtlma] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7aybhrtlma] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_cobros_para_aseguradora.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fptcutv1vf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fptcutv1vf 0.3s ease-out; }
@keyframes slideUp-b-fptcutv1vf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fptcutv1vf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fptcutv1vf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fptcutv1vf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fptcutv1vf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fptcutv1vf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fptcutv1vf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fptcutv1vf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fptcutv1vf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fptcutv1vf] { filter: brightness(1.1); }
.btn-outline[b-fptcutv1vf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fptcutv1vf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fptcutv1vf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fptcutv1vf] { filter: brightness(1.1); }
.btn-icon[b-fptcutv1vf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fptcutv1vf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fptcutv1vf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fptcutv1vf] { color: #ef4444; }
.btn-delete:hover[b-fptcutv1vf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fptcutv1vf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fptcutv1vf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fptcutv1vf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fptcutv1vf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fptcutv1vf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fptcutv1vf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fptcutv1vf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fptcutv1vf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fptcutv1vf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fptcutv1vf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fptcutv1vf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fptcutv1vf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fptcutv1vf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fptcutv1vf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fptcutv1vf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fptcutv1vf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fptcutv1vf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fptcutv1vf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fptcutv1vf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fptcutv1vf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fptcutv1vf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fptcutv1vf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fptcutv1vf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fptcutv1vf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fptcutv1vf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fptcutv1vf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fptcutv1vf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fptcutv1vf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fptcutv1vf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fptcutv1vf] { display: block; }
.hide-on-cards[b-fptcutv1vf] { display: none !important; }
.show-on-cards[b-fptcutv1vf] { display: grid; }
.hide-on-grid[b-fptcutv1vf] { display: none !important; }

/* Badges */
.badge[b-fptcutv1vf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fptcutv1vf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fptcutv1vf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fptcutv1vf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fptcutv1vf] { text-align: center; }
.text-muted[b-fptcutv1vf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fptcutv1vf], .crud-empty-state[b-fptcutv1vf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fptcutv1vf] { font-size: 2rem; }
.crud-spinner[b-fptcutv1vf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fptcutv1vf 0.6s linear infinite; }
.crud-spinner-sm[b-fptcutv1vf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fptcutv1vf 0.6s linear infinite; }
@keyframes spin-b-fptcutv1vf { to { transform: rotate(360deg); } }
.spin[b-fptcutv1vf] { animation: spin-b-fptcutv1vf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fptcutv1vf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fptcutv1vf 0.15s ease-out; }
.modal-container[b-fptcutv1vf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fptcutv1vf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fptcutv1vf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fptcutv1vf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fptcutv1vf] { max-width: 420px; }
@keyframes fadeIn-b-fptcutv1vf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fptcutv1vf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fptcutv1vf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fptcutv1vf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fptcutv1vf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fptcutv1vf] { color: #dc2626; }
.modal-close[b-fptcutv1vf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fptcutv1vf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fptcutv1vf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fptcutv1vf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fptcutv1vf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fptcutv1vf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fptcutv1vf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fptcutv1vf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fptcutv1vf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fptcutv1vf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fptcutv1vf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fptcutv1vf] { flex: 2; }
.form-group label[b-fptcutv1vf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fptcutv1vf], .form-group select[b-fptcutv1vf], .form-textarea[b-fptcutv1vf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fptcutv1vf], .form-group select:focus[b-fptcutv1vf], .form-textarea:focus[b-fptcutv1vf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fptcutv1vf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fptcutv1vf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fptcutv1vf] { flex: 1; display: flex; align-items: center; }
.form-check[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fptcutv1vf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fptcutv1vf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fptcutv1vf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fptcutv1vf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fptcutv1vf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fptcutv1vf] { font-size: 3rem; }
.photo-placeholder span[b-fptcutv1vf] { font-size: 0.78rem; }
.photo-actions[b-fptcutv1vf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fptcutv1vf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fptcutv1vf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fptcutv1vf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fptcutv1vf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fptcutv1vf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fptcutv1vf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fptcutv1vf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fptcutv1vf] { filter: brightness(1.15); transform: scale(1.05); }
[b-fptcutv1vf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fptcutv1vf] { padding: 0.75rem; }
    .crud-header[b-fptcutv1vf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fptcutv1vf] { font-size: 1.1rem; }
    .btn-text[b-fptcutv1vf] { display: none; }
    .form-row[b-fptcutv1vf] { flex-direction: column; }
    .form-row-4[b-fptcutv1vf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fptcutv1vf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fptcutv1vf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fptcutv1vf] { padding: 0.75rem; }
    .modal-tabs[b-fptcutv1vf] { overflow-x: auto; }
    .modal-tab[b-fptcutv1vf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fptcutv1vf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fptcutv1vf] { display: grid !important; }
    .crud-cards-wrapper[b-fptcutv1vf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fptcutv1vf] { grid-template-columns: 1fr; }
    .card-details[b-fptcutv1vf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fptcutv1vf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fptcutv1vf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fptcutv1vf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fptcutv1vf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_corredorseguros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h5pjrucp58] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h5pjrucp58 0.3s ease-out; }
@keyframes slideUp-b-h5pjrucp58 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h5pjrucp58] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h5pjrucp58] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h5pjrucp58] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h5pjrucp58] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h5pjrucp58] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h5pjrucp58] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h5pjrucp58] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h5pjrucp58] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h5pjrucp58] { filter: brightness(1.1); }
.btn-outline[b-h5pjrucp58] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h5pjrucp58] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h5pjrucp58] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h5pjrucp58] { filter: brightness(1.1); }
.btn-icon[b-h5pjrucp58] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h5pjrucp58] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h5pjrucp58] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h5pjrucp58] { color: #ef4444; }
.btn-delete:hover[b-h5pjrucp58] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h5pjrucp58] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h5pjrucp58] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h5pjrucp58] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h5pjrucp58] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h5pjrucp58] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h5pjrucp58] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h5pjrucp58] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h5pjrucp58] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h5pjrucp58] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h5pjrucp58] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h5pjrucp58] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h5pjrucp58] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h5pjrucp58] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h5pjrucp58] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h5pjrucp58] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h5pjrucp58] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h5pjrucp58] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h5pjrucp58] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h5pjrucp58] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h5pjrucp58] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h5pjrucp58] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h5pjrucp58] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h5pjrucp58] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h5pjrucp58] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h5pjrucp58] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h5pjrucp58] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h5pjrucp58] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h5pjrucp58] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h5pjrucp58] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h5pjrucp58] { display: block; }
.hide-on-cards[b-h5pjrucp58] { display: none !important; }
.show-on-cards[b-h5pjrucp58] { display: grid; }
.hide-on-grid[b-h5pjrucp58] { display: none !important; }

/* Badges */
.badge[b-h5pjrucp58] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h5pjrucp58] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h5pjrucp58] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h5pjrucp58] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h5pjrucp58] { text-align: center; }
.text-muted[b-h5pjrucp58] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h5pjrucp58], .crud-empty-state[b-h5pjrucp58] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h5pjrucp58] { font-size: 2rem; }
.crud-spinner[b-h5pjrucp58] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h5pjrucp58 0.6s linear infinite; }
.crud-spinner-sm[b-h5pjrucp58] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h5pjrucp58 0.6s linear infinite; }
@keyframes spin-b-h5pjrucp58 { to { transform: rotate(360deg); } }
.spin[b-h5pjrucp58] { animation: spin-b-h5pjrucp58 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h5pjrucp58] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h5pjrucp58 0.15s ease-out; }
.modal-container[b-h5pjrucp58] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h5pjrucp58] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h5pjrucp58 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h5pjrucp58] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h5pjrucp58] { max-width: 420px; }
@keyframes fadeIn-b-h5pjrucp58 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h5pjrucp58 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h5pjrucp58] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h5pjrucp58] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h5pjrucp58] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h5pjrucp58] { color: #dc2626; }
.modal-close[b-h5pjrucp58] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h5pjrucp58] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h5pjrucp58] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h5pjrucp58] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h5pjrucp58] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h5pjrucp58] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h5pjrucp58] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h5pjrucp58] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h5pjrucp58] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h5pjrucp58] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h5pjrucp58] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h5pjrucp58] { flex: 2; }
.form-group label[b-h5pjrucp58] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h5pjrucp58], .form-group select[b-h5pjrucp58], .form-textarea[b-h5pjrucp58] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h5pjrucp58], .form-group select:focus[b-h5pjrucp58], .form-textarea:focus[b-h5pjrucp58] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h5pjrucp58] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h5pjrucp58] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h5pjrucp58] { flex: 1; display: flex; align-items: center; }
.form-check[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h5pjrucp58] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h5pjrucp58] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h5pjrucp58] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h5pjrucp58] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h5pjrucp58] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h5pjrucp58] { font-size: 3rem; }
.photo-placeholder span[b-h5pjrucp58] { font-size: 0.78rem; }
.photo-actions[b-h5pjrucp58] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h5pjrucp58] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h5pjrucp58] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h5pjrucp58] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h5pjrucp58] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h5pjrucp58] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h5pjrucp58] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h5pjrucp58] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h5pjrucp58] { filter: brightness(1.15); transform: scale(1.05); }
[b-h5pjrucp58] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h5pjrucp58] { padding: 0.75rem; }
    .crud-header[b-h5pjrucp58] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h5pjrucp58] { font-size: 1.1rem; }
    .btn-text[b-h5pjrucp58] { display: none; }
    .form-row[b-h5pjrucp58] { flex-direction: column; }
    .form-row-4[b-h5pjrucp58] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h5pjrucp58] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h5pjrucp58] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h5pjrucp58] { padding: 0.75rem; }
    .modal-tabs[b-h5pjrucp58] { overflow-x: auto; }
    .modal-tab[b-h5pjrucp58] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h5pjrucp58] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h5pjrucp58] { display: grid !important; }
    .crud-cards-wrapper[b-h5pjrucp58] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h5pjrucp58] { grid-template-columns: 1fr; }
    .card-details[b-h5pjrucp58] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h5pjrucp58] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h5pjrucp58] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h5pjrucp58] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h5pjrucp58] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_listadopoliza.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-77drgmrw37] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-77drgmrw37 0.3s ease-out; }
@keyframes slideUp-b-77drgmrw37 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-77drgmrw37] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-77drgmrw37] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-77drgmrw37] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-77drgmrw37] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-77drgmrw37] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-77drgmrw37] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-77drgmrw37] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-77drgmrw37] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-77drgmrw37] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-77drgmrw37] { filter: brightness(1.1); }
.btn-outline[b-77drgmrw37] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-77drgmrw37] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-77drgmrw37] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-77drgmrw37] { filter: brightness(1.1); }
.btn-icon[b-77drgmrw37] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-77drgmrw37] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-77drgmrw37] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-77drgmrw37] { color: #ef4444; }
.btn-delete:hover[b-77drgmrw37] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-77drgmrw37] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-77drgmrw37] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-77drgmrw37] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-77drgmrw37] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-77drgmrw37] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-77drgmrw37] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-77drgmrw37] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-77drgmrw37] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-77drgmrw37] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-77drgmrw37] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-77drgmrw37] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-77drgmrw37] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-77drgmrw37] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-77drgmrw37] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-77drgmrw37] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-77drgmrw37] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-77drgmrw37] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-77drgmrw37] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-77drgmrw37] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-77drgmrw37] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-77drgmrw37] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-77drgmrw37] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-77drgmrw37] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-77drgmrw37] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-77drgmrw37] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-77drgmrw37] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-77drgmrw37] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-77drgmrw37] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-77drgmrw37] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-77drgmrw37] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-77drgmrw37] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-77drgmrw37] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-77drgmrw37] { display: block; }
.hide-on-cards[b-77drgmrw37] { display: none !important; }
.show-on-cards[b-77drgmrw37] { display: grid; }
.hide-on-grid[b-77drgmrw37] { display: none !important; }

/* Badges */
.badge[b-77drgmrw37] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-77drgmrw37] { background: #ecfdf5; color: #065f46; }
.badge-no[b-77drgmrw37] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-77drgmrw37] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-77drgmrw37] { text-align: center; }
.text-muted[b-77drgmrw37] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-77drgmrw37], .crud-empty-state[b-77drgmrw37] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-77drgmrw37] { font-size: 2rem; }
.crud-spinner[b-77drgmrw37] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-77drgmrw37 0.6s linear infinite; }
.crud-spinner-sm[b-77drgmrw37] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-77drgmrw37 0.6s linear infinite; }
@keyframes spin-b-77drgmrw37 { to { transform: rotate(360deg); } }
.spin[b-77drgmrw37] { animation: spin-b-77drgmrw37 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-77drgmrw37] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-77drgmrw37 0.15s ease-out; }
.modal-container[b-77drgmrw37] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-77drgmrw37] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-77drgmrw37 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-77drgmrw37] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-77drgmrw37] { max-width: 420px; }
@keyframes fadeIn-b-77drgmrw37 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-77drgmrw37 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-77drgmrw37] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-77drgmrw37] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-77drgmrw37] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-77drgmrw37] { color: #dc2626; }
.modal-close[b-77drgmrw37] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-77drgmrw37] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-77drgmrw37] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-77drgmrw37] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-77drgmrw37] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-77drgmrw37] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-77drgmrw37] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-77drgmrw37] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-77drgmrw37] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-77drgmrw37] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-77drgmrw37] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-77drgmrw37] { flex: 2; }
.form-group label[b-77drgmrw37] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-77drgmrw37], .form-group select[b-77drgmrw37], .form-textarea[b-77drgmrw37] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-77drgmrw37], .form-group select:focus[b-77drgmrw37], .form-textarea:focus[b-77drgmrw37] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-77drgmrw37] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-77drgmrw37] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-77drgmrw37] { flex: 1; display: flex; align-items: center; }
.form-check[b-77drgmrw37] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-77drgmrw37] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-77drgmrw37] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-77drgmrw37] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-77drgmrw37] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-77drgmrw37] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-77drgmrw37] { font-size: 3rem; }
.photo-placeholder span[b-77drgmrw37] { font-size: 0.78rem; }
.photo-actions[b-77drgmrw37] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-77drgmrw37] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-77drgmrw37] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-77drgmrw37] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-77drgmrw37] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-77drgmrw37] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-77drgmrw37] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-77drgmrw37] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-77drgmrw37] { filter: brightness(1.15); transform: scale(1.05); }
[b-77drgmrw37] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-77drgmrw37] { padding: 0.75rem; }
    .crud-header[b-77drgmrw37] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-77drgmrw37] { font-size: 1.1rem; }
    .btn-text[b-77drgmrw37] { display: none; }
    .form-row[b-77drgmrw37] { flex-direction: column; }
    .form-row-4[b-77drgmrw37] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-77drgmrw37] { width: 98%; max-height: 95vh; }
    .modal-lg[b-77drgmrw37] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-77drgmrw37] { padding: 0.75rem; }
    .modal-tabs[b-77drgmrw37] { overflow-x: auto; }
    .modal-tab[b-77drgmrw37] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-77drgmrw37] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-77drgmrw37] { display: grid !important; }
    .crud-cards-wrapper[b-77drgmrw37] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-77drgmrw37] { grid-template-columns: 1fr; }
    .card-details[b-77drgmrw37] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-77drgmrw37] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-77drgmrw37] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-77drgmrw37] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-77drgmrw37] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_registra_poliza.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-pyoqjh0t3h] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pyoqjh0t3h 0.3s ease-out; }
@keyframes slideUp-b-pyoqjh0t3h { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pyoqjh0t3h] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pyoqjh0t3h] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pyoqjh0t3h] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pyoqjh0t3h] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pyoqjh0t3h] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pyoqjh0t3h] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pyoqjh0t3h] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pyoqjh0t3h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pyoqjh0t3h] { filter: brightness(1.1); }
.btn-outline[b-pyoqjh0t3h] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pyoqjh0t3h] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pyoqjh0t3h] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pyoqjh0t3h] { filter: brightness(1.1); }
.btn-icon[b-pyoqjh0t3h] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pyoqjh0t3h] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pyoqjh0t3h] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pyoqjh0t3h] { color: #ef4444; }
.btn-delete:hover[b-pyoqjh0t3h] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-pyoqjh0t3h] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pyoqjh0t3h] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pyoqjh0t3h] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pyoqjh0t3h] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pyoqjh0t3h] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pyoqjh0t3h] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-pyoqjh0t3h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pyoqjh0t3h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-pyoqjh0t3h] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pyoqjh0t3h] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pyoqjh0t3h] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pyoqjh0t3h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pyoqjh0t3h] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pyoqjh0t3h] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pyoqjh0t3h] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-pyoqjh0t3h] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-pyoqjh0t3h] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-pyoqjh0t3h] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-pyoqjh0t3h] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-pyoqjh0t3h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-pyoqjh0t3h] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-pyoqjh0t3h] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-pyoqjh0t3h] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-pyoqjh0t3h] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-pyoqjh0t3h] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-pyoqjh0t3h] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-pyoqjh0t3h] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-pyoqjh0t3h] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-pyoqjh0t3h] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-pyoqjh0t3h] { display: block; }
.hide-on-cards[b-pyoqjh0t3h] { display: none !important; }
.show-on-cards[b-pyoqjh0t3h] { display: grid; }
.hide-on-grid[b-pyoqjh0t3h] { display: none !important; }

/* Badges */
.badge[b-pyoqjh0t3h] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pyoqjh0t3h] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pyoqjh0t3h] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-pyoqjh0t3h] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pyoqjh0t3h] { text-align: center; }
.text-muted[b-pyoqjh0t3h] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pyoqjh0t3h], .crud-empty-state[b-pyoqjh0t3h] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pyoqjh0t3h] { font-size: 2rem; }
.crud-spinner[b-pyoqjh0t3h] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pyoqjh0t3h 0.6s linear infinite; }
.crud-spinner-sm[b-pyoqjh0t3h] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pyoqjh0t3h 0.6s linear infinite; }
@keyframes spin-b-pyoqjh0t3h { to { transform: rotate(360deg); } }
.spin[b-pyoqjh0t3h] { animation: spin-b-pyoqjh0t3h 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-pyoqjh0t3h] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pyoqjh0t3h 0.15s ease-out; }
.modal-container[b-pyoqjh0t3h] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pyoqjh0t3h] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pyoqjh0t3h 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-pyoqjh0t3h] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-pyoqjh0t3h] { max-width: 420px; }
@keyframes fadeIn-b-pyoqjh0t3h { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pyoqjh0t3h { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pyoqjh0t3h] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pyoqjh0t3h] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-pyoqjh0t3h] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-pyoqjh0t3h] { color: #dc2626; }
.modal-close[b-pyoqjh0t3h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pyoqjh0t3h] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pyoqjh0t3h] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pyoqjh0t3h] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pyoqjh0t3h] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-pyoqjh0t3h] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pyoqjh0t3h] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pyoqjh0t3h] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pyoqjh0t3h] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pyoqjh0t3h] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pyoqjh0t3h] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pyoqjh0t3h] { flex: 2; }
.form-group label[b-pyoqjh0t3h] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pyoqjh0t3h], .form-group select[b-pyoqjh0t3h], .form-textarea[b-pyoqjh0t3h] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pyoqjh0t3h], .form-group select:focus[b-pyoqjh0t3h], .form-textarea:focus[b-pyoqjh0t3h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pyoqjh0t3h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pyoqjh0t3h] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pyoqjh0t3h] { flex: 1; display: flex; align-items: center; }
.form-check[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pyoqjh0t3h] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-pyoqjh0t3h] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-pyoqjh0t3h] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-pyoqjh0t3h] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-pyoqjh0t3h] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-pyoqjh0t3h] { font-size: 3rem; }
.photo-placeholder span[b-pyoqjh0t3h] { font-size: 0.78rem; }
.photo-actions[b-pyoqjh0t3h] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-pyoqjh0t3h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-pyoqjh0t3h] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-pyoqjh0t3h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-pyoqjh0t3h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-pyoqjh0t3h] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-pyoqjh0t3h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-pyoqjh0t3h] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-pyoqjh0t3h] { filter: brightness(1.15); transform: scale(1.05); }
[b-pyoqjh0t3h] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pyoqjh0t3h] { padding: 0.75rem; }
    .crud-header[b-pyoqjh0t3h] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pyoqjh0t3h] { font-size: 1.1rem; }
    .btn-text[b-pyoqjh0t3h] { display: none; }
    .form-row[b-pyoqjh0t3h] { flex-direction: column; }
    .form-row-4[b-pyoqjh0t3h] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pyoqjh0t3h] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pyoqjh0t3h] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-pyoqjh0t3h] { padding: 0.75rem; }
    .modal-tabs[b-pyoqjh0t3h] { overflow-x: auto; }
    .modal-tab[b-pyoqjh0t3h] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-pyoqjh0t3h] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-pyoqjh0t3h] { display: grid !important; }
    .crud-cards-wrapper[b-pyoqjh0t3h] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-pyoqjh0t3h] { grid-template-columns: 1fr; }
    .card-details[b-pyoqjh0t3h] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-pyoqjh0t3h] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pyoqjh0t3h] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pyoqjh0t3h] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pyoqjh0t3h] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_riesgoasignadotiposeguro.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lfex0o79v1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lfex0o79v1 0.3s ease-out; }
@keyframes slideUp-b-lfex0o79v1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lfex0o79v1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lfex0o79v1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lfex0o79v1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lfex0o79v1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lfex0o79v1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lfex0o79v1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lfex0o79v1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lfex0o79v1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lfex0o79v1] { filter: brightness(1.1); }
.btn-outline[b-lfex0o79v1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lfex0o79v1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lfex0o79v1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lfex0o79v1] { filter: brightness(1.1); }
.btn-icon[b-lfex0o79v1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lfex0o79v1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lfex0o79v1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lfex0o79v1] { color: #ef4444; }
.btn-delete:hover[b-lfex0o79v1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lfex0o79v1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lfex0o79v1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lfex0o79v1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lfex0o79v1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lfex0o79v1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lfex0o79v1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lfex0o79v1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lfex0o79v1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lfex0o79v1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lfex0o79v1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lfex0o79v1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lfex0o79v1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lfex0o79v1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lfex0o79v1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lfex0o79v1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lfex0o79v1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lfex0o79v1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lfex0o79v1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lfex0o79v1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lfex0o79v1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lfex0o79v1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lfex0o79v1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lfex0o79v1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lfex0o79v1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lfex0o79v1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lfex0o79v1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lfex0o79v1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lfex0o79v1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lfex0o79v1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lfex0o79v1] { display: block; }
.hide-on-cards[b-lfex0o79v1] { display: none !important; }
.show-on-cards[b-lfex0o79v1] { display: grid; }
.hide-on-grid[b-lfex0o79v1] { display: none !important; }

/* Badges */
.badge[b-lfex0o79v1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lfex0o79v1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lfex0o79v1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lfex0o79v1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lfex0o79v1] { text-align: center; }
.text-muted[b-lfex0o79v1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lfex0o79v1], .crud-empty-state[b-lfex0o79v1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lfex0o79v1] { font-size: 2rem; }
.crud-spinner[b-lfex0o79v1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lfex0o79v1 0.6s linear infinite; }
.crud-spinner-sm[b-lfex0o79v1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lfex0o79v1 0.6s linear infinite; }
@keyframes spin-b-lfex0o79v1 { to { transform: rotate(360deg); } }
.spin[b-lfex0o79v1] { animation: spin-b-lfex0o79v1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lfex0o79v1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lfex0o79v1 0.15s ease-out; }
.modal-container[b-lfex0o79v1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lfex0o79v1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lfex0o79v1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lfex0o79v1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lfex0o79v1] { max-width: 420px; }
@keyframes fadeIn-b-lfex0o79v1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lfex0o79v1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lfex0o79v1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lfex0o79v1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lfex0o79v1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lfex0o79v1] { color: #dc2626; }
.modal-close[b-lfex0o79v1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lfex0o79v1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lfex0o79v1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lfex0o79v1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lfex0o79v1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lfex0o79v1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lfex0o79v1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lfex0o79v1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lfex0o79v1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lfex0o79v1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lfex0o79v1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lfex0o79v1] { flex: 2; }
.form-group label[b-lfex0o79v1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lfex0o79v1], .form-group select[b-lfex0o79v1], .form-textarea[b-lfex0o79v1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lfex0o79v1], .form-group select:focus[b-lfex0o79v1], .form-textarea:focus[b-lfex0o79v1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lfex0o79v1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lfex0o79v1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lfex0o79v1] { flex: 1; display: flex; align-items: center; }
.form-check[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lfex0o79v1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lfex0o79v1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lfex0o79v1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lfex0o79v1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lfex0o79v1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lfex0o79v1] { font-size: 3rem; }
.photo-placeholder span[b-lfex0o79v1] { font-size: 0.78rem; }
.photo-actions[b-lfex0o79v1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lfex0o79v1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lfex0o79v1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lfex0o79v1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lfex0o79v1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lfex0o79v1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lfex0o79v1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lfex0o79v1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lfex0o79v1] { filter: brightness(1.15); transform: scale(1.05); }
[b-lfex0o79v1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lfex0o79v1] { padding: 0.75rem; }
    .crud-header[b-lfex0o79v1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lfex0o79v1] { font-size: 1.1rem; }
    .btn-text[b-lfex0o79v1] { display: none; }
    .form-row[b-lfex0o79v1] { flex-direction: column; }
    .form-row-4[b-lfex0o79v1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lfex0o79v1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lfex0o79v1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lfex0o79v1] { padding: 0.75rem; }
    .modal-tabs[b-lfex0o79v1] { overflow-x: auto; }
    .modal-tab[b-lfex0o79v1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lfex0o79v1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lfex0o79v1] { display: grid !important; }
    .crud-cards-wrapper[b-lfex0o79v1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lfex0o79v1] { grid-template-columns: 1fr; }
    .card-details[b-lfex0o79v1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lfex0o79v1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lfex0o79v1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lfex0o79v1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lfex0o79v1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_tipocancelacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-slr97qq275] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-slr97qq275 0.3s ease-out; }
@keyframes slideUp-b-slr97qq275 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-slr97qq275] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-slr97qq275] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-slr97qq275] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-slr97qq275] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-slr97qq275] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-slr97qq275] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-slr97qq275] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-slr97qq275] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-slr97qq275] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-slr97qq275] { filter: brightness(1.1); }
.btn-outline[b-slr97qq275] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-slr97qq275] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-slr97qq275] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-slr97qq275] { filter: brightness(1.1); }
.btn-icon[b-slr97qq275] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-slr97qq275] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-slr97qq275] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-slr97qq275] { color: #ef4444; }
.btn-delete:hover[b-slr97qq275] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-slr97qq275] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-slr97qq275] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-slr97qq275] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-slr97qq275] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-slr97qq275] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-slr97qq275] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-slr97qq275] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-slr97qq275] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-slr97qq275] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-slr97qq275] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-slr97qq275] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-slr97qq275] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-slr97qq275] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-slr97qq275] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-slr97qq275] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-slr97qq275] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-slr97qq275] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-slr97qq275] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-slr97qq275] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-slr97qq275] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-slr97qq275] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-slr97qq275] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-slr97qq275] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-slr97qq275] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-slr97qq275] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-slr97qq275] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-slr97qq275] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-slr97qq275] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-slr97qq275] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-slr97qq275] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-slr97qq275] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-slr97qq275] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-slr97qq275] { display: block; }
.hide-on-cards[b-slr97qq275] { display: none !important; }
.show-on-cards[b-slr97qq275] { display: grid; }
.hide-on-grid[b-slr97qq275] { display: none !important; }

/* Badges */
.badge[b-slr97qq275] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-slr97qq275] { background: #ecfdf5; color: #065f46; }
.badge-no[b-slr97qq275] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-slr97qq275] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-slr97qq275] { text-align: center; }
.text-muted[b-slr97qq275] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-slr97qq275], .crud-empty-state[b-slr97qq275] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-slr97qq275] { font-size: 2rem; }
.crud-spinner[b-slr97qq275] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-slr97qq275 0.6s linear infinite; }
.crud-spinner-sm[b-slr97qq275] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-slr97qq275 0.6s linear infinite; }
@keyframes spin-b-slr97qq275 { to { transform: rotate(360deg); } }
.spin[b-slr97qq275] { animation: spin-b-slr97qq275 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-slr97qq275] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-slr97qq275 0.15s ease-out; }
.modal-container[b-slr97qq275] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-slr97qq275] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-slr97qq275 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-slr97qq275] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-slr97qq275] { max-width: 420px; }
@keyframes fadeIn-b-slr97qq275 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-slr97qq275 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-slr97qq275] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-slr97qq275] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-slr97qq275] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-slr97qq275] { color: #dc2626; }
.modal-close[b-slr97qq275] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-slr97qq275] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-slr97qq275] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-slr97qq275] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-slr97qq275] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-slr97qq275] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-slr97qq275] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-slr97qq275] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-slr97qq275] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-slr97qq275] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-slr97qq275] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-slr97qq275] { flex: 2; }
.form-group label[b-slr97qq275] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-slr97qq275], .form-group select[b-slr97qq275], .form-textarea[b-slr97qq275] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-slr97qq275], .form-group select:focus[b-slr97qq275], .form-textarea:focus[b-slr97qq275] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-slr97qq275] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-slr97qq275] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-slr97qq275] { flex: 1; display: flex; align-items: center; }
.form-check[b-slr97qq275] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-slr97qq275] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-slr97qq275] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-slr97qq275] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-slr97qq275] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-slr97qq275] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-slr97qq275] { font-size: 3rem; }
.photo-placeholder span[b-slr97qq275] { font-size: 0.78rem; }
.photo-actions[b-slr97qq275] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-slr97qq275] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-slr97qq275] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-slr97qq275] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-slr97qq275] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-slr97qq275] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-slr97qq275] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-slr97qq275] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-slr97qq275] { filter: brightness(1.15); transform: scale(1.05); }
[b-slr97qq275] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-slr97qq275] { padding: 0.75rem; }
    .crud-header[b-slr97qq275] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-slr97qq275] { font-size: 1.1rem; }
    .btn-text[b-slr97qq275] { display: none; }
    .form-row[b-slr97qq275] { flex-direction: column; }
    .form-row-4[b-slr97qq275] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-slr97qq275] { width: 98%; max-height: 95vh; }
    .modal-lg[b-slr97qq275] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-slr97qq275] { padding: 0.75rem; }
    .modal-tabs[b-slr97qq275] { overflow-x: auto; }
    .modal-tab[b-slr97qq275] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-slr97qq275] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-slr97qq275] { display: grid !important; }
    .crud-cards-wrapper[b-slr97qq275] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-slr97qq275] { grid-template-columns: 1fr; }
    .card-details[b-slr97qq275] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-slr97qq275] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-slr97qq275] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-slr97qq275] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-slr97qq275] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_tiporiesgo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-nz0runghbe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-nz0runghbe 0.3s ease-out; }
@keyframes slideUp-b-nz0runghbe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-nz0runghbe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-nz0runghbe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-nz0runghbe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-nz0runghbe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-nz0runghbe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-nz0runghbe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-nz0runghbe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-nz0runghbe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-nz0runghbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-nz0runghbe] { filter: brightness(1.1); }
.btn-outline[b-nz0runghbe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-nz0runghbe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-nz0runghbe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-nz0runghbe] { filter: brightness(1.1); }
.btn-icon[b-nz0runghbe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-nz0runghbe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-nz0runghbe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-nz0runghbe] { color: #ef4444; }
.btn-delete:hover[b-nz0runghbe] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-nz0runghbe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-nz0runghbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-nz0runghbe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-nz0runghbe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-nz0runghbe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-nz0runghbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-nz0runghbe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-nz0runghbe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-nz0runghbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-nz0runghbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-nz0runghbe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-nz0runghbe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-nz0runghbe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-nz0runghbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-nz0runghbe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-nz0runghbe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-nz0runghbe] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-nz0runghbe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-nz0runghbe] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-nz0runghbe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-nz0runghbe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-nz0runghbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-nz0runghbe] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-nz0runghbe] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-nz0runghbe] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-nz0runghbe] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-nz0runghbe] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-nz0runghbe] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-nz0runghbe] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-nz0runghbe] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-nz0runghbe] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-nz0runghbe] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-nz0runghbe] { display: block; }
.hide-on-cards[b-nz0runghbe] { display: none !important; }
.show-on-cards[b-nz0runghbe] { display: grid; }
.hide-on-grid[b-nz0runghbe] { display: none !important; }

/* Badges */
.badge[b-nz0runghbe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-nz0runghbe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-nz0runghbe] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-nz0runghbe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-nz0runghbe] { text-align: center; }
.text-muted[b-nz0runghbe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-nz0runghbe], .crud-empty-state[b-nz0runghbe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-nz0runghbe] { font-size: 2rem; }
.crud-spinner[b-nz0runghbe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-nz0runghbe 0.6s linear infinite; }
.crud-spinner-sm[b-nz0runghbe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-nz0runghbe 0.6s linear infinite; }
@keyframes spin-b-nz0runghbe { to { transform: rotate(360deg); } }
.spin[b-nz0runghbe] { animation: spin-b-nz0runghbe 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-nz0runghbe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-nz0runghbe 0.15s ease-out; }
.modal-container[b-nz0runghbe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-nz0runghbe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-nz0runghbe 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-nz0runghbe] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-nz0runghbe] { max-width: 420px; }
@keyframes fadeIn-b-nz0runghbe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-nz0runghbe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-nz0runghbe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-nz0runghbe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-nz0runghbe] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-nz0runghbe] { color: #dc2626; }
.modal-close[b-nz0runghbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-nz0runghbe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-nz0runghbe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-nz0runghbe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-nz0runghbe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-nz0runghbe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-nz0runghbe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-nz0runghbe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-nz0runghbe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-nz0runghbe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-nz0runghbe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-nz0runghbe] { flex: 2; }
.form-group label[b-nz0runghbe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-nz0runghbe], .form-group select[b-nz0runghbe], .form-textarea[b-nz0runghbe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-nz0runghbe], .form-group select:focus[b-nz0runghbe], .form-textarea:focus[b-nz0runghbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-nz0runghbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-nz0runghbe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-nz0runghbe] { flex: 1; display: flex; align-items: center; }
.form-check[b-nz0runghbe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-nz0runghbe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-nz0runghbe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-nz0runghbe] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-nz0runghbe] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-nz0runghbe] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-nz0runghbe] { font-size: 3rem; }
.photo-placeholder span[b-nz0runghbe] { font-size: 0.78rem; }
.photo-actions[b-nz0runghbe] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-nz0runghbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-nz0runghbe] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-nz0runghbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-nz0runghbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-nz0runghbe] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-nz0runghbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-nz0runghbe] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-nz0runghbe] { filter: brightness(1.15); transform: scale(1.05); }
[b-nz0runghbe] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-nz0runghbe] { padding: 0.75rem; }
    .crud-header[b-nz0runghbe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-nz0runghbe] { font-size: 1.1rem; }
    .btn-text[b-nz0runghbe] { display: none; }
    .form-row[b-nz0runghbe] { flex-direction: column; }
    .form-row-4[b-nz0runghbe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-nz0runghbe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-nz0runghbe] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-nz0runghbe] { padding: 0.75rem; }
    .modal-tabs[b-nz0runghbe] { overflow-x: auto; }
    .modal-tab[b-nz0runghbe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-nz0runghbe] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-nz0runghbe] { display: grid !important; }
    .crud-cards-wrapper[b-nz0runghbe] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-nz0runghbe] { grid-template-columns: 1fr; }
    .card-details[b-nz0runghbe] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-nz0runghbe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-nz0runghbe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-nz0runghbe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-nz0runghbe] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmaseg_tiposeguro.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-5zgaraamfa] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5zgaraamfa 0.3s ease-out; }
@keyframes slideUp-b-5zgaraamfa { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5zgaraamfa] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5zgaraamfa] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5zgaraamfa] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5zgaraamfa] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5zgaraamfa] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5zgaraamfa] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5zgaraamfa] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5zgaraamfa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5zgaraamfa] { filter: brightness(1.1); }
.btn-outline[b-5zgaraamfa] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5zgaraamfa] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5zgaraamfa] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5zgaraamfa] { filter: brightness(1.1); }
.btn-icon[b-5zgaraamfa] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5zgaraamfa] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5zgaraamfa] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5zgaraamfa] { color: #ef4444; }
.btn-delete:hover[b-5zgaraamfa] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-5zgaraamfa] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5zgaraamfa] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-5zgaraamfa] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-5zgaraamfa] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5zgaraamfa] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5zgaraamfa] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-5zgaraamfa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5zgaraamfa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-5zgaraamfa] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5zgaraamfa] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5zgaraamfa] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5zgaraamfa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-5zgaraamfa] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5zgaraamfa] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-5zgaraamfa] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-5zgaraamfa] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-5zgaraamfa] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-5zgaraamfa] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-5zgaraamfa] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-5zgaraamfa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-5zgaraamfa] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-5zgaraamfa] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-5zgaraamfa] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-5zgaraamfa] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-5zgaraamfa] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-5zgaraamfa] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-5zgaraamfa] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-5zgaraamfa] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-5zgaraamfa] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-5zgaraamfa] { display: block; }
.hide-on-cards[b-5zgaraamfa] { display: none !important; }
.show-on-cards[b-5zgaraamfa] { display: grid; }
.hide-on-grid[b-5zgaraamfa] { display: none !important; }

/* Badges */
.badge[b-5zgaraamfa] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5zgaraamfa] { background: #ecfdf5; color: #065f46; }
.badge-no[b-5zgaraamfa] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-5zgaraamfa] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-5zgaraamfa] { text-align: center; }
.text-muted[b-5zgaraamfa] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-5zgaraamfa], .crud-empty-state[b-5zgaraamfa] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5zgaraamfa] { font-size: 2rem; }
.crud-spinner[b-5zgaraamfa] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5zgaraamfa 0.6s linear infinite; }
.crud-spinner-sm[b-5zgaraamfa] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5zgaraamfa 0.6s linear infinite; }
@keyframes spin-b-5zgaraamfa { to { transform: rotate(360deg); } }
.spin[b-5zgaraamfa] { animation: spin-b-5zgaraamfa 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-5zgaraamfa] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5zgaraamfa 0.15s ease-out; }
.modal-container[b-5zgaraamfa] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5zgaraamfa] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5zgaraamfa 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-5zgaraamfa] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-5zgaraamfa] { max-width: 420px; }
@keyframes fadeIn-b-5zgaraamfa { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5zgaraamfa { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-5zgaraamfa] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5zgaraamfa] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-5zgaraamfa] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-5zgaraamfa] { color: #dc2626; }
.modal-close[b-5zgaraamfa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5zgaraamfa] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5zgaraamfa] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5zgaraamfa] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-5zgaraamfa] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-5zgaraamfa] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-5zgaraamfa] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-5zgaraamfa] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-5zgaraamfa] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-5zgaraamfa] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-5zgaraamfa] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-5zgaraamfa] { flex: 2; }
.form-group label[b-5zgaraamfa] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5zgaraamfa], .form-group select[b-5zgaraamfa], .form-textarea[b-5zgaraamfa] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5zgaraamfa], .form-group select:focus[b-5zgaraamfa], .form-textarea:focus[b-5zgaraamfa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-5zgaraamfa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-5zgaraamfa] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-5zgaraamfa] { flex: 1; display: flex; align-items: center; }
.form-check[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-5zgaraamfa] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-5zgaraamfa] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-5zgaraamfa] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-5zgaraamfa] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-5zgaraamfa] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-5zgaraamfa] { font-size: 3rem; }
.photo-placeholder span[b-5zgaraamfa] { font-size: 0.78rem; }
.photo-actions[b-5zgaraamfa] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-5zgaraamfa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-5zgaraamfa] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-5zgaraamfa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-5zgaraamfa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-5zgaraamfa] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-5zgaraamfa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-5zgaraamfa] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-5zgaraamfa] { filter: brightness(1.15); transform: scale(1.05); }
[b-5zgaraamfa] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-5zgaraamfa] { padding: 0.75rem; }
    .crud-header[b-5zgaraamfa] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5zgaraamfa] { font-size: 1.1rem; }
    .btn-text[b-5zgaraamfa] { display: none; }
    .form-row[b-5zgaraamfa] { flex-direction: column; }
    .form-row-4[b-5zgaraamfa] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-5zgaraamfa] { width: 98%; max-height: 95vh; }
    .modal-lg[b-5zgaraamfa] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-5zgaraamfa] { padding: 0.75rem; }
    .modal-tabs[b-5zgaraamfa] { overflow-x: auto; }
    .modal-tab[b-5zgaraamfa] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-5zgaraamfa] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-5zgaraamfa] { display: grid !important; }
    .crud-cards-wrapper[b-5zgaraamfa] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-5zgaraamfa] { grid-template-columns: 1fr; }
    .card-details[b-5zgaraamfa] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-5zgaraamfa] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5zgaraamfa] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5zgaraamfa] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5zgaraamfa] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmclientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-eyaxp1rpop] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-eyaxp1rpop 0.3s ease-out; }
@keyframes slideUp-b-eyaxp1rpop { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-eyaxp1rpop] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eyaxp1rpop] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-eyaxp1rpop] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-eyaxp1rpop] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-eyaxp1rpop] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-eyaxp1rpop] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-eyaxp1rpop] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-eyaxp1rpop] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eyaxp1rpop] { filter: brightness(1.1); }
.btn-outline[b-eyaxp1rpop] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-eyaxp1rpop] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-eyaxp1rpop] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-eyaxp1rpop] { filter: brightness(1.1); }
.btn-icon[b-eyaxp1rpop] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-eyaxp1rpop] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-eyaxp1rpop] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-eyaxp1rpop] { color: #ef4444; }
.btn-delete:hover[b-eyaxp1rpop] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-eyaxp1rpop] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-eyaxp1rpop] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-eyaxp1rpop] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-eyaxp1rpop] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-eyaxp1rpop] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-eyaxp1rpop] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-eyaxp1rpop] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-eyaxp1rpop] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-eyaxp1rpop] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-eyaxp1rpop] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-eyaxp1rpop] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-eyaxp1rpop] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-eyaxp1rpop] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-eyaxp1rpop] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-eyaxp1rpop] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-eyaxp1rpop] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-eyaxp1rpop] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-eyaxp1rpop] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-eyaxp1rpop] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-eyaxp1rpop] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-eyaxp1rpop] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-eyaxp1rpop] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-eyaxp1rpop] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-eyaxp1rpop] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-eyaxp1rpop] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-eyaxp1rpop] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-eyaxp1rpop] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-eyaxp1rpop] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-eyaxp1rpop] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-eyaxp1rpop] { display: block; }
.hide-on-cards[b-eyaxp1rpop] { display: none !important; }
.show-on-cards[b-eyaxp1rpop] { display: grid; }
.hide-on-grid[b-eyaxp1rpop] { display: none !important; }

/* Badges */
.badge[b-eyaxp1rpop] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-eyaxp1rpop] { background: #ecfdf5; color: #065f46; }
.badge-no[b-eyaxp1rpop] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-eyaxp1rpop] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-eyaxp1rpop] { text-align: center; }
.text-muted[b-eyaxp1rpop] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-eyaxp1rpop], .crud-empty-state[b-eyaxp1rpop] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-eyaxp1rpop] { font-size: 2rem; }
.crud-spinner[b-eyaxp1rpop] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-eyaxp1rpop 0.6s linear infinite; }
.crud-spinner-sm[b-eyaxp1rpop] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-eyaxp1rpop 0.6s linear infinite; }
@keyframes spin-b-eyaxp1rpop { to { transform: rotate(360deg); } }
.spin[b-eyaxp1rpop] { animation: spin-b-eyaxp1rpop 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-eyaxp1rpop] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-eyaxp1rpop 0.15s ease-out; }
.modal-container[b-eyaxp1rpop] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-eyaxp1rpop] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-eyaxp1rpop 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-eyaxp1rpop] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-eyaxp1rpop] { max-width: 420px; }
@keyframes fadeIn-b-eyaxp1rpop { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-eyaxp1rpop { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-eyaxp1rpop] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-eyaxp1rpop] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-eyaxp1rpop] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-eyaxp1rpop] { color: #dc2626; }
.modal-close[b-eyaxp1rpop] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-eyaxp1rpop] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-eyaxp1rpop] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eyaxp1rpop] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-eyaxp1rpop] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-eyaxp1rpop] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-eyaxp1rpop] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-eyaxp1rpop] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-eyaxp1rpop] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-eyaxp1rpop] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-eyaxp1rpop] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-eyaxp1rpop] { flex: 2; }
.form-group label[b-eyaxp1rpop] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-eyaxp1rpop], .form-group select[b-eyaxp1rpop], .form-textarea[b-eyaxp1rpop] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-eyaxp1rpop], .form-group select:focus[b-eyaxp1rpop], .form-textarea:focus[b-eyaxp1rpop] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-eyaxp1rpop] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-eyaxp1rpop] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-eyaxp1rpop] { flex: 1; display: flex; align-items: center; }
.form-check[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-eyaxp1rpop] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-eyaxp1rpop] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-eyaxp1rpop] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-eyaxp1rpop] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-eyaxp1rpop] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-eyaxp1rpop] { font-size: 3rem; }
.photo-placeholder span[b-eyaxp1rpop] { font-size: 0.78rem; }
.photo-actions[b-eyaxp1rpop] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-eyaxp1rpop] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-eyaxp1rpop] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-eyaxp1rpop] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-eyaxp1rpop] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-eyaxp1rpop] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-eyaxp1rpop] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-eyaxp1rpop] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-eyaxp1rpop] { filter: brightness(1.15); transform: scale(1.05); }
[b-eyaxp1rpop] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-eyaxp1rpop] { padding: 0.75rem; }
    .crud-header[b-eyaxp1rpop] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-eyaxp1rpop] { font-size: 1.1rem; }
    .btn-text[b-eyaxp1rpop] { display: none; }
    .form-row[b-eyaxp1rpop] { flex-direction: column; }
    .form-row-4[b-eyaxp1rpop] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-eyaxp1rpop] { width: 98%; max-height: 95vh; }
    .modal-lg[b-eyaxp1rpop] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-eyaxp1rpop] { padding: 0.75rem; }
    .modal-tabs[b-eyaxp1rpop] { overflow-x: auto; }
    .modal-tab[b-eyaxp1rpop] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-eyaxp1rpop] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-eyaxp1rpop] { display: grid !important; }
    .crud-cards-wrapper[b-eyaxp1rpop] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-eyaxp1rpop] { grid-template-columns: 1fr; }
    .card-details[b-eyaxp1rpop] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-eyaxp1rpop] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-eyaxp1rpop] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-eyaxp1rpop] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-eyaxp1rpop] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Corredorseguros/Frmingresofacturapoliza.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-85h246w1sk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-85h246w1sk 0.3s ease-out; }
@keyframes slideUp-b-85h246w1sk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-85h246w1sk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-85h246w1sk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-85h246w1sk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-85h246w1sk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-85h246w1sk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-85h246w1sk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-85h246w1sk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-85h246w1sk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-85h246w1sk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-85h246w1sk] { filter: brightness(1.1); }
.btn-outline[b-85h246w1sk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-85h246w1sk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-85h246w1sk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-85h246w1sk] { filter: brightness(1.1); }
.btn-icon[b-85h246w1sk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-85h246w1sk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-85h246w1sk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-85h246w1sk] { color: #ef4444; }
.btn-delete:hover[b-85h246w1sk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-85h246w1sk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-85h246w1sk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-85h246w1sk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-85h246w1sk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-85h246w1sk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-85h246w1sk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-85h246w1sk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-85h246w1sk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-85h246w1sk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-85h246w1sk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-85h246w1sk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-85h246w1sk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-85h246w1sk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-85h246w1sk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-85h246w1sk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-85h246w1sk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-85h246w1sk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-85h246w1sk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-85h246w1sk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-85h246w1sk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-85h246w1sk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-85h246w1sk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-85h246w1sk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-85h246w1sk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-85h246w1sk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-85h246w1sk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-85h246w1sk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-85h246w1sk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-85h246w1sk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-85h246w1sk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-85h246w1sk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-85h246w1sk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-85h246w1sk] { display: block; }
.hide-on-cards[b-85h246w1sk] { display: none !important; }
.show-on-cards[b-85h246w1sk] { display: grid; }
.hide-on-grid[b-85h246w1sk] { display: none !important; }

/* Badges */
.badge[b-85h246w1sk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-85h246w1sk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-85h246w1sk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-85h246w1sk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-85h246w1sk] { text-align: center; }
.text-muted[b-85h246w1sk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-85h246w1sk], .crud-empty-state[b-85h246w1sk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-85h246w1sk] { font-size: 2rem; }
.crud-spinner[b-85h246w1sk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-85h246w1sk 0.6s linear infinite; }
.crud-spinner-sm[b-85h246w1sk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-85h246w1sk 0.6s linear infinite; }
@keyframes spin-b-85h246w1sk { to { transform: rotate(360deg); } }
.spin[b-85h246w1sk] { animation: spin-b-85h246w1sk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-85h246w1sk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-85h246w1sk 0.15s ease-out; }
.modal-container[b-85h246w1sk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-85h246w1sk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-85h246w1sk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-85h246w1sk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-85h246w1sk] { max-width: 420px; }
@keyframes fadeIn-b-85h246w1sk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-85h246w1sk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-85h246w1sk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-85h246w1sk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-85h246w1sk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-85h246w1sk] { color: #dc2626; }
.modal-close[b-85h246w1sk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-85h246w1sk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-85h246w1sk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-85h246w1sk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-85h246w1sk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-85h246w1sk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-85h246w1sk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-85h246w1sk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-85h246w1sk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-85h246w1sk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-85h246w1sk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-85h246w1sk] { flex: 2; }
.form-group label[b-85h246w1sk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-85h246w1sk], .form-group select[b-85h246w1sk], .form-textarea[b-85h246w1sk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-85h246w1sk], .form-group select:focus[b-85h246w1sk], .form-textarea:focus[b-85h246w1sk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-85h246w1sk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-85h246w1sk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-85h246w1sk] { flex: 1; display: flex; align-items: center; }
.form-check[b-85h246w1sk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-85h246w1sk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-85h246w1sk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-85h246w1sk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-85h246w1sk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-85h246w1sk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-85h246w1sk] { font-size: 3rem; }
.photo-placeholder span[b-85h246w1sk] { font-size: 0.78rem; }
.photo-actions[b-85h246w1sk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-85h246w1sk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-85h246w1sk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-85h246w1sk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-85h246w1sk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-85h246w1sk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-85h246w1sk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-85h246w1sk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-85h246w1sk] { filter: brightness(1.15); transform: scale(1.05); }
[b-85h246w1sk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-85h246w1sk] { padding: 0.75rem; }
    .crud-header[b-85h246w1sk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-85h246w1sk] { font-size: 1.1rem; }
    .btn-text[b-85h246w1sk] { display: none; }
    .form-row[b-85h246w1sk] { flex-direction: column; }
    .form-row-4[b-85h246w1sk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-85h246w1sk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-85h246w1sk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-85h246w1sk] { padding: 0.75rem; }
    .modal-tabs[b-85h246w1sk] { overflow-x: auto; }
    .modal-tab[b-85h246w1sk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-85h246w1sk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-85h246w1sk] { display: grid !important; }
    .crud-cards-wrapper[b-85h246w1sk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-85h246w1sk] { grid-template-columns: 1fr; }
    .card-details[b-85h246w1sk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-85h246w1sk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-85h246w1sk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-85h246w1sk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-85h246w1sk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmcobrosfacturamercancia.razor.rz.scp.css */
/* ============================================================
   Cobros Factura Mercancía — Estilos CRUD + Cobro específicos
   Tokens: solo --rg-* (sin hex hardcoded salvo rgba/overlays)
   ============================================================ */

.crud-container[b-fohr8gzct0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fohr8gzct0 0.3s ease-out; }
@keyframes slideUp-b-fohr8gzct0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn-b-fohr8gzct0  { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fohr8gzct0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
@keyframes spin-b-fohr8gzct0    { to { transform: rotate(360deg); } }

/* ── Header ── */
.crud-header[b-fohr8gzct0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fohr8gzct0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fohr8gzct0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-fohr8gzct0] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-fohr8gzct0] { display: flex; gap: 0.5rem; }

/* ── Botones ── */
.btn-crud[b-fohr8gzct0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fohr8gzct0] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.btn-sm[b-fohr8gzct0] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-primary[b-fohr8gzct0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fohr8gzct0] { filter: brightness(1.1); }
.btn-outline[b-fohr8gzct0] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-fohr8gzct0] { background: var(--rg-bg-hover); }
.btn-danger[b-fohr8gzct0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fohr8gzct0] { filter: brightness(1.1); }
.btn-icon[b-fohr8gzct0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fohr8gzct0]  { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fohr8gzct0]  { background: rgba(79,70,229,0.1); }
.btn-delete[b-fohr8gzct0] { color: #ef4444; }
.btn-delete:hover[b-fohr8gzct0] { background: rgba(239,68,68,0.1); }

/* ── Alert flash ── */
.crud-alert[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fohr8gzct0] { background: rgba(34,197,94,0.12); color: #15803d; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-fohr8gzct0]   { background: rgba(239,68,68,0.1);  color: #dc2626; border: 1px solid rgba(239,68,68,0.25); }
[data-mode="dark"] .crud-alert.success[b-fohr8gzct0] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-fohr8gzct0]   { color: #fca5a5; }
.crud-alert-close[b-fohr8gzct0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ── Loading / Empty ── */
.crud-loading[b-fohr8gzct0], .crud-empty-state[b-fohr8gzct0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-fohr8gzct0] { font-size: 2rem; }
.crud-spinner[b-fohr8gzct0]    { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent,#4f46e5); border-radius: 50%; animation: spin-b-fohr8gzct0 0.6s linear infinite; }
.crud-spinner-sm[b-fohr8gzct0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fohr8gzct0 0.6s linear infinite; }
.spin[b-fohr8gzct0] { animation: spin-b-fohr8gzct0 0.8s linear infinite; }

/* ── Utilities ── */
.font-mono[b-fohr8gzct0]   { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-fohr8gzct0] { text-align: center; }
.text-muted[b-fohr8gzct0]  { color: var(--rg-text-muted); font-size: 0.78rem; }

/* ── Barra de búsqueda (usada dentro del picker modal) ── */
.crud-search-bar[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.5rem; background: var(--rg-bg-input); }
.crud-search-bar i[b-fohr8gzct0] { color: var(--rg-text-muted); }
.crud-search-bar input[b-fohr8gzct0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-fohr8gzct0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0; line-height: 1; }

/* ── Tabla genérica (picker) ── */
.crud-table[b-fohr8gzct0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fohr8gzct0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fohr8gzct0] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em; padding: 0.5rem 0.65rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; text-align: left; }
.crud-table td[b-fohr8gzct0] { padding: 0.45rem 0.65rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-fohr8gzct0] { background: var(--rg-bg-hover); }

/* ── Modal ── */
.modal-backdrop[b-fohr8gzct0]  { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(3px); z-index: 1000; animation: fadeIn-b-fohr8gzct0 0.15s ease-out; }
.modal-container[b-fohr8gzct0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fohr8gzct0]    { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 680px; max-height: 88vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); animation: scaleIn-b-fohr8gzct0 0.2s ease-out; }
.modal-header[b-fohr8gzct0]    { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-fohr8gzct0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-fohr8gzct0]     { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fohr8gzct0] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-fohr8gzct0]      { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fohr8gzct0]    { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Panel encabezado cliente ── */
.cobro-panel-encabezado[b-fohr8gzct0] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.cobro-enc-row[b-fohr8gzct0] { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.4rem; }
.cobro-enc-row:last-child[b-fohr8gzct0] { margin-bottom: 0; }

/* Form groups */
.form-group[b-fohr8gzct0] { display: flex; flex-direction: column; gap: 0.15rem; flex: 1; min-width: 100px; }
.form-group.flex-1[b-fohr8gzct0] { flex: 1; }
.form-group.flex-2[b-fohr8gzct0] { flex: 2; }
.form-group label[b-fohr8gzct0] { font-size: 0.67rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fohr8gzct0], .form-group select[b-fohr8gzct0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fohr8gzct0], .form-group select:focus[b-fohr8gzct0] { border-color: var(--rg-accent,#4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.form-group input.readonly[b-fohr8gzct0] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); }

/* ── Botón selector de cliente ── */
.cobro-cliente-btn[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.4rem; width: 100%; padding: 0.375rem 0.6rem; border: 1px dashed var(--rg-border); border-radius: 0.375rem; background: var(--rg-bg-input); color: var(--rg-text-muted); font-size: 0.78rem; cursor: pointer; transition: all 0.15s; text-align: left; }
.cobro-cliente-btn:hover[b-fohr8gzct0] { border-color: var(--rg-accent,#4f46e5); color: var(--rg-accent,#4f46e5); background: var(--rg-bg-hover); }
.cobro-cliente-btn.has-value[b-fohr8gzct0] { border-style: solid; border-color: var(--rg-border); color: var(--rg-text-primary); justify-content: space-between; }
.cobro-cliente-id[b-fohr8gzct0] { flex: 1; font-weight: 600; }
.cobro-cliente-edit[b-fohr8gzct0] { color: var(--rg-text-muted); font-size: 0.8rem; }

/* ── Picker grid (dentro del modal) ── */
.cobro-picker-grid[b-fohr8gzct0] { max-height: 380px; overflow-y: auto; border: 1px solid var(--rg-border); border-radius: 0.375rem; }

/* ── Sección genérica ── */
.cobro-section[b-fohr8gzct0] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.cobro-section-header[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.65rem; }
.cobro-section-icon[b-fohr8gzct0]  { font-size: 1.1rem; color: var(--rg-accent,#4f46e5); }
.cobro-section-title[b-fohr8gzct0] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary); flex: 1; }

/* ── Tabla Forma de Pago — Desktop ── */
.cobro-fp-wrapper[b-fohr8gzct0] { overflow-x: auto; margin-bottom: 0.6rem; }
.cobro-fp-table[b-fohr8gzct0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.cobro-fp-table th[b-fohr8gzct0] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em; padding: 0.45rem 0.6rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; text-align: left; }
.cobro-fp-table td[b-fohr8gzct0] { padding: 0.3rem 0.5rem; border-bottom: 1px solid var(--rg-border); vertical-align: middle; }
.cobro-fp-table tfoot td[b-fohr8gzct0] { border-bottom: none; border-top: 2px solid var(--rg-border); }
.cobro-fp-table select[b-fohr8gzct0],
.cobro-fp-table input[type="text"][b-fohr8gzct0],
.cobro-fp-table input[type="number"][b-fohr8gzct0] { width: 100%; padding: 0.3rem 0.4rem; border: 1px solid var(--rg-border); border-radius: 0.25rem; font-size: 0.76rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; }
.cobro-fp-table select:focus[b-fohr8gzct0], .cobro-fp-table input:focus[b-fohr8gzct0] { border-color: var(--rg-accent,#4f46e5); }
.th-monto[b-fohr8gzct0]  { text-align: right !important; }
.input-right[b-fohr8gzct0] { text-align: right; }
.tf-label[b-fohr8gzct0]  { font-size: 0.72rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; padding: 0.5rem 0.6rem !important; }
.tf-total[b-fohr8gzct0]  { font-size: 0.8rem; font-weight: 700; color: var(--rg-text-primary); text-align: right; padding: 0.5rem 0.5rem !important; }

.cobro-fp-empty[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.78rem; color: var(--rg-text-muted); padding: 0.5rem 0; }

/* ── Resumen bar ── */
.cobro-resumen-bar[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; padding: 0.5rem 0.25rem 0; }
.cobro-chip[b-fohr8gzct0] { display: flex; flex-direction: column; align-items: center; padding: 0.3rem 0.75rem; border-radius: 0.5rem; border: 1px solid transparent; min-width: 100px; }
.chip-label[b-fohr8gzct0] { font-size: 0.64rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.chip-value[b-fohr8gzct0] { font-size: 0.9rem; font-weight: 700; font-family: 'Cascadia Code',monospace; }

.cobro-chip-total[b-fohr8gzct0]  { background: rgba(79,70,229,0.08);  color: var(--rg-accent,#4f46e5); border-color: rgba(79,70,229,0.2);  }
.cobro-chip-dist[b-fohr8gzct0]   { background: rgba(251,146,60,0.1);  color: #c2410c; border-color: rgba(251,146,60,0.25); }
.cobro-chip-libre[b-fohr8gzct0]  { background: rgba(34,197,94,0.1);   color: #15803d; border-color: rgba(34,197,94,0.25);  }
.cobro-chip-danger[b-fohr8gzct0] { background: rgba(239,68,68,0.1);   color: #dc2626; border-color: rgba(239,68,68,0.25);  }

[data-mode="dark"] .cobro-chip-total[b-fohr8gzct0]  { background: rgba(99,102,241,0.15); color: #a5b4fc; border-color: rgba(99,102,241,0.3);  }
[data-mode="dark"] .cobro-chip-dist[b-fohr8gzct0]   { background: rgba(251,146,60,0.15); color: #fdba74; border-color: rgba(251,146,60,0.3);  }
[data-mode="dark"] .cobro-chip-libre[b-fohr8gzct0]  { background: rgba(34,197,94,0.15);  color: #86efac; border-color: rgba(34,197,94,0.3);   }
[data-mode="dark"] .cobro-chip-danger[b-fohr8gzct0] { background: rgba(239,68,68,0.15);  color: #fca5a5; border-color: rgba(239,68,68,0.3);   }

/* ── Tabla Facturas ── */
.cobro-facturas-wrapper[b-fohr8gzct0] { overflow: auto; max-height: calc(100vh - 520px); min-height: 200px; border: 1px solid var(--rg-border); border-radius: 0.375rem; }
.cobro-facturas-table[b-fohr8gzct0] { width: 100%; border-collapse: collapse; font-size: 0.77rem; min-width: 900px; }
.cobro-facturas-table thead[b-fohr8gzct0] { position: sticky; top: 0; z-index: 1; }
.cobro-facturas-table th[b-fohr8gzct0] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; padding: 0.5rem 0.6rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; text-align: left; }
.cobro-facturas-table td[b-fohr8gzct0] { padding: 0.35rem 0.5rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.cobro-facturas-table tbody tr:hover[b-fohr8gzct0] { background: var(--rg-bg-hover); }
.cobro-facturas-table tfoot td[b-fohr8gzct0] { border-top: 2px solid var(--rg-border); border-bottom: none; }

.th-editable[b-fohr8gzct0] { background: rgba(239,68,68,0.08) !important; color: #dc2626 !important; }
[data-mode="dark"] .th-editable[b-fohr8gzct0] { background: rgba(239,68,68,0.14) !important; color: #fca5a5 !important; }
.th-estatus[b-fohr8gzct0] { width: 90px; text-align: center !important; }
.td-monto[b-fohr8gzct0]   { text-align: right; white-space: nowrap; }
.td-editable[b-fohr8gzct0] { padding: 0.2rem 0.4rem !important; }
.td-estatus[b-fohr8gzct0] { text-align: center; }
.td-negativo[b-fohr8gzct0] { color: #dc2626; font-weight: 600; }

.input-monto[b-fohr8gzct0] { width: 90px; text-align: right; padding: 0.25rem 0.35rem; border: 1px solid var(--rg-border); border-radius: 0.25rem; font-size: 0.76rem; color: var(--rg-text-primary); background: var(--rg-bg-input); font-family: 'Cascadia Code',monospace; outline: none; transition: border-color 0.15s; }
.input-monto:focus[b-fohr8gzct0] { border-color: var(--rg-accent,#4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.row-saldo[b-fohr8gzct0] { background: rgba(34,197,94,0.06) !important; }
.row-abono[b-fohr8gzct0] { background: rgba(251,146,60,0.06) !important; }
[data-mode="dark"] .row-saldo[b-fohr8gzct0] { background: rgba(34,197,94,0.1) !important; }
[data-mode="dark"] .row-abono[b-fohr8gzct0] { background: rgba(251,146,60,0.1) !important; }

/* Badges Estatus */
.badge-estatus[b-fohr8gzct0]   { display: inline-flex; align-items: center; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.64rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; border: 1px solid transparent; }
.badge-pendiente[b-fohr8gzct0] { background: rgba(100,116,139,0.12); color: #475569; border-color: rgba(100,116,139,0.25); }
.badge-abono[b-fohr8gzct0]     { background: rgba(251,146,60,0.12);  color: #c2410c; border-color: rgba(251,146,60,0.3);  }
.badge-saldo[b-fohr8gzct0]     { background: rgba(34,197,94,0.12);   color: #15803d; border-color: rgba(34,197,94,0.3);   }
[data-mode="dark"] .badge-pendiente[b-fohr8gzct0] { color: #94a3b8; border-color: rgba(100,116,139,0.4); }
[data-mode="dark"] .badge-abono[b-fohr8gzct0]     { color: #fdba74; border-color: rgba(251,146,60,0.4);  }
[data-mode="dark"] .badge-saldo[b-fohr8gzct0]     { color: #86efac; border-color: rgba(34,197,94,0.4);   }

/* ── Celdas bloqueadas (sin fondos) ── */
.td-locked[b-fohr8gzct0] { background: var(--rg-bg-subtle) !important; }
.td-locked .input-monto[b-fohr8gzct0] {
    background: var(--rg-bg-subtle) !important;
    color: var(--rg-text-muted) !important;
    cursor: not-allowed;
    opacity: 0.55;
}

/* ── Aviso sin fondos ── */
.cobro-aviso-fondos[b-fohr8gzct0] {
    display: flex; align-items: center; gap: 0.6rem;
    padding: 0.55rem 0.85rem;
    margin-bottom: 0.6rem;
    font-size: 0.78rem;
    color: #c2410c;
    background: rgba(251,146,60,0.1);
    border: 1px solid rgba(251,146,60,0.3);
    border-radius: 0.375rem;
}
[data-mode="dark"] .cobro-aviso-fondos[b-fohr8gzct0] { color: #fdba74; background: rgba(251,146,60,0.14); border-color: rgba(251,146,60,0.3); }
.cobro-aviso-fondos i[b-fohr8gzct0] { font-size: 0.9rem; flex-shrink: 0; }

/* Empty hint */
.cobro-empty-hint[b-fohr8gzct0] { display: flex; align-items: center; gap: 0.65rem; padding: 1.5rem; font-size: 0.8rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); border-radius: 0.375rem; }
.cobro-empty-hint i[b-fohr8gzct0] { font-size: 1.4rem; }

/* ───────────────────────────────────────────────────────────────────────
   FRANJA DE EVIDENCIA DE PAGO — miniaturas con checkbox de selección
   Aparece debajo del header "Facturas Pendientes" cuando hay cliente cargado.
   ─────────────────────────────────────────────────────────────────────── */
.cobro-evidencia-strip[b-fohr8gzct0] {
    display: flex;
    align-items: center;          /* fila única horizontal */
    gap: .65rem;
    padding: .35rem .75rem;
    margin-bottom: .6rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    min-height: 56px;              /* área estándar */
}

.cobro-evidencia-empty[b-fohr8gzct0] {
    display: flex; align-items: center; gap: .55rem;
    font-size: .78rem;
    color: var(--rg-text-muted);
    flex: 1;
}
.cobro-evidencia-empty i[b-fohr8gzct0] { font-size: 1rem; }

/* Header inline a la izquierda — etiqueta compacta */
.cobro-evidencia-header[b-fohr8gzct0] {
    display: flex; flex-direction: column;
    font-size: .72rem; font-weight: 600;
    color: var(--rg-text-secondary);
    flex-shrink: 0;
    line-height: 1.25;
    min-width: 130px;
}
.cobro-evidencia-header i[b-fohr8gzct0] { color: var(--rg-primary); margin-right: .25rem; }
.cobro-evidencia-hint[b-fohr8gzct0] {
    font-weight: 400; color: var(--rg-text-muted); font-size: .68rem;
}
.cobro-evidencia-hint strong[b-fohr8gzct0] { color: var(--rg-success); margin-left: .25rem; }

/* Tira horizontal con scroll cuando hay muchas miniaturas */
.cobro-evidencia-grid[b-fohr8gzct0] {
    display: flex;
    gap: .35rem;
    flex: 1;
    overflow-x: auto;
    padding: 2px 1px;          /* margen para que el borde no se corte */
    scrollbar-width: thin;
}
.cobro-evidencia-grid[b-fohr8gzct0]::-webkit-scrollbar { height: 5px; }
.cobro-evidencia-grid[b-fohr8gzct0]::-webkit-scrollbar-thumb { background: rgba(100,116,139,.45); border-radius: 4px; }

.cobro-evidencia-card[b-fohr8gzct0] {
    position: relative;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border-radius: 6px;
    overflow: hidden;
    background: var(--rg-bg-card);
    border: 2px solid var(--rg-border);
    transition: border-color .12s, transform .12s, box-shadow .12s;
    cursor: pointer;
}
.cobro-evidencia-card.selected[b-fohr8gzct0] {
    border-color: var(--rg-success);
    box-shadow: 0 2px 8px rgba(22,163,74,.18);
}
.cobro-evidencia-card:hover[b-fohr8gzct0] { transform: translateY(-1px); }

.cobro-evidencia-card img[b-fohr8gzct0] {
    width: 100%; height: 100%;
    object-fit: cover; display: block;
}

/* Checkbox visual estilo "marca verde" — compacto para thumbnail 56px */
.cobro-evidencia-check[b-fohr8gzct0] {
    position: absolute;
    top: 2px; left: 2px;
    z-index: 2;
    cursor: pointer;
    user-select: none;
}
.cobro-evidencia-check input[type="checkbox"][b-fohr8gzct0] {
    position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0;
}
.cobro-evidencia-checkmark[b-fohr8gzct0] {
    display: flex; align-items: center; justify-content: center;
    width: 14px; height: 14px;
    background: rgba(255,255,255,.92);
    border: 1.5px solid #cbd5e1;
    border-radius: 3px;
    color: transparent;
    font-size: 9px;
    transition: background .12s, border-color .12s, color .12s;
}
.cobro-evidencia-card.selected .cobro-evidencia-checkmark[b-fohr8gzct0] {
    background: var(--rg-success);
    border-color: var(--rg-success);
    color: #fff;
}
.cobro-evidencia-check:hover .cobro-evidencia-checkmark[b-fohr8gzct0] { border-color: var(--rg-primary); }

[data-mode="dark"] .cobro-evidencia-checkmark[b-fohr8gzct0] {
    background: rgba(15,23,42,.85);
    border-color: rgba(255,255,255,.25);
}
[data-mode="dark"] .cobro-evidencia-card.selected .cobro-evidencia-checkmark[b-fohr8gzct0] {
    background: var(--rg-success);
    border-color: var(--rg-success);
}

/* ── Resumen Forma de Pago — barra visible debajo del grid ────────── */
.cobro-fp-resumen[b-fohr8gzct0] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.65rem 1rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 5rem;   /* espacio para que el FAB no lo tape */
    animation: fadeIn-b-fohr8gzct0 0.25s ease-out;
}

.cobro-fp-chip[b-fohr8gzct0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    min-width: 110px;
    padding: 0.45rem 0.85rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
}

.cobro-fp-chip-label[b-fohr8gzct0] {
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.cobro-fp-chip-value[b-fohr8gzct0] {
    font-size: 1rem;
    font-weight: 700;
    font-family: 'Cascadia Code', monospace;
    margin-top: 0.15rem;
}

/* Total — azul acento */
.cobro-fp-chip-total[b-fohr8gzct0] {
    background: rgba(79,70,229,0.08);
    color: var(--rg-accent);
    border-color: rgba(79,70,229,0.2);
}

/* Distribuido — naranja */
.cobro-fp-chip-dist[b-fohr8gzct0] {
    background: rgba(251,146,60,0.1);
    color: var(--rg-warning);
    border-color: rgba(251,146,60,0.25);
}

/* Libre positivo — verde */
.cobro-fp-chip-libre[b-fohr8gzct0] {
    background: rgba(34,197,94,0.1);
    color: var(--rg-success);
    border-color: rgba(34,197,94,0.25);
}

/* Libre = 0 (todo distribuido) — verde intenso */
.cobro-fp-chip-ok[b-fohr8gzct0] {
    background: rgba(34,197,94,0.18);
    color: var(--rg-success);
    border-color: rgba(34,197,94,0.4);
}

/* Libre negativo — peligro */
.cobro-fp-chip-danger[b-fohr8gzct0] {
    background: rgba(239,68,68,0.1);
    color: var(--rg-danger);
    border-color: rgba(239,68,68,0.25);
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — Mobile first (≤ 640px)
   Forma de Pago: tabla → tarjetas apiladas
   ════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    .crud-container[b-fohr8gzct0] { padding: 0.6rem; }
    .crud-header[b-fohr8gzct0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fohr8gzct0]  { font-size: 1rem; }
    .btn-text[b-fohr8gzct0]    { display: none; }

    /* Encabezado cliente — todo en columna */
    .cobro-enc-row[b-fohr8gzct0] { flex-direction: column; gap: 0.4rem; }
    .form-group[b-fohr8gzct0] { min-width: unset; width: 100%; }

    /* ── Forma de Pago móvil — ocultar tabla, mostrar tarjetas ── */
    .cobro-fp-wrapper[b-fohr8gzct0] { overflow-x: unset; }
    .cobro-fp-table thead[b-fohr8gzct0] { display: none; }          /* ocultar cabecera */
    .cobro-fp-table[b-fohr8gzct0], .cobro-fp-table tbody[b-fohr8gzct0],
    .cobro-fp-table tr[b-fohr8gzct0], .cobro-fp-table td[b-fohr8gzct0] { display: block; width: 100%; }

    /* Cada fila se convierte en tarjeta */
    .cobro-fp-table tbody tr[b-fohr8gzct0] {
        background: var(--rg-bg-subtle);
        border: 1px solid var(--rg-border);
        border-radius: 0.5rem;
        margin-bottom: 0.6rem;
        padding: 0.6rem;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.4rem;
    }

    /* Celda Tipo y Monto ocupan columna completa en mobile */
    .cobro-fp-table tbody tr td:nth-child(1)[b-fohr8gzct0] { grid-column: 1 / -1; }  /* Tipo — ancho completo */
    .cobro-fp-table tbody tr td:nth-child(2)[b-fohr8gzct0] { grid-column: 1 / -1; }  /* Banco — ancho completo */
    .cobro-fp-table tbody tr td:nth-child(3)[b-fohr8gzct0] { grid-column: 1 / 2; }   /* Referencia */
    .cobro-fp-table tbody tr td:nth-child(4)[b-fohr8gzct0] { grid-column: 2 / 3; }   /* Monto */
    .cobro-fp-table tbody tr td:nth-child(5)[b-fohr8gzct0] { grid-column: 1 / -1; display: flex; justify-content: flex-end; border-bottom: none; padding-top: 0.2rem; }  /* botón eliminar */

    /* Label simulado con data-label (pseudo) */
    .cobro-fp-table tbody tr td[b-fohr8gzct0]::before {
        display: block;
        font-size: 0.62rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--rg-text-muted);
        margin-bottom: 0.2rem;
    }
    .cobro-fp-table tbody tr td:nth-child(1)[b-fohr8gzct0]::before { content: "Tipo"; }
    .cobro-fp-table tbody tr td:nth-child(2)[b-fohr8gzct0]::before { content: "Banco / Entidad"; }
    .cobro-fp-table tbody tr td:nth-child(3)[b-fohr8gzct0]::before { content: "Referencia"; }
    .cobro-fp-table tbody tr td:nth-child(4)[b-fohr8gzct0]::before { content: "Monto"; }

    /* Tfoot igual — solo el total */
    .cobro-fp-table tfoot[b-fohr8gzct0] { display: block; }
    .cobro-fp-table tfoot tr[b-fohr8gzct0] { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0.25rem; border-top: 2px solid var(--rg-border); }
    .cobro-fp-table tfoot td[b-fohr8gzct0] { border: none; padding: 0; }

    /* Inputs dentro de tarjeta */
    .cobro-fp-table select[b-fohr8gzct0],
    .cobro-fp-table input[type="text"][b-fohr8gzct0],
    .cobro-fp-table input[type="number"][b-fohr8gzct0] { font-size: 0.82rem; padding: 0.4rem 0.5rem; }

    /* Resumen chips — fila completa */
    .cobro-resumen-bar[b-fohr8gzct0] { justify-content: space-between; }
    .cobro-chip[b-fohr8gzct0] { min-width: 80px; flex: 1; }

    /* Facturas — scroll horizontal */
    .cobro-facturas-wrapper[b-fohr8gzct0] { max-height: 55vh; }

    /* Modal picker en pantalla completa */
    .modal-dialog[b-fohr8gzct0] { width: 100%; max-width: 100%; height: 100vh; max-height: 100vh; border-radius: 0; }
    .modal-body[b-fohr8gzct0]   { padding: 0.75rem; }
}

@media (max-width: 768px) and (min-width: 641px) {
    /* Tablet — forma de pago con overflow horizontal (cabe con 4 cols) */
    .cobro-facturas-wrapper[b-fohr8gzct0] { max-height: 60vh; }
    .cobro-enc-row[b-fohr8gzct0] { flex-wrap: wrap; }
}

/* ── Tarjetas 2×2 Forma de Pago (dentro del drawer) ── */
.fp-cards-list[b-fohr8gzct0] { display: flex; flex-direction: column; gap: 0.6rem; }

.fp-card[b-fohr8gzct0] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.65rem 0.75rem;
    position: relative;
}

.fp-card-grid[b-fohr8gzct0] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem 0.6rem;
}

.fp-field[b-fohr8gzct0] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.fp-field label[b-fohr8gzct0] {
    font-size: 0.63rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.fp-field select[b-fohr8gzct0],
.fp-field input[type="text"][b-fohr8gzct0],
.fp-field input[type="number"][b-fohr8gzct0] {
    width: 100%;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    transition: border-color 0.15s;
}
.fp-field select:focus[b-fohr8gzct0],
.fp-field input:focus[b-fohr8gzct0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.12); }
.fp-field input[type="number"][b-fohr8gzct0] { text-align: right; font-family: 'Cascadia Code', monospace; }

/* Botón eliminar en la tarjeta */
.fp-card-del[b-fohr8gzct0] {
    position: absolute;
    top: 0.4rem;
    right: 0.4rem;
    width: 1.6rem;
    height: 1.6rem;
}

/* Fila total */
.fp-total-row[b-fohr8gzct0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.25rem 0;
    border-top: 2px solid var(--rg-border);
    margin-top: 0.1rem;
}

/* ════════════════════════════════════════════════════════════
   FAB — Botón flotante Forma de Pago
   Usa solo tokens --rg-* para responder al cambio de tema
   ════════════════════════════════════════════════════════════ */
.cobro-fab[b-fohr8gzct0] {
    /* Posición fija esquina inferior-derecha */
    position: fixed;
    bottom: 1.75rem;
    right: 1.75rem;
    z-index: 900;

    /* Misma base que .btn-crud */
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    letter-spacing: 0.01em;

    /* Sombra que funciona en ambos modos */
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}
.cobro-fab:hover:not(:disabled)[b-fohr8gzct0] { filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,0,0,0.22); }
.cobro-fab:active[b-fohr8gzct0]  { transform: translateY(0); }

.cobro-fab-icon[b-fohr8gzct0]  { font-size: 0.95rem; }
.cobro-fab-label[b-fohr8gzct0] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }

/* Estado gray — sin forma de pago: igual a btn-outline */
.cobro-fab-gray[b-fohr8gzct0] {
    background: transparent;
    color: var(--rg-text-secondary);
    border: 1px dashed var(--rg-border);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.cobro-fab-gray:hover[b-fohr8gzct0] {
    background: var(--rg-bg-hover);
    color: var(--rg-accent);
    border-color: var(--rg-accent);
    border-style: solid;
}

/* Estado warning — fondos ingresados pero con saldo libre */
.cobro-fab-orange[b-fohr8gzct0] {
    background: var(--rg-warning);
    color: #fff;
    border: none;
}

/* Estado success — distribución completa */
.cobro-fab-green[b-fohr8gzct0] {
    background: var(--rg-success);
    color: #fff;
    border: none;
}

/* ════════════════════════════════════════════════════════════
   DRAWER — Panel lateral Forma de Pago
   ════════════════════════════════════════════════════════════ */
.cobro-drawer-backdrop[b-fohr8gzct0] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(2px);
    z-index: 950;
    animation: fadeIn-b-fohr8gzct0 0.2s ease-out;
}

.cobro-drawer[b-fohr8gzct0] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 460px;
    max-width: 100vw;
    background: var(--rg-bg-card);
    border-left: 1px solid var(--rg-border);
    z-index: 951;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 40px rgba(0,0,0,0.18);
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
}
.cobro-drawer-open[b-fohr8gzct0] { transform: translateX(0); }

/* Header drawer */
.cobro-drawer-header[b-fohr8gzct0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.1rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}
.cobro-drawer-title-row[b-fohr8gzct0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.cobro-drawer-icon[b-fohr8gzct0] { font-size: 1.2rem; color: var(--rg-accent, #4f46e5); }
.cobro-drawer-title[b-fohr8gzct0] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); }
.cobro-drawer-close[b-fohr8gzct0] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.3rem;
    border-radius: 0.375rem;
    transition: background 0.15s;
    line-height: 1;
}
.cobro-drawer-close:hover[b-fohr8gzct0] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }

/* Chips dentro del drawer */
.cobro-drawer-chips[b-fohr8gzct0] {
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}

/* Body scrollable */
.cobro-drawer-body[b-fohr8gzct0] {
    flex: 1;
    overflow-y: auto;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

/* Fila botones agregar/aplicar */
.cobro-drawer-agregar[b-fohr8gzct0] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    align-items: center;
}

/* Footer drawer */
.cobro-drawer-footer[b-fohr8gzct0] {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    background: var(--rg-bg-subtle);
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE drawer — mobile: bottom-sheet
   ════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    /* FAB sube un poco para no tapar barra navegación mobile */
    .cobro-fab[b-fohr8gzct0] { bottom: 1.25rem; right: 1rem; font-size: 0.78rem; padding: 0.55rem 0.9rem; }
    .cobro-fab-label[b-fohr8gzct0] { max-width: 160px; }

    /* Drawer → bottom-sheet en mobile */
    .cobro-drawer[b-fohr8gzct0] {
        top: auto;
        bottom: 0;
        right: 0;
        left: 0;
        width: 100%;
        height: 90vh;
        max-width: 100vw;
        border-left: none;
        border-top: 1px solid var(--rg-border);
        border-radius: 1rem 1rem 0 0;
        transform: translateY(100%);
    }
    .cobro-drawer-open[b-fohr8gzct0] { transform: translateY(0); }
    .cobro-drawer-body[b-fohr8gzct0] { padding: 0.65rem 0.75rem; }
    .cobro-drawer-header[b-fohr8gzct0] { padding: 0.75rem; }
    .cobro-drawer-footer[b-fohr8gzct0] { padding: 0.6rem 0.75rem; }
}

/* ════════════════════════════════════════════════════════════
   MODALES ANIDADOS — z-index sobre el post-save
   ════════════════════════════════════════════════════════════ */
.modal-backdrop-nested[b-fohr8gzct0]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-fohr8gzct0] { z-index: 2001 !important; }

/* ════════════════════════════════════════════════════════════
   MODAL POST-GRABADO — Panel de acciones tras grabar cobro
   ════════════════════════════════════════════════════════════ */
.ps-modal[b-fohr8gzct0] { max-width: 380px; }

.ps-recibo-info[b-fohr8gzct0] {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.6rem 0.8rem;
    margin-bottom: 0.5rem;
}

.ps-label[b-fohr8gzct0] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    white-space: nowrap;
}

.ps-value[b-fohr8gzct0] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}

.ps-cliente-info[b-fohr8gzct0] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
    margin-bottom: 1rem;
    padding: 0 0.1rem;
}

.ps-acciones[b-fohr8gzct0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ps-acciones .btn-crud[b-fohr8gzct0] {
    width: 100%;
    justify-content: center;
    padding: 0.6rem 1rem;
    font-size: 0.85rem;
}

/* ════════════════════════════════════════════════════════════
   INPUT OVER-LIMIT — input de monto que supera el disponible
   Visible mientras el usuario teclea un valor mayor al máximo.
   Se corrige al salir del campo (onchange + ValidarTopes).
   ════════════════════════════════════════════════════════════ */
.input-monto.input-over[b-fohr8gzct0] {
    border-color: var(--rg-danger) !important;
    background: rgba(239, 68, 68, 0.08);
    color: var(--rg-danger);
    animation: shake-hint-b-fohr8gzct0 0.25s ease-in-out;
}

@keyframes shake-hint-b-fohr8gzct0 {
    0%   { transform: translateX(0); }
    25%  { transform: translateX(-3px); }
    75%  { transform: translateX(3px); }
    100% { transform: translateX(0); }
}

[data-mode="dark"] .input-monto.input-over[b-fohr8gzct0] {
    background: rgba(239, 68, 68, 0.15);
}

/* ════════════════════════════════════════════════════════════
   Botón QR / Cámara — evidencia de pago
   ════════════════════════════════════════════════════════════ */
.cobro-qr-btn[b-fohr8gzct0] {
    position: relative;
    width: 36px; height: 36px;
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    background: var(--rg-bg-card);
    color: var(--rg-text-secondary);
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px;
    transition: border-color .15s, color .15s, background .15s;
    flex-shrink: 0;
}
.cobro-qr-btn:hover[b-fohr8gzct0] {
    border-color: var(--rg-accent);
    color: var(--rg-accent);
    background: rgba(37, 99, 235, .06);
}
.cobro-qr-btn.has-fotos[b-fohr8gzct0] {
    border-color: var(--rg-success);
    color: var(--rg-success);
    background: rgba(22, 163, 74, .08);
}

.cobro-qr-badge[b-fohr8gzct0] {
    position: absolute;
    top: -6px; right: -6px;
    min-width: 16px; height: 16px;
    background: var(--rg-success);
    color: #fff;
    border-radius: 8px;
    font-size: .62rem;
    font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    padding: 0 3px;
    line-height: 1;
}

/* Input file oculto detrás del label clickeable */
.cobro-evid-file-hidden[b-fohr8gzct0] {
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    opacity: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    clip: rect(0,0,0,0);
}

/* Estado uploading — pulse suave */
.cobro-qr-btn.uploading[b-fohr8gzct0] {
    pointer-events: none;
    opacity: .7;
    border-color: var(--rg-warning);
    color: var(--rg-warning);
}
.cobro-qr-btn.uploading .spin[b-fohr8gzct0] {
    animation: rg-spin-b-fohr8gzct0 .9s linear infinite;
}
@keyframes rg-spin-b-fohr8gzct0 { to { transform: rotate(360deg); } }

/* Hover/active idéntico al QR para los labels nuevos */
label.cobro-qr-btn[b-fohr8gzct0] { cursor: pointer; user-select: none; }
label.cobro-qr-btn:active[b-fohr8gzct0] { transform: scale(0.96); }

/* Modal QR */
.cobro-qr-modal[b-fohr8gzct0] { max-width: 320px; }

.cobro-qr-img-wrap[b-fohr8gzct0] {
    display: flex;
    justify-content: center;
    padding: .5rem 0;
}

.cobro-qr-fotos-ok[b-fohr8gzct0] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .85rem;
    color: var(--rg-success);
    margin-top: .6rem;
    justify-content: center;
}

/* Galería de miniaturas dentro del modal QR */
.cobro-qr-galeria[b-fohr8gzct0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .4rem;
    margin-top: .75rem;
    width: 100%;
    max-height: 220px;
    overflow-y: auto;
    padding: .25rem;
}

.cobro-qr-thumb-btn[b-fohr8gzct0] {
    background: var(--rg-bg-subtle);
    border: 2px solid var(--rg-success);
    border-radius: 8px;
    padding: 0;
    overflow: hidden;
    cursor: pointer;
    aspect-ratio: 1 / 1;
    transition: transform .12s, box-shadow .12s;
}
.cobro-qr-thumb-btn:hover[b-fohr8gzct0] {
    transform: scale(1.04);
    box-shadow: 0 4px 12px rgba(22,163,74,.25);
}
.cobro-qr-thumb-btn img[b-fohr8gzct0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Lightbox — vista ampliada de la foto */
.cobro-lightbox[b-fohr8gzct0] {
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    max-width: 90vw;
    max-height: 90vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.cobro-lightbox img[b-fohr8gzct0] {
    max-width: 90vw;
    max-height: 90vh;
    display: block;
    object-fit: contain;
}
.cobro-lightbox-close[b-fohr8gzct0] {
    position: absolute;
    top: 8px; right: 8px;
    width: 38px; height: 38px;
    background: rgba(0,0,0,.6);
    color: #fff;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    z-index: 1;
}
.cobro-lightbox-close:hover[b-fohr8gzct0] { background: rgba(220,38,38,.85); }

/* Info fotos en el post-save */
.ps-fotos-info[b-fohr8gzct0] {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .8rem;
    color: var(--rg-success);
    background: rgba(22, 163, 74, .08);
    border: 1px solid rgba(22, 163, 74, .2);
    border-radius: 8px;
    padding: .4rem .65rem;
    margin-bottom: .65rem;
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-fohr8gzct0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fohr8gzct0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fohr8gzct0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fohr8gzct0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmconsultacliente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-v8eo4ii8t3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-v8eo4ii8t3 0.3s ease-out; }
@keyframes slideUp-b-v8eo4ii8t3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-v8eo4ii8t3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-v8eo4ii8t3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-v8eo4ii8t3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-v8eo4ii8t3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-v8eo4ii8t3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-v8eo4ii8t3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-v8eo4ii8t3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-v8eo4ii8t3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-v8eo4ii8t3] { filter: brightness(1.1); }
.btn-outline[b-v8eo4ii8t3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-v8eo4ii8t3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-v8eo4ii8t3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-v8eo4ii8t3] { filter: brightness(1.1); }
.btn-icon[b-v8eo4ii8t3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-v8eo4ii8t3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-v8eo4ii8t3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-v8eo4ii8t3] { color: #ef4444; }
.btn-delete:hover[b-v8eo4ii8t3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-v8eo4ii8t3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-v8eo4ii8t3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-v8eo4ii8t3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-v8eo4ii8t3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-v8eo4ii8t3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-v8eo4ii8t3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-v8eo4ii8t3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-v8eo4ii8t3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-v8eo4ii8t3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-v8eo4ii8t3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-v8eo4ii8t3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-v8eo4ii8t3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-v8eo4ii8t3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-v8eo4ii8t3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-v8eo4ii8t3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-v8eo4ii8t3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-v8eo4ii8t3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-v8eo4ii8t3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-v8eo4ii8t3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-v8eo4ii8t3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-v8eo4ii8t3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-v8eo4ii8t3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-v8eo4ii8t3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-v8eo4ii8t3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-v8eo4ii8t3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-v8eo4ii8t3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-v8eo4ii8t3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-v8eo4ii8t3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-v8eo4ii8t3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-v8eo4ii8t3] { display: block; }
.hide-on-cards[b-v8eo4ii8t3] { display: none !important; }
.show-on-cards[b-v8eo4ii8t3] { display: grid; }
.hide-on-grid[b-v8eo4ii8t3] { display: none !important; }

/* Badges */
.badge[b-v8eo4ii8t3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-v8eo4ii8t3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-v8eo4ii8t3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-v8eo4ii8t3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-v8eo4ii8t3] { text-align: center; }
.text-muted[b-v8eo4ii8t3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-v8eo4ii8t3], .crud-empty-state[b-v8eo4ii8t3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-v8eo4ii8t3] { font-size: 2rem; }
.crud-spinner[b-v8eo4ii8t3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-v8eo4ii8t3 0.6s linear infinite; }
.crud-spinner-sm[b-v8eo4ii8t3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-v8eo4ii8t3 0.6s linear infinite; }
@keyframes spin-b-v8eo4ii8t3 { to { transform: rotate(360deg); } }
.spin[b-v8eo4ii8t3] { animation: spin-b-v8eo4ii8t3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-v8eo4ii8t3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-v8eo4ii8t3 0.15s ease-out; }
.modal-container[b-v8eo4ii8t3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-v8eo4ii8t3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-v8eo4ii8t3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-v8eo4ii8t3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-v8eo4ii8t3] { max-width: 420px; }
@keyframes fadeIn-b-v8eo4ii8t3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-v8eo4ii8t3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-v8eo4ii8t3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-v8eo4ii8t3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-v8eo4ii8t3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-v8eo4ii8t3] { color: #dc2626; }
.modal-close[b-v8eo4ii8t3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-v8eo4ii8t3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-v8eo4ii8t3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-v8eo4ii8t3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-v8eo4ii8t3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-v8eo4ii8t3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-v8eo4ii8t3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-v8eo4ii8t3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-v8eo4ii8t3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-v8eo4ii8t3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-v8eo4ii8t3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-v8eo4ii8t3] { flex: 2; }
.form-group label[b-v8eo4ii8t3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-v8eo4ii8t3], .form-group select[b-v8eo4ii8t3], .form-textarea[b-v8eo4ii8t3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-v8eo4ii8t3], .form-group select:focus[b-v8eo4ii8t3], .form-textarea:focus[b-v8eo4ii8t3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-v8eo4ii8t3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-v8eo4ii8t3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-v8eo4ii8t3] { flex: 1; display: flex; align-items: center; }
.form-check[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-v8eo4ii8t3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-v8eo4ii8t3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-v8eo4ii8t3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-v8eo4ii8t3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-v8eo4ii8t3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-v8eo4ii8t3] { font-size: 3rem; }
.photo-placeholder span[b-v8eo4ii8t3] { font-size: 0.78rem; }
.photo-actions[b-v8eo4ii8t3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-v8eo4ii8t3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-v8eo4ii8t3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-v8eo4ii8t3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-v8eo4ii8t3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-v8eo4ii8t3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-v8eo4ii8t3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-v8eo4ii8t3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-v8eo4ii8t3] { filter: brightness(1.15); transform: scale(1.05); }
[b-v8eo4ii8t3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-v8eo4ii8t3] { padding: 0.75rem; }
    .crud-header[b-v8eo4ii8t3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-v8eo4ii8t3] { font-size: 1.1rem; }
    .btn-text[b-v8eo4ii8t3] { display: none; }
    .form-row[b-v8eo4ii8t3] { flex-direction: column; }
    .form-row-4[b-v8eo4ii8t3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-v8eo4ii8t3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-v8eo4ii8t3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-v8eo4ii8t3] { padding: 0.75rem; }
    .modal-tabs[b-v8eo4ii8t3] { overflow-x: auto; }
    .modal-tab[b-v8eo4ii8t3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-v8eo4ii8t3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-v8eo4ii8t3] { display: grid !important; }
    .crud-cards-wrapper[b-v8eo4ii8t3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-v8eo4ii8t3] { grid-template-columns: 1fr; }
    .card-details[b-v8eo4ii8t3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-v8eo4ii8t3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-v8eo4ii8t3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-v8eo4ii8t3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-v8eo4ii8t3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmconsultaclientev2.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-05sq3oxcvj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-05sq3oxcvj 0.3s ease-out; }
@keyframes slideUp-b-05sq3oxcvj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-05sq3oxcvj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-05sq3oxcvj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-05sq3oxcvj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-05sq3oxcvj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-05sq3oxcvj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-05sq3oxcvj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-05sq3oxcvj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-05sq3oxcvj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-05sq3oxcvj] { filter: brightness(1.1); }
.btn-outline[b-05sq3oxcvj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-05sq3oxcvj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-05sq3oxcvj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-05sq3oxcvj] { filter: brightness(1.1); }
.btn-icon[b-05sq3oxcvj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-05sq3oxcvj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-05sq3oxcvj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-05sq3oxcvj] { color: #ef4444; }
.btn-delete:hover[b-05sq3oxcvj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-05sq3oxcvj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-05sq3oxcvj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-05sq3oxcvj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-05sq3oxcvj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-05sq3oxcvj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-05sq3oxcvj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-05sq3oxcvj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-05sq3oxcvj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-05sq3oxcvj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-05sq3oxcvj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-05sq3oxcvj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-05sq3oxcvj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-05sq3oxcvj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-05sq3oxcvj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-05sq3oxcvj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-05sq3oxcvj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-05sq3oxcvj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-05sq3oxcvj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-05sq3oxcvj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-05sq3oxcvj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-05sq3oxcvj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-05sq3oxcvj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-05sq3oxcvj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-05sq3oxcvj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-05sq3oxcvj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-05sq3oxcvj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-05sq3oxcvj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-05sq3oxcvj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-05sq3oxcvj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-05sq3oxcvj] { display: block; }
.hide-on-cards[b-05sq3oxcvj] { display: none !important; }
.show-on-cards[b-05sq3oxcvj] { display: grid; }
.hide-on-grid[b-05sq3oxcvj] { display: none !important; }

/* Badges */
.badge[b-05sq3oxcvj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-05sq3oxcvj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-05sq3oxcvj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-05sq3oxcvj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-05sq3oxcvj] { text-align: center; }
.text-muted[b-05sq3oxcvj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-05sq3oxcvj], .crud-empty-state[b-05sq3oxcvj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-05sq3oxcvj] { font-size: 2rem; }
.crud-spinner[b-05sq3oxcvj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-05sq3oxcvj 0.6s linear infinite; }
.crud-spinner-sm[b-05sq3oxcvj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-05sq3oxcvj 0.6s linear infinite; }
@keyframes spin-b-05sq3oxcvj { to { transform: rotate(360deg); } }
.spin[b-05sq3oxcvj] { animation: spin-b-05sq3oxcvj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-05sq3oxcvj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-05sq3oxcvj 0.15s ease-out; }
.modal-container[b-05sq3oxcvj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-05sq3oxcvj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-05sq3oxcvj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-05sq3oxcvj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-05sq3oxcvj] { max-width: 420px; }
@keyframes fadeIn-b-05sq3oxcvj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-05sq3oxcvj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-05sq3oxcvj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-05sq3oxcvj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-05sq3oxcvj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-05sq3oxcvj] { color: #dc2626; }
.modal-close[b-05sq3oxcvj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-05sq3oxcvj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-05sq3oxcvj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-05sq3oxcvj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-05sq3oxcvj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-05sq3oxcvj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-05sq3oxcvj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-05sq3oxcvj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-05sq3oxcvj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-05sq3oxcvj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-05sq3oxcvj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-05sq3oxcvj] { flex: 2; }
.form-group label[b-05sq3oxcvj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-05sq3oxcvj], .form-group select[b-05sq3oxcvj], .form-textarea[b-05sq3oxcvj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-05sq3oxcvj], .form-group select:focus[b-05sq3oxcvj], .form-textarea:focus[b-05sq3oxcvj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-05sq3oxcvj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-05sq3oxcvj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-05sq3oxcvj] { flex: 1; display: flex; align-items: center; }
.form-check[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-05sq3oxcvj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-05sq3oxcvj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-05sq3oxcvj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-05sq3oxcvj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-05sq3oxcvj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-05sq3oxcvj] { font-size: 3rem; }
.photo-placeholder span[b-05sq3oxcvj] { font-size: 0.78rem; }
.photo-actions[b-05sq3oxcvj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-05sq3oxcvj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-05sq3oxcvj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-05sq3oxcvj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-05sq3oxcvj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-05sq3oxcvj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-05sq3oxcvj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-05sq3oxcvj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-05sq3oxcvj] { filter: brightness(1.15); transform: scale(1.05); }
[b-05sq3oxcvj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-05sq3oxcvj] { padding: 0.75rem; }
    .crud-header[b-05sq3oxcvj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-05sq3oxcvj] { font-size: 1.1rem; }
    .btn-text[b-05sq3oxcvj] { display: none; }
    .form-row[b-05sq3oxcvj] { flex-direction: column; }
    .form-row-4[b-05sq3oxcvj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-05sq3oxcvj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-05sq3oxcvj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-05sq3oxcvj] { padding: 0.75rem; }
    .modal-tabs[b-05sq3oxcvj] { overflow-x: auto; }
    .modal-tab[b-05sq3oxcvj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-05sq3oxcvj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-05sq3oxcvj] { display: grid !important; }
    .crud-cards-wrapper[b-05sq3oxcvj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-05sq3oxcvj] { grid-template-columns: 1fr; }
    .card-details[b-05sq3oxcvj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-05sq3oxcvj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-05sq3oxcvj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-05sq3oxcvj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-05sq3oxcvj] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmingreso_del_dia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1lxrvsxtuw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1lxrvsxtuw 0.3s ease-out; }
@keyframes slideUp-b-1lxrvsxtuw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1lxrvsxtuw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1lxrvsxtuw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1lxrvsxtuw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1lxrvsxtuw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1lxrvsxtuw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1lxrvsxtuw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1lxrvsxtuw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1lxrvsxtuw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1lxrvsxtuw] { filter: brightness(1.1); }
.btn-outline[b-1lxrvsxtuw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1lxrvsxtuw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1lxrvsxtuw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1lxrvsxtuw] { filter: brightness(1.1); }
.btn-icon[b-1lxrvsxtuw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1lxrvsxtuw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1lxrvsxtuw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1lxrvsxtuw] { color: #ef4444; }
.btn-delete:hover[b-1lxrvsxtuw] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1lxrvsxtuw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1lxrvsxtuw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1lxrvsxtuw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1lxrvsxtuw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1lxrvsxtuw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1lxrvsxtuw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1lxrvsxtuw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1lxrvsxtuw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1lxrvsxtuw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1lxrvsxtuw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1lxrvsxtuw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1lxrvsxtuw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1lxrvsxtuw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1lxrvsxtuw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1lxrvsxtuw] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1lxrvsxtuw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1lxrvsxtuw] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1lxrvsxtuw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1lxrvsxtuw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1lxrvsxtuw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1lxrvsxtuw] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1lxrvsxtuw] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1lxrvsxtuw] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1lxrvsxtuw] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1lxrvsxtuw] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1lxrvsxtuw] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1lxrvsxtuw] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1lxrvsxtuw] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1lxrvsxtuw] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1lxrvsxtuw] { display: block; }
.hide-on-cards[b-1lxrvsxtuw] { display: none !important; }
.show-on-cards[b-1lxrvsxtuw] { display: grid; }
.hide-on-grid[b-1lxrvsxtuw] { display: none !important; }

/* Badges */
.badge[b-1lxrvsxtuw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1lxrvsxtuw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1lxrvsxtuw] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1lxrvsxtuw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1lxrvsxtuw] { text-align: center; }
.text-muted[b-1lxrvsxtuw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1lxrvsxtuw], .crud-empty-state[b-1lxrvsxtuw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1lxrvsxtuw] { font-size: 2rem; }
.crud-spinner[b-1lxrvsxtuw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1lxrvsxtuw 0.6s linear infinite; }
.crud-spinner-sm[b-1lxrvsxtuw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1lxrvsxtuw 0.6s linear infinite; }
@keyframes spin-b-1lxrvsxtuw { to { transform: rotate(360deg); } }
.spin[b-1lxrvsxtuw] { animation: spin-b-1lxrvsxtuw 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1lxrvsxtuw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1lxrvsxtuw 0.15s ease-out; }
.modal-container[b-1lxrvsxtuw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1lxrvsxtuw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1lxrvsxtuw 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1lxrvsxtuw] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1lxrvsxtuw] { max-width: 420px; }
@keyframes fadeIn-b-1lxrvsxtuw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1lxrvsxtuw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1lxrvsxtuw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1lxrvsxtuw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1lxrvsxtuw] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1lxrvsxtuw] { color: #dc2626; }
.modal-close[b-1lxrvsxtuw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1lxrvsxtuw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1lxrvsxtuw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1lxrvsxtuw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1lxrvsxtuw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1lxrvsxtuw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1lxrvsxtuw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1lxrvsxtuw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1lxrvsxtuw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1lxrvsxtuw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1lxrvsxtuw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1lxrvsxtuw] { flex: 2; }
.form-group label[b-1lxrvsxtuw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1lxrvsxtuw], .form-group select[b-1lxrvsxtuw], .form-textarea[b-1lxrvsxtuw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1lxrvsxtuw], .form-group select:focus[b-1lxrvsxtuw], .form-textarea:focus[b-1lxrvsxtuw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1lxrvsxtuw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1lxrvsxtuw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1lxrvsxtuw] { flex: 1; display: flex; align-items: center; }
.form-check[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1lxrvsxtuw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1lxrvsxtuw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1lxrvsxtuw] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1lxrvsxtuw] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1lxrvsxtuw] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1lxrvsxtuw] { font-size: 3rem; }
.photo-placeholder span[b-1lxrvsxtuw] { font-size: 0.78rem; }
.photo-actions[b-1lxrvsxtuw] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1lxrvsxtuw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1lxrvsxtuw] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1lxrvsxtuw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1lxrvsxtuw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1lxrvsxtuw] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1lxrvsxtuw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1lxrvsxtuw] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1lxrvsxtuw] { filter: brightness(1.15); transform: scale(1.05); }
[b-1lxrvsxtuw] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1lxrvsxtuw] { padding: 0.75rem; }
    .crud-header[b-1lxrvsxtuw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1lxrvsxtuw] { font-size: 1.1rem; }
    .btn-text[b-1lxrvsxtuw] { display: none; }
    .form-row[b-1lxrvsxtuw] { flex-direction: column; }
    .form-row-4[b-1lxrvsxtuw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1lxrvsxtuw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1lxrvsxtuw] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1lxrvsxtuw] { padding: 0.75rem; }
    .modal-tabs[b-1lxrvsxtuw] { overflow-x: auto; }
    .modal-tab[b-1lxrvsxtuw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1lxrvsxtuw] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1lxrvsxtuw] { display: grid !important; }
    .crud-cards-wrapper[b-1lxrvsxtuw] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1lxrvsxtuw] { grid-template-columns: 1fr; }
    .card-details[b-1lxrvsxtuw] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1lxrvsxtuw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1lxrvsxtuw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1lxrvsxtuw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1lxrvsxtuw] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmreimpresioncxc.razor.rz.scp.css */
/* ============================================================
   Frmreimpresioncxc — Reimpresión CXC
   ============================================================ */

.crud-container[b-i3fx1oirjb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-i3fx1oirjb 0.3s ease-out; }
@keyframes slideUp-b-i3fx1oirjb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-i3fx1oirjb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-i3fx1oirjb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-i3fx1oirjb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-i3fx1oirjb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-i3fx1oirjb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-i3fx1oirjb] { display: flex; gap: 0.5rem; align-items: center; }

/* Toggle vista grid/tarjeta */
.cxc-view-toggle[b-i3fx1oirjb] { display: flex; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; }
.cxc-view-toggle .view-toggle[b-i3fx1oirjb] { border-radius: 0; border: none; border-right: 1px solid var(--rg-border, #e2e8f0); }
.cxc-view-toggle .view-toggle:last-child[b-i3fx1oirjb] { border-right: none; }
.cxc-view-toggle .view-toggle.active[b-i3fx1oirjb] { background: var(--rg-accent, #4f46e5); color: #fff; }

/* Buttons */
.btn-crud[b-i3fx1oirjb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-i3fx1oirjb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-i3fx1oirjb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-i3fx1oirjb] { filter: brightness(1.1); }
.btn-outline[b-i3fx1oirjb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-i3fx1oirjb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-i3fx1oirjb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-icon:disabled[b-i3fx1oirjb] { opacity: 0.5; cursor: not-allowed; }
.btn-print[b-i3fx1oirjb] { color: var(--rg-accent, #4f46e5); }
.btn-print:hover:not(:disabled)[b-i3fx1oirjb] { background: rgba(79, 70, 229, 0.1); }
.btn-send[b-i3fx1oirjb] { color: #10b981; }
.btn-send:hover[b-i3fx1oirjb] { background: rgba(16, 185, 129, 0.1); }

/* Alert */
.crud-alert[b-i3fx1oirjb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-i3fx1oirjb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-i3fx1oirjb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-i3fx1oirjb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-i3fx1oirjb] { background: rgba(16,185,129,0.12); color: #6ee7b7; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-i3fx1oirjb]   { background: rgba(239,68,68,0.12);  color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* Grid */
.crud-count[b-i3fx1oirjb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
.cxc-count-bar[b-i3fx1oirjb] { display: flex; justify-content: flex-end; padding: 0 0.25rem 0.35rem; }

.crud-grid-wrapper[b-i3fx1oirjb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 330px); }
.crud-table[b-i3fx1oirjb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-i3fx1oirjb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-i3fx1oirjb] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-i3fx1oirjb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-i3fx1oirjb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-i3fx1oirjb] { width: 80px; text-align: center !important; white-space: nowrap; }

/* ★ Columnas numéricas — alineación derecha OBLIGATORIA ★ */
.col-num[b-i3fx1oirjb] { text-align: right !important; }
.crud-table th.col-num[b-i3fx1oirjb] { text-align: right !important; }
.crud-table td.col-num[b-i3fx1oirjb] { text-align: right !important; }

/* Utilities */
.font-mono[b-i3fx1oirjb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Loading / Empty */
.crud-loading[b-i3fx1oirjb], .crud-empty-state[b-i3fx1oirjb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-i3fx1oirjb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-i3fx1oirjb 0.6s linear infinite; }
@keyframes spin-b-i3fx1oirjb { to { transform: rotate(360deg); } }
.spin[b-i3fx1oirjb] { animation: spin-b-i3fx1oirjb 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-i3fx1oirjb] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-i3fx1oirjb 0.15s ease-out; }
.modal-container[b-i3fx1oirjb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-i3fx1oirjb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-i3fx1oirjb 0.2s ease-out; }
.modal-sm[b-i3fx1oirjb] { max-width: 420px; }
@keyframes fadeIn-b-i3fx1oirjb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-i3fx1oirjb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-i3fx1oirjb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-i3fx1oirjb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.modal-close[b-i3fx1oirjb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-i3fx1oirjb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-i3fx1oirjb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-i3fx1oirjb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-group[b-i3fx1oirjb] { display: flex; flex-direction: column; gap: 0.15rem; margin-bottom: 0.75rem; }
.form-group label[b-i3fx1oirjb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-control[b-i3fx1oirjb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-control:focus[b-i3fx1oirjb] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* ── Filtros ─────────────────────────────────────────────────────── */
.cxc-filters[b-i3fx1oirjb] { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: flex-end; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 0.75rem; }
.cxc-filter-group[b-i3fx1oirjb] { display: flex; flex-direction: column; gap: 0.2rem; min-width: 140px; flex: 1; }
.cxc-filter-label[b-i3fx1oirjb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.cxc-filter-input[b-i3fx1oirjb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.cxc-filter-input:focus[b-i3fx1oirjb] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }
.cxc-filter-input:disabled[b-i3fx1oirjb] { opacity: 0.45; cursor: not-allowed; }
.cxc-filter-actions[b-i3fx1oirjb] { display: flex; gap: 0.4rem; align-items: flex-end; flex-shrink: 0; }

.cxc-filter-notice[b-i3fx1oirjb] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.75rem; color: var(--rg-text-secondary, #475569); background: rgba(79,70,229,0.07); border: 1px solid rgba(79,70,229,0.2); border-radius: 0.375rem; padding: 0.35rem 0.75rem; margin-bottom: 0.75rem; }

/* Columnas cliente */
.cxc-client-nombre[b-i3fx1oirjb] { font-weight: 600; color: var(--rg-text-primary, #1e293b); font-size: 0.8rem; }
.cxc-client-id[b-i3fx1oirjb] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); }
.cxc-ncf[b-i3fx1oirjb] { font-size: 0.72rem; color: var(--rg-text-secondary, #475569); }

/* ── Badges ─────────────────────────────────────────────────────── */
.badge[b-i3fx1oirjb] { display: inline-flex; align-items: center; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em; }

/* RC — Recibo de Caja (verde) */
.cxc-badge-RC[b-i3fx1oirjb] { background: rgba(16,185,129,0.12); color: #065f46; border: 1px solid rgba(16,185,129,0.3); }
[data-mode="dark"] .cxc-badge-RC[b-i3fx1oirjb] { color: #6ee7b7; }

/* ND — Nota de Débito (naranja) */
.cxc-badge-ND[b-i3fx1oirjb] { background: rgba(245,158,11,0.12); color: #92400e; border: 1px solid rgba(245,158,11,0.3); }
[data-mode="dark"] .cxc-badge-ND[b-i3fx1oirjb] { color: #fcd34d; }

/* NC — Nota de Crédito (azul) */
.cxc-badge-NC[b-i3fx1oirjb] { background: rgba(59,130,246,0.12); color: #1e40af; border: 1px solid rgba(59,130,246,0.3); }
[data-mode="dark"] .cxc-badge-NC[b-i3fx1oirjb] { color: #93c5fd; }

/* Fallback badges sin tipo */
.cxc-badge-[b-i3fx1oirjb] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }

/* ── Vista Tarjetas ──────────────────────────────────────────────── */
.crud-cards-wrapper[b-i3fx1oirjb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 330px); overflow-y: auto; padding: 0.25rem; }

.crud-card[b-i3fx1oirjb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-i3fx1oirjb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }

.cxc-card-top[b-i3fx1oirjb] { display: flex; justify-content: space-between; align-items: center; }
.cxc-card-num[b-i3fx1oirjb] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); letter-spacing: 0.04em; }

.cxc-card-cliente[b-i3fx1oirjb] { display: flex; flex-direction: column; gap: 0.1rem; }
.cxc-card-cliente strong[b-i3fx1oirjb] { font-size: 0.85rem; color: var(--rg-text-primary, #1e293b); }

.cxc-card-details[b-i3fx1oirjb] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; padding: 0.5rem 0; border-top: 1px solid var(--rg-border, #e2e8f0); border-bottom: 1px solid var(--rg-border, #e2e8f0); }
.cxc-card-detail[b-i3fx1oirjb] { display: flex; flex-direction: column; gap: 0.1rem; }
.cxc-card-label[b-i3fx1oirjb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.cxc-card-value[b-i3fx1oirjb] { font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }

/* Monto en tarjeta — siempre derecha */
.cxc-card-monto[b-i3fx1oirjb] { text-align: right; }
.cxc-monto-valor[b-i3fx1oirjb] { font-size: 1rem; font-weight: 700; color: var(--rg-accent, #4f46e5); }

.card-actions[b-i3fx1oirjb] { display: flex; justify-content: flex-end; gap: 0.35rem; margin-top: auto; }

/* ── Modal envío ─────────────────────────────────────────────────── */
.cxc-envio-info[b-i3fx1oirjb] { display: flex; align-items: center; gap: 0.5rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; padding: 0.5rem 0.75rem; margin-bottom: 1rem; font-size: 0.82rem; color: var(--rg-text-primary, #1e293b); }

/* ── Botón evidencia en grilla ── */
.btn-icon.btn-evidencia[b-i3fx1oirjb] { color: #2563eb; }
.btn-icon.btn-evidencia:hover[b-i3fx1oirjb] { background: rgba(37,99,235,0.1); }

/* ── Galería de evidencias en modal ── */
.cxc-evidencia-grid[b-i3fx1oirjb] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: .55rem;
    margin-top: .5rem;
}
.cxc-evidencia-item[b-i3fx1oirjb] {
    position: relative;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
    background: var(--rg-bg-card);
    border: 2px solid var(--rg-success);
    cursor: pointer;
    transition: transform .12s, box-shadow .12s;
}
.cxc-evidencia-item:hover[b-i3fx1oirjb] {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(22,163,74,.22);
}
.cxc-evidencia-item img[b-i3fx1oirjb] { width: 100%; height: 100%; object-fit: cover; display: block; }
.cxc-evidencia-meta[b-i3fx1oirjb] {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: 2px 6px;
    font-size: .65rem;
    color: #fff;
    background: linear-gradient(transparent, rgba(0,0,0,.65));
    text-align: right;
}

/* ── Lightbox ── */
.modal-backdrop-nested[b-i3fx1oirjb]  { z-index: 2000 !important; background: rgba(0,0,0,0.78) !important; }
.modal-container-nested[b-i3fx1oirjb] { z-index: 2001 !important; }

.cxc-lightbox[b-i3fx1oirjb] {
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    max-width: 92vw;
    max-height: 92vh;
    position: relative;
    display: flex; align-items: center; justify-content: center;
}
.cxc-lightbox img[b-i3fx1oirjb] {
    max-width: 92vw;
    max-height: 92vh;
    display: block;
    object-fit: contain;
}
.cxc-lightbox-close[b-i3fx1oirjb] {
    position: absolute;
    top: 8px; right: 8px;
    width: 38px; height: 38px;
    background: rgba(0,0,0,.6);
    color: #fff;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 50%;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
    z-index: 1;
}
.cxc-lightbox-close:hover[b-i3fx1oirjb] { background: rgba(220,38,38,.85); }

/* ── Bloque de evidencias dentro del modal Enviar ── */
.cxc-evid-checkbox[b-i3fx1oirjb] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    padding: .65rem .85rem;
    margin-top: .75rem;
}
.cxc-evid-label[b-i3fx1oirjb] {
    display: flex; align-items: center; gap: .55rem;
    font-size: .85rem;
    color: var(--rg-text-primary);
    cursor: pointer;
    margin: 0;
}
.cxc-evid-label input[type="checkbox"][b-i3fx1oirjb] { transform: scale(1.15); cursor: pointer; }
.cxc-evid-info[b-i3fx1oirjb] {
    margin-top: .5rem;
    padding: .5rem .65rem;
    border-radius: .375rem;
    font-size: .76rem;
    display: flex; align-items: flex-start; gap: .4rem;
}
.cxc-evid-info i[b-i3fx1oirjb] { flex-shrink: 0; margin-top: 1px; }
.cxc-evid-info.ok[b-i3fx1oirjb]   { background: rgba(22,163,74,.1);  color: #166534; border: 1px solid rgba(22,163,74,.3); }
.cxc-evid-info.warn[b-i3fx1oirjb] { background: rgba(217,119,6,.1);  color: #92400e; border: 1px solid rgba(217,119,6,.3); }
.cxc-evid-info.err[b-i3fx1oirjb]  { background: rgba(220,38,38,.1);  color: #991b1b; border: 1px solid rgba(220,38,38,.3); }

[data-mode="dark"] .cxc-evid-info.ok[b-i3fx1oirjb]   { color: #86efac; }
[data-mode="dark"] .cxc-evid-info.warn[b-i3fx1oirjb] { color: #fdba74; }
[data-mode="dark"] .cxc-evid-info.err[b-i3fx1oirjb]  { color: #fca5a5; }

.cxc-evid-mixto[b-i3fx1oirjb] {
    display: flex; align-items: center; gap: .5rem;
    font-size: .78rem; margin-top: .4rem; cursor: pointer;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-i3fx1oirjb] { padding: 0.75rem; }
    .cxc-filters[b-i3fx1oirjb] { flex-direction: column; }
    .cxc-filter-group[b-i3fx1oirjb] { min-width: 100%; }
    .btn-text[b-i3fx1oirjb] { display: none; }
    .modal-dialog[b-i3fx1oirjb] { width: 98%; }
    /* En móvil ocultar grid, mostrar tarjetas por defecto via JS */
    .crud-cards-wrapper[b-i3fx1oirjb] { grid-template-columns: 1fr; max-height: calc(100vh - 260px); }
}

@media (max-width: 480px) {
    .cxc-card-details[b-i3fx1oirjb] { grid-template-columns: repeat(2, 1fr); }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-i3fx1oirjb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-i3fx1oirjb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-i3fx1oirjb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-i3fx1oirjb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Cxc/Frmreportegestioncobros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fe5fmow2fn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fe5fmow2fn 0.3s ease-out; }
@keyframes slideUp-b-fe5fmow2fn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fe5fmow2fn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fe5fmow2fn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fe5fmow2fn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fe5fmow2fn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fe5fmow2fn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fe5fmow2fn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fe5fmow2fn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fe5fmow2fn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fe5fmow2fn] { filter: brightness(1.1); }
.btn-outline[b-fe5fmow2fn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fe5fmow2fn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fe5fmow2fn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fe5fmow2fn] { filter: brightness(1.1); }
.btn-icon[b-fe5fmow2fn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fe5fmow2fn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fe5fmow2fn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fe5fmow2fn] { color: #ef4444; }
.btn-delete:hover[b-fe5fmow2fn] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fe5fmow2fn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fe5fmow2fn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fe5fmow2fn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fe5fmow2fn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fe5fmow2fn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fe5fmow2fn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fe5fmow2fn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fe5fmow2fn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fe5fmow2fn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fe5fmow2fn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fe5fmow2fn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fe5fmow2fn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fe5fmow2fn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fe5fmow2fn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fe5fmow2fn] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fe5fmow2fn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fe5fmow2fn] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fe5fmow2fn] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fe5fmow2fn] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fe5fmow2fn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fe5fmow2fn] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fe5fmow2fn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fe5fmow2fn] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fe5fmow2fn] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fe5fmow2fn] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fe5fmow2fn] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fe5fmow2fn] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fe5fmow2fn] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fe5fmow2fn] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fe5fmow2fn] { display: block; }
.hide-on-cards[b-fe5fmow2fn] { display: none !important; }
.show-on-cards[b-fe5fmow2fn] { display: grid; }
.hide-on-grid[b-fe5fmow2fn] { display: none !important; }

/* Badges */
.badge[b-fe5fmow2fn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fe5fmow2fn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fe5fmow2fn] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fe5fmow2fn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fe5fmow2fn] { text-align: center; }
.text-muted[b-fe5fmow2fn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fe5fmow2fn], .crud-empty-state[b-fe5fmow2fn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fe5fmow2fn] { font-size: 2rem; }
.crud-spinner[b-fe5fmow2fn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fe5fmow2fn 0.6s linear infinite; }
.crud-spinner-sm[b-fe5fmow2fn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fe5fmow2fn 0.6s linear infinite; }
@keyframes spin-b-fe5fmow2fn { to { transform: rotate(360deg); } }
.spin[b-fe5fmow2fn] { animation: spin-b-fe5fmow2fn 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fe5fmow2fn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fe5fmow2fn 0.15s ease-out; }
.modal-container[b-fe5fmow2fn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fe5fmow2fn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fe5fmow2fn 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fe5fmow2fn] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fe5fmow2fn] { max-width: 420px; }
@keyframes fadeIn-b-fe5fmow2fn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fe5fmow2fn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fe5fmow2fn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fe5fmow2fn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fe5fmow2fn] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fe5fmow2fn] { color: #dc2626; }
.modal-close[b-fe5fmow2fn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fe5fmow2fn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fe5fmow2fn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fe5fmow2fn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fe5fmow2fn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fe5fmow2fn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fe5fmow2fn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fe5fmow2fn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fe5fmow2fn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fe5fmow2fn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fe5fmow2fn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fe5fmow2fn] { flex: 2; }
.form-group label[b-fe5fmow2fn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fe5fmow2fn], .form-group select[b-fe5fmow2fn], .form-textarea[b-fe5fmow2fn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fe5fmow2fn], .form-group select:focus[b-fe5fmow2fn], .form-textarea:focus[b-fe5fmow2fn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fe5fmow2fn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fe5fmow2fn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fe5fmow2fn] { flex: 1; display: flex; align-items: center; }
.form-check[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fe5fmow2fn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fe5fmow2fn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fe5fmow2fn] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fe5fmow2fn] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fe5fmow2fn] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fe5fmow2fn] { font-size: 3rem; }
.photo-placeholder span[b-fe5fmow2fn] { font-size: 0.78rem; }
.photo-actions[b-fe5fmow2fn] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fe5fmow2fn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fe5fmow2fn] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fe5fmow2fn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fe5fmow2fn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fe5fmow2fn] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fe5fmow2fn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fe5fmow2fn] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fe5fmow2fn] { filter: brightness(1.15); transform: scale(1.05); }
[b-fe5fmow2fn] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fe5fmow2fn] { padding: 0.75rem; }
    .crud-header[b-fe5fmow2fn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fe5fmow2fn] { font-size: 1.1rem; }
    .btn-text[b-fe5fmow2fn] { display: none; }
    .form-row[b-fe5fmow2fn] { flex-direction: column; }
    .form-row-4[b-fe5fmow2fn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fe5fmow2fn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fe5fmow2fn] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fe5fmow2fn] { padding: 0.75rem; }
    .modal-tabs[b-fe5fmow2fn] { overflow-x: auto; }
    .modal-tab[b-fe5fmow2fn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fe5fmow2fn] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fe5fmow2fn] { display: grid !important; }
    .crud-cards-wrapper[b-fe5fmow2fn] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fe5fmow2fn] { grid-template-columns: 1fr; }
    .card-details[b-fe5fmow2fn] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fe5fmow2fn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fe5fmow2fn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fe5fmow2fn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fe5fmow2fn] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dashboard.razor.rz.scp.css */
/* ============================================================
   🏠 Dashboard.razor.css — Estilos premium del panel de control
   🎯 Banner gradiente + Stats cards + Acciones rapidas
   📱 Responsive con grid adaptativo
   ============================================================ */

/* 📦 Contenedor principal del dashboard */
.dashboard[b-mmrm7ccala] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

/* ============================================================
   👋 BANNER DE BIENVENIDA — Gradiente con efecto decorativo
   ============================================================ */

.welcome-banner[b-mmrm7ccala] {
    background: var(--rg-gradient, linear-gradient(135deg, #1e3a8a 0%, #3b82f6 50%, #60a5fa 100%));
    border-radius: 16px;
    padding: 2rem 2.5rem;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.1),
        0 10px 15px -3px rgba(var(--rg-primary-rgb, 59, 130, 246), 0.2);
}

.welcome-banner-content[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.welcome-text h1[b-mmrm7ccala] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 0.375rem 0;
    line-height: 1.3;
}

.welcome-name[b-mmrm7ccala] {
    color: rgba(255, 255, 255, 0.9);
    font-weight: 400;
}

.welcome-text p[b-mmrm7ccala] {
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
    line-height: 1.5;
}

/* 🎨 Circulos decorativos del banner */
.welcome-illustration[b-mmrm7ccala] {
    position: relative;
    width: 120px;
    height: 120px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 🎯 Velocímetro clickeable — abre modal de acciones rápidas */
.welcome-illustration-clickable[b-mmrm7ccala] {
    cursor: pointer;
    transition: transform 0.2s ease;
}

.welcome-illustration-clickable:hover[b-mmrm7ccala] {
    transform: scale(1.05);
}

.welcome-illustration-clickable:hover > i[b-mmrm7ccala] {
    color: #ffd93d;
}

.welcome-config-hint[b-mmrm7ccala] {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 28px;
    height: 28px;
    background: #ffd93d;
    color: #1a3a5c;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
    z-index: 3;
    opacity: 0;
    transform: scale(0.7);
    transition: all 0.2s ease;
}

.welcome-illustration-clickable:hover .welcome-config-hint[b-mmrm7ccala] {
    opacity: 1;
    transform: scale(1);
}

.welcome-illustration > i[b-mmrm7ccala] {
    font-size: 2.5rem;
    color: rgba(255, 255, 255, 0.9);
    z-index: 2;
    position: relative;
}

.welcome-circle[b-mmrm7ccala] {
    position: absolute;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.1);
}

.welcome-circle.c1[b-mmrm7ccala] {
    width: 120px;
    height: 120px;
    animation: pulseCircle-b-mmrm7ccala 3s ease-in-out infinite;
}

.welcome-circle.c2[b-mmrm7ccala] {
    width: 88px;
    height: 88px;
    border-color: rgba(255, 255, 255, 0.15);
    animation: pulseCircle-b-mmrm7ccala 3s ease-in-out 0.5s infinite;
}

.welcome-circle.c3[b-mmrm7ccala] {
    width: 56px;
    height: 56px;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.2);
    animation: pulseCircle-b-mmrm7ccala 3s ease-in-out 1s infinite;
}

@keyframes pulseCircle-b-mmrm7ccala {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.7; }
}

/* ============================================================
   📊 TARJETAS DE ESTADO — Grid de 4 columnas
   ============================================================ */

.stats-grid[b-mmrm7ccala] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.stat-card[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 1.125rem 1.25rem;
    background: var(--rg-bg-card, #ffffff);
    border-radius: 14px;
    border: 1px solid var(--rg-border, rgba(0, 0, 0, 0.04));
    box-shadow: var(--rg-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.04));
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.stat-card:hover[b-mmrm7ccala] {
    transform: translateY(-2px);
    box-shadow: var(--rg-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));
}

.stat-card[b-mmrm7ccala]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    border-radius: 14px 14px 0 0;
}

.stat-icon[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 1.125rem;
    flex-shrink: 0;
}

.stat-icon.modules[b-mmrm7ccala] {
    background: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.1);
    color: var(--rg-primary, #3b82f6);
}
.stat-card:nth-child(1)[b-mmrm7ccala]::after { background: var(--rg-primary, #3b82f6); }

.stat-icon.security[b-mmrm7ccala] {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}
.stat-card:nth-child(2)[b-mmrm7ccala]::after { background: #10b981; }

.stat-icon.connection[b-mmrm7ccala] {
    background: rgba(139, 92, 246, 0.1);
    color: #8b5cf6;
}
.stat-card:nth-child(3)[b-mmrm7ccala]::after { background: #8b5cf6; }

.stat-icon.session[b-mmrm7ccala] {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}
.stat-card:nth-child(4)[b-mmrm7ccala]::after { background: #f59e0b; }

.stat-info[b-mmrm7ccala] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.stat-value[b-mmrm7ccala] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    line-height: 1.2;
}

.stat-label[b-mmrm7ccala] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #64748b);
    font-weight: 500;
}

.stat-badge[b-mmrm7ccala] {
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.25rem 0.625rem;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

.stat-badge.success[b-mmrm7ccala] {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

/* ============================================================
   🎯 CUERPO DEL DASHBOARD — Dos columnas
   ============================================================ */

.dashboard-body[b-mmrm7ccala] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 1.5rem;
}
/* Sin Acciones Rápidas: Información del Sistema centrada y compacta */
.dashboard-body.dashboard-body-single[b-mmrm7ccala] {
    grid-template-columns: minmax(0, 520px);
    justify-content: center;
}

/* 📋 Titulo de seccion */
.section-title[b-mmrm7ccala] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-mmrm7ccala] {
    color: var(--rg-primary, #3b82f6);
    font-size: 1rem;
}

/* ⚙️ Botón de configuración de acciones rápidas */
.qa-config-btn[b-mmrm7ccala] {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--rg-border, rgba(0, 0, 0, 0.08));
    color: var(--rg-text-secondary, #64748b);
    width: 30px;
    height: 30px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.18s ease;
    font-size: 0.85rem;
}

.qa-config-btn:hover[b-mmrm7ccala] {
    background: var(--rg-primary, #3b82f6);
    color: #ffffff;
    border-color: var(--rg-primary, #3b82f6);
    transform: rotate(30deg);
}

/* 💡 Empty state cuando aún no hay acciones rápidas configuradas */
.qa-empty-hint[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border: 2px dashed var(--rg-border, rgba(0, 0, 0, 0.12));
    border-radius: 12px;
    cursor: pointer;
    background: var(--rg-bg-card, #ffffff);
    transition: all 0.2s ease;
}

.qa-empty-hint:hover[b-mmrm7ccala] {
    border-color: var(--rg-primary, #3b82f6);
    background: rgba(59, 130, 246, 0.04);
}

.qa-empty-hint > i[b-mmrm7ccala] {
    font-size: 2rem;
    color: var(--rg-primary, #3b82f6);
    flex-shrink: 0;
}

.qa-empty-hint > div[b-mmrm7ccala] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.qa-empty-hint strong[b-mmrm7ccala] {
    font-size: 0.92rem;
    color: var(--rg-text-primary, #1e293b);
}

.qa-empty-hint span[b-mmrm7ccala] {
    font-size: 0.82rem;
    color: var(--rg-text-secondary, #64748b);
}

/* 🎯 Icono genérico para acciones rápidas del usuario (fallback) */
.qa-icon-user[b-mmrm7ccala] {
    background: rgba(26, 58, 92, 0.1);
    color: #1a3a5c;
}

/* ============================================================
   🎨 Paleta de 8 colores para las tarjetas de acciones rápidas
   ============================================================ */
.qa-card-colored[b-mmrm7ccala] {
    position: relative;
    overflow: hidden;
    border-left: 4px solid transparent;
}

.qa-card-colored[b-mmrm7ccala]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--qa-tint, rgba(59, 130, 246, 0.06)) 0%, transparent 60%);
    pointer-events: none;
    transition: opacity 0.25s ease;
    opacity: 0.9;
}

.qa-card-colored:hover[b-mmrm7ccala]::before {
    opacity: 1;
}

.qa-card-colored .qa-icon-user[b-mmrm7ccala] {
    background: var(--qa-icon-bg, rgba(59, 130, 246, 0.12));
    color: var(--qa-icon-fg, #3b82f6);
    box-shadow: 0 2px 6px var(--qa-icon-shadow, rgba(59, 130, 246, 0.18));
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.qa-card-colored:hover .qa-icon-user[b-mmrm7ccala] {
    transform: scale(1.08) rotate(-4deg);
    box-shadow: 0 4px 12px var(--qa-icon-shadow, rgba(59, 130, 246, 0.3));
}

.qa-card-colored .qa-title[b-mmrm7ccala] {
    color: var(--qa-title-color, var(--rg-text-primary, #1e293b));
    font-weight: 600;
}

.qa-card-colored .qa-arrow[b-mmrm7ccala] {
    color: var(--qa-icon-fg, #3b82f6);
}

/* 0 · Azul */
.qa-color-0[b-mmrm7ccala] {
    border-left-color: #3b82f6;
    --qa-tint: rgba(59, 130, 246, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(59, 130, 246, 0.35);
    --qa-title-color: #1e3a8a;
}

/* 1 · Verde */
.qa-color-1[b-mmrm7ccala] {
    border-left-color: #10b981;
    --qa-tint: rgba(16, 185, 129, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #34d399 0%, #10b981 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(16, 185, 129, 0.35);
    --qa-title-color: #065f46;
}

/* 2 · Violeta */
.qa-color-2[b-mmrm7ccala] {
    border-left-color: #8b5cf6;
    --qa-tint: rgba(139, 92, 246, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(139, 92, 246, 0.35);
    --qa-title-color: #5b21b6;
}

/* 3 · Naranja */
.qa-color-3[b-mmrm7ccala] {
    border-left-color: #f59e0b;
    --qa-tint: rgba(245, 158, 11, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(245, 158, 11, 0.35);
    --qa-title-color: #92400e;
}

/* 4 · Rosa */
.qa-color-4[b-mmrm7ccala] {
    border-left-color: #ec4899;
    --qa-tint: rgba(236, 72, 153, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #f472b6 0%, #ec4899 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(236, 72, 153, 0.35);
    --qa-title-color: #9d174d;
}

/* 5 · Cian */
.qa-color-5[b-mmrm7ccala] {
    border-left-color: #06b6d4;
    --qa-tint: rgba(6, 182, 212, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #22d3ee 0%, #06b6d4 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(6, 182, 212, 0.35);
    --qa-title-color: #155e75;
}

/* 6 · Rojo */
.qa-color-6[b-mmrm7ccala] {
    border-left-color: #ef4444;
    --qa-tint: rgba(239, 68, 68, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #f87171 0%, #ef4444 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(239, 68, 68, 0.35);
    --qa-title-color: #991b1b;
}

/* 7 · Índigo */
.qa-color-7[b-mmrm7ccala] {
    border-left-color: #6366f1;
    --qa-tint: rgba(99, 102, 241, 0.08);
    --qa-icon-bg: linear-gradient(135deg, #818cf8 0%, #6366f1 100%);
    --qa-icon-fg: #ffffff;
    --qa-icon-shadow: rgba(99, 102, 241, 0.35);
    --qa-title-color: #3730a3;
}

/* Asegurar que el contenido quede arriba del ::before */
.qa-card-colored > *[b-mmrm7ccala] {
    position: relative;
    z-index: 1;
}

/* Hover refuerza el borde izquierdo */
.qa-card-colored:hover[b-mmrm7ccala] {
    border-left-width: 5px;
}

/* ============================================================
   🎯 ACCIONES RAPIDAS — Tarjetas de acceso directo
   ============================================================ */

.quick-actions-grid[b-mmrm7ccala] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.quick-action-card[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, rgba(0, 0, 0, 0.04));
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    width: 100%;
    box-shadow: var(--rg-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.03));
}

.quick-action-card:hover[b-mmrm7ccala] {
    background: var(--rg-bg-hover, #fafbfc);
    border-color: var(--rg-primary, #3b82f6);
    box-shadow: 0 2px 8px rgba(var(--rg-primary-rgb, 59, 130, 246), 0.12);
    transform: translateX(4px);
}

.quick-action-card:hover .qa-arrow[b-mmrm7ccala] {
    opacity: 1;
    transform: translateX(0);
    color: var(--rg-primary, #3b82f6);
}

.qa-icon[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 1.125rem;
    flex-shrink: 0;
}

.qa-icon.clients[b-mmrm7ccala] {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.qa-icon.accounting[b-mmrm7ccala] {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

.qa-icon.loans[b-mmrm7ccala] {
    background: rgba(139, 92, 246, 0.1);
    color: #8b5cf6;
}

.qa-icon.reports[b-mmrm7ccala] {
    background: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}

.qa-text[b-mmrm7ccala] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.qa-title[b-mmrm7ccala] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    line-height: 1.3;
}

.qa-desc[b-mmrm7ccala] {
    font-size: 0.75rem;
    color: var(--rg-text-faint, #94a3b8);
    line-height: 1.3;
}

.qa-arrow[b-mmrm7ccala] {
    font-size: 0.875rem;
    color: var(--rg-text-faint, #cbd5e1);
    opacity: 0;
    transform: translateX(-8px);
    transition: all 0.2s ease;
    flex-shrink: 0;
}

/* ============================================================
   🏢 INFORMACION DEL SISTEMA — Panel lateral
   ============================================================ */

.system-info-card[b-mmrm7ccala] {
    background: var(--rg-bg-card, #ffffff);
    border-radius: 14px;
    border: 1px solid var(--rg-border, rgba(0, 0, 0, 0.04));
    overflow: hidden;
    box-shadow: var(--rg-shadow-sm, 0 1px 3px rgba(0, 0, 0, 0.04));
}

.info-row[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: background 0.15s ease;
}

.info-row:last-child[b-mmrm7ccala] {
    border-bottom: none;
}

.info-row:hover[b-mmrm7ccala] {
    background: var(--rg-bg-hover, #f8fafc);
}

.info-label[b-mmrm7ccala] {
    font-size: 0.8125rem;
    color: var(--rg-text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

.info-label i[b-mmrm7ccala] {
    font-size: 0.875rem;
    color: var(--rg-text-faint, #94a3b8);
}

.info-value[b-mmrm7ccala] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    text-align: right;
    max-width: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.info-divider[b-mmrm7ccala] {
    height: 1px;
    background: var(--rg-border);
    margin: 0.25rem 0;
}

/* 🟢 Punto de estado activo */
.status-dot[b-mmrm7ccala] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.active[b-mmrm7ccala] {
    background: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
    animation: statusPulse-b-mmrm7ccala 2s ease-in-out infinite;
}

@keyframes statusPulse-b-mmrm7ccala {
    0%, 100% { box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2); }
    50% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0.1); }
}

/* 📋 Indicacion de navegacion */
.nav-hint[b-mmrm7ccala] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 1rem 1.25rem;
    background: var(--rg-gradient-soft, linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%));
    border-radius: 12px;
    margin-top: 1rem;
    border: 1px solid rgba(var(--rg-primary-rgb, 59, 130, 246), 0.1);
}

.nav-hint i[b-mmrm7ccala] {
    color: var(--rg-primary, #3b82f6);
    font-size: 1rem;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.nav-hint span[b-mmrm7ccala] {
    font-size: 0.8125rem;
    color: #475569;
    line-height: 1.5;
}

/* ============================================================
   📝 FOOTER — Version y derechos
   ============================================================ */

.dashboard-footer[b-mmrm7ccala] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 0;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.75rem;
    color: var(--rg-text-faint, #94a3b8);
}

/* ============================================================
   📱 RESPONSIVE — Tablet
   ============================================================ */

@media (max-width: 1024px) {
    .stats-grid[b-mmrm7ccala] {
        grid-template-columns: repeat(2, 1fr);
    }

    .dashboard-body[b-mmrm7ccala] {
        grid-template-columns: 1fr;
    }

    .welcome-banner[b-mmrm7ccala] {
        padding: 1.75rem 2rem;
    }

    .welcome-text h1[b-mmrm7ccala] {
        font-size: 1.25rem;
    }
}

/* ============================================================
   📱 RESPONSIVE — Movil
   ============================================================ */

@media (max-width: 768px) {
    .dashboard[b-mmrm7ccala] {
        gap: 1rem;
    }

    .stats-grid[b-mmrm7ccala] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }

    .stat-card[b-mmrm7ccala] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.625rem;
        padding: 1rem;
    }

    .stat-badge[b-mmrm7ccala] {
        align-self: flex-end;
    }

    .welcome-banner[b-mmrm7ccala] {
        padding: 1.5rem;
    }

    .welcome-illustration[b-mmrm7ccala] {
        display: none;
    }

    .welcome-text h1[b-mmrm7ccala] {
        font-size: 1.125rem;
    }

    .welcome-text p[b-mmrm7ccala] {
        font-size: 0.8125rem;
    }

    .quick-actions-grid[b-mmrm7ccala] {
        gap: 0.5rem;
    }

    .dashboard-footer[b-mmrm7ccala] {
        flex-direction: column;
        gap: 0.25rem;
        text-align: center;
    }
}

/* ============================================================
   📱 RESPONSIVE — Movil pequeno
   ============================================================ */

@media (max-width: 480px) {
    .stats-grid[b-mmrm7ccala] {
        grid-template-columns: 1fr;
    }

    .stat-card[b-mmrm7ccala] {
        flex-direction: row;
        align-items: center;
    }

    .stat-badge[b-mmrm7ccala] {
        align-self: center;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdntgrupo_familia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8aya46rfm0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8aya46rfm0 0.3s ease-out; }
@keyframes slideUp-b-8aya46rfm0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8aya46rfm0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8aya46rfm0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8aya46rfm0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8aya46rfm0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8aya46rfm0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8aya46rfm0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8aya46rfm0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8aya46rfm0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8aya46rfm0] { filter: brightness(1.1); }
.btn-outline[b-8aya46rfm0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8aya46rfm0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8aya46rfm0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8aya46rfm0] { filter: brightness(1.1); }
.btn-icon[b-8aya46rfm0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8aya46rfm0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8aya46rfm0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8aya46rfm0] { color: #ef4444; }
.btn-delete:hover[b-8aya46rfm0] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8aya46rfm0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8aya46rfm0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8aya46rfm0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8aya46rfm0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8aya46rfm0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8aya46rfm0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8aya46rfm0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8aya46rfm0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8aya46rfm0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8aya46rfm0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8aya46rfm0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8aya46rfm0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8aya46rfm0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8aya46rfm0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8aya46rfm0] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8aya46rfm0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8aya46rfm0] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8aya46rfm0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8aya46rfm0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8aya46rfm0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8aya46rfm0] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8aya46rfm0] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8aya46rfm0] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8aya46rfm0] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8aya46rfm0] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8aya46rfm0] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8aya46rfm0] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8aya46rfm0] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8aya46rfm0] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8aya46rfm0] { display: block; }
.hide-on-cards[b-8aya46rfm0] { display: none !important; }
.show-on-cards[b-8aya46rfm0] { display: grid; }
.hide-on-grid[b-8aya46rfm0] { display: none !important; }

/* Badges */
.badge[b-8aya46rfm0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8aya46rfm0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8aya46rfm0] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8aya46rfm0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8aya46rfm0] { text-align: center; }
.text-muted[b-8aya46rfm0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8aya46rfm0], .crud-empty-state[b-8aya46rfm0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8aya46rfm0] { font-size: 2rem; }
.crud-spinner[b-8aya46rfm0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8aya46rfm0 0.6s linear infinite; }
.crud-spinner-sm[b-8aya46rfm0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8aya46rfm0 0.6s linear infinite; }
@keyframes spin-b-8aya46rfm0 { to { transform: rotate(360deg); } }
.spin[b-8aya46rfm0] { animation: spin-b-8aya46rfm0 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8aya46rfm0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8aya46rfm0 0.15s ease-out; }
.modal-container[b-8aya46rfm0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8aya46rfm0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8aya46rfm0 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8aya46rfm0] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8aya46rfm0] { max-width: 420px; }
@keyframes fadeIn-b-8aya46rfm0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8aya46rfm0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8aya46rfm0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8aya46rfm0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8aya46rfm0] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8aya46rfm0] { color: #dc2626; }
.modal-close[b-8aya46rfm0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8aya46rfm0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8aya46rfm0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8aya46rfm0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8aya46rfm0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8aya46rfm0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8aya46rfm0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8aya46rfm0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8aya46rfm0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8aya46rfm0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8aya46rfm0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8aya46rfm0] { flex: 2; }
.form-group label[b-8aya46rfm0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8aya46rfm0], .form-group select[b-8aya46rfm0], .form-textarea[b-8aya46rfm0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8aya46rfm0], .form-group select:focus[b-8aya46rfm0], .form-textarea:focus[b-8aya46rfm0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8aya46rfm0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8aya46rfm0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8aya46rfm0] { flex: 1; display: flex; align-items: center; }
.form-check[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8aya46rfm0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8aya46rfm0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8aya46rfm0] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8aya46rfm0] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8aya46rfm0] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8aya46rfm0] { font-size: 3rem; }
.photo-placeholder span[b-8aya46rfm0] { font-size: 0.78rem; }
.photo-actions[b-8aya46rfm0] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8aya46rfm0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8aya46rfm0] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8aya46rfm0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8aya46rfm0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8aya46rfm0] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8aya46rfm0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8aya46rfm0] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8aya46rfm0] { filter: brightness(1.15); transform: scale(1.05); }
[b-8aya46rfm0] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8aya46rfm0] { padding: 0.75rem; }
    .crud-header[b-8aya46rfm0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8aya46rfm0] { font-size: 1.1rem; }
    .btn-text[b-8aya46rfm0] { display: none; }
    .form-row[b-8aya46rfm0] { flex-direction: column; }
    .form-row-4[b-8aya46rfm0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8aya46rfm0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8aya46rfm0] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8aya46rfm0] { padding: 0.75rem; }
    .modal-tabs[b-8aya46rfm0] { overflow-x: auto; }
    .modal-tab[b-8aya46rfm0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8aya46rfm0] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8aya46rfm0] { display: grid !important; }
    .crud-cards-wrapper[b-8aya46rfm0] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8aya46rfm0] { grid-template-columns: 1fr; }
    .card-details[b-8aya46rfm0] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8aya46rfm0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8aya46rfm0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8aya46rfm0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8aya46rfm0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdntreimpresionfactura.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-o6j5exi86d] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-o6j5exi86d 0.3s ease-out; }
@keyframes slideUp-b-o6j5exi86d { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-o6j5exi86d] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-o6j5exi86d] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-o6j5exi86d] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-o6j5exi86d] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-o6j5exi86d] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-o6j5exi86d] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-o6j5exi86d] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-o6j5exi86d] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-o6j5exi86d] { filter: brightness(1.1); }
.btn-outline[b-o6j5exi86d] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-o6j5exi86d] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-o6j5exi86d] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-o6j5exi86d] { filter: brightness(1.1); }
.btn-icon[b-o6j5exi86d] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-o6j5exi86d] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-o6j5exi86d] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-o6j5exi86d] { color: #ef4444; }
.btn-delete:hover[b-o6j5exi86d] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-o6j5exi86d] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-o6j5exi86d] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-o6j5exi86d] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-o6j5exi86d] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-o6j5exi86d] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-o6j5exi86d] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-o6j5exi86d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-o6j5exi86d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-o6j5exi86d] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-o6j5exi86d] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-o6j5exi86d] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-o6j5exi86d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-o6j5exi86d] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-o6j5exi86d] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-o6j5exi86d] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-o6j5exi86d] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-o6j5exi86d] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-o6j5exi86d] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-o6j5exi86d] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-o6j5exi86d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-o6j5exi86d] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-o6j5exi86d] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-o6j5exi86d] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-o6j5exi86d] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-o6j5exi86d] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-o6j5exi86d] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-o6j5exi86d] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-o6j5exi86d] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-o6j5exi86d] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-o6j5exi86d] { display: block; }
.hide-on-cards[b-o6j5exi86d] { display: none !important; }
.show-on-cards[b-o6j5exi86d] { display: grid; }
.hide-on-grid[b-o6j5exi86d] { display: none !important; }

/* Badges */
.badge[b-o6j5exi86d] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-o6j5exi86d] { background: #ecfdf5; color: #065f46; }
.badge-no[b-o6j5exi86d] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-o6j5exi86d] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-o6j5exi86d] { text-align: center; }
.text-muted[b-o6j5exi86d] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-o6j5exi86d], .crud-empty-state[b-o6j5exi86d] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-o6j5exi86d] { font-size: 2rem; }
.crud-spinner[b-o6j5exi86d] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-o6j5exi86d 0.6s linear infinite; }
.crud-spinner-sm[b-o6j5exi86d] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-o6j5exi86d 0.6s linear infinite; }
@keyframes spin-b-o6j5exi86d { to { transform: rotate(360deg); } }
.spin[b-o6j5exi86d] { animation: spin-b-o6j5exi86d 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-o6j5exi86d] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-o6j5exi86d 0.15s ease-out; }
.modal-container[b-o6j5exi86d] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-o6j5exi86d] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-o6j5exi86d 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-o6j5exi86d] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-o6j5exi86d] { max-width: 420px; }
@keyframes fadeIn-b-o6j5exi86d { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-o6j5exi86d { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-o6j5exi86d] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-o6j5exi86d] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-o6j5exi86d] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-o6j5exi86d] { color: #dc2626; }
.modal-close[b-o6j5exi86d] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-o6j5exi86d] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-o6j5exi86d] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-o6j5exi86d] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-o6j5exi86d] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-o6j5exi86d] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-o6j5exi86d] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-o6j5exi86d] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-o6j5exi86d] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-o6j5exi86d] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-o6j5exi86d] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-o6j5exi86d] { flex: 2; }
.form-group label[b-o6j5exi86d] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-o6j5exi86d], .form-group select[b-o6j5exi86d], .form-textarea[b-o6j5exi86d] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-o6j5exi86d], .form-group select:focus[b-o6j5exi86d], .form-textarea:focus[b-o6j5exi86d] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-o6j5exi86d] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-o6j5exi86d] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-o6j5exi86d] { flex: 1; display: flex; align-items: center; }
.form-check[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-o6j5exi86d] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-o6j5exi86d] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-o6j5exi86d] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-o6j5exi86d] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-o6j5exi86d] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-o6j5exi86d] { font-size: 3rem; }
.photo-placeholder span[b-o6j5exi86d] { font-size: 0.78rem; }
.photo-actions[b-o6j5exi86d] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-o6j5exi86d] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-o6j5exi86d] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-o6j5exi86d] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-o6j5exi86d] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-o6j5exi86d] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-o6j5exi86d] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-o6j5exi86d] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-o6j5exi86d] { filter: brightness(1.15); transform: scale(1.05); }
[b-o6j5exi86d] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-o6j5exi86d] { padding: 0.75rem; }
    .crud-header[b-o6j5exi86d] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-o6j5exi86d] { font-size: 1.1rem; }
    .btn-text[b-o6j5exi86d] { display: none; }
    .form-row[b-o6j5exi86d] { flex-direction: column; }
    .form-row-4[b-o6j5exi86d] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-o6j5exi86d] { width: 98%; max-height: 95vh; }
    .modal-lg[b-o6j5exi86d] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-o6j5exi86d] { padding: 0.75rem; }
    .modal-tabs[b-o6j5exi86d] { overflow-x: auto; }
    .modal-tab[b-o6j5exi86d] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-o6j5exi86d] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-o6j5exi86d] { display: grid !important; }
    .crud-cards-wrapper[b-o6j5exi86d] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-o6j5exi86d] { grid-template-columns: 1fr; }
    .card-details[b-o6j5exi86d] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-o6j5exi86d] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-o6j5exi86d] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-o6j5exi86d] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-o6j5exi86d] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdnt_abonodental.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7it95bvhge] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7it95bvhge 0.3s ease-out; }
@keyframes slideUp-b-7it95bvhge { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7it95bvhge] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7it95bvhge] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7it95bvhge] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7it95bvhge] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7it95bvhge] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7it95bvhge] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7it95bvhge] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7it95bvhge] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7it95bvhge] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7it95bvhge] { filter: brightness(1.1); }
.btn-outline[b-7it95bvhge] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7it95bvhge] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7it95bvhge] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7it95bvhge] { filter: brightness(1.1); }
.btn-icon[b-7it95bvhge] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7it95bvhge] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7it95bvhge] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7it95bvhge] { color: #ef4444; }
.btn-delete:hover[b-7it95bvhge] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7it95bvhge] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7it95bvhge] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7it95bvhge] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7it95bvhge] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7it95bvhge] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7it95bvhge] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7it95bvhge] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7it95bvhge] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7it95bvhge] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7it95bvhge] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7it95bvhge] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7it95bvhge] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7it95bvhge] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7it95bvhge] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7it95bvhge] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7it95bvhge] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7it95bvhge] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7it95bvhge] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7it95bvhge] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7it95bvhge] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7it95bvhge] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7it95bvhge] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7it95bvhge] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7it95bvhge] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7it95bvhge] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7it95bvhge] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7it95bvhge] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7it95bvhge] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7it95bvhge] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7it95bvhge] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7it95bvhge] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7it95bvhge] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7it95bvhge] { display: block; }
.hide-on-cards[b-7it95bvhge] { display: none !important; }
.show-on-cards[b-7it95bvhge] { display: grid; }
.hide-on-grid[b-7it95bvhge] { display: none !important; }

/* Badges */
.badge[b-7it95bvhge] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7it95bvhge] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7it95bvhge] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7it95bvhge] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7it95bvhge] { text-align: center; }
.text-muted[b-7it95bvhge] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7it95bvhge], .crud-empty-state[b-7it95bvhge] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7it95bvhge] { font-size: 2rem; }
.crud-spinner[b-7it95bvhge] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7it95bvhge 0.6s linear infinite; }
.crud-spinner-sm[b-7it95bvhge] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7it95bvhge 0.6s linear infinite; }
@keyframes spin-b-7it95bvhge { to { transform: rotate(360deg); } }
.spin[b-7it95bvhge] { animation: spin-b-7it95bvhge 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7it95bvhge] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7it95bvhge 0.15s ease-out; }
.modal-container[b-7it95bvhge] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7it95bvhge] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7it95bvhge 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7it95bvhge] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7it95bvhge] { max-width: 420px; }
@keyframes fadeIn-b-7it95bvhge { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7it95bvhge { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7it95bvhge] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7it95bvhge] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7it95bvhge] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7it95bvhge] { color: #dc2626; }
.modal-close[b-7it95bvhge] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7it95bvhge] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7it95bvhge] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7it95bvhge] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7it95bvhge] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7it95bvhge] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7it95bvhge] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7it95bvhge] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7it95bvhge] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7it95bvhge] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7it95bvhge] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7it95bvhge] { flex: 2; }
.form-group label[b-7it95bvhge] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7it95bvhge], .form-group select[b-7it95bvhge], .form-textarea[b-7it95bvhge] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7it95bvhge], .form-group select:focus[b-7it95bvhge], .form-textarea:focus[b-7it95bvhge] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7it95bvhge] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7it95bvhge] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7it95bvhge] { flex: 1; display: flex; align-items: center; }
.form-check[b-7it95bvhge] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7it95bvhge] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7it95bvhge] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7it95bvhge] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7it95bvhge] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7it95bvhge] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7it95bvhge] { font-size: 3rem; }
.photo-placeholder span[b-7it95bvhge] { font-size: 0.78rem; }
.photo-actions[b-7it95bvhge] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7it95bvhge] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7it95bvhge] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7it95bvhge] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7it95bvhge] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7it95bvhge] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7it95bvhge] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7it95bvhge] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7it95bvhge] { filter: brightness(1.15); transform: scale(1.05); }
[b-7it95bvhge] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7it95bvhge] { padding: 0.75rem; }
    .crud-header[b-7it95bvhge] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7it95bvhge] { font-size: 1.1rem; }
    .btn-text[b-7it95bvhge] { display: none; }
    .form-row[b-7it95bvhge] { flex-direction: column; }
    .form-row-4[b-7it95bvhge] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7it95bvhge] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7it95bvhge] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7it95bvhge] { padding: 0.75rem; }
    .modal-tabs[b-7it95bvhge] { overflow-x: auto; }
    .modal-tab[b-7it95bvhge] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7it95bvhge] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7it95bvhge] { display: grid !important; }
    .crud-cards-wrapper[b-7it95bvhge] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7it95bvhge] { grid-template-columns: 1fr; }
    .card-details[b-7it95bvhge] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7it95bvhge] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7it95bvhge] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7it95bvhge] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7it95bvhge] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdnt_facturacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hko177zi6m] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hko177zi6m 0.3s ease-out; }
@keyframes slideUp-b-hko177zi6m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hko177zi6m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hko177zi6m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hko177zi6m] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hko177zi6m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hko177zi6m] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hko177zi6m] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hko177zi6m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hko177zi6m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hko177zi6m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hko177zi6m] { filter: brightness(1.1); }
.btn-outline[b-hko177zi6m] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hko177zi6m] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hko177zi6m] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hko177zi6m] { filter: brightness(1.1); }
.btn-icon[b-hko177zi6m] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hko177zi6m] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hko177zi6m] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hko177zi6m] { color: #ef4444; }
.btn-delete:hover[b-hko177zi6m] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hko177zi6m] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hko177zi6m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hko177zi6m] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hko177zi6m] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hko177zi6m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hko177zi6m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hko177zi6m] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hko177zi6m] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hko177zi6m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hko177zi6m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hko177zi6m] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hko177zi6m] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hko177zi6m] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hko177zi6m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hko177zi6m] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hko177zi6m] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hko177zi6m] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hko177zi6m] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hko177zi6m] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hko177zi6m] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hko177zi6m] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hko177zi6m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hko177zi6m] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hko177zi6m] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hko177zi6m] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hko177zi6m] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hko177zi6m] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hko177zi6m] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hko177zi6m] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hko177zi6m] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hko177zi6m] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hko177zi6m] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hko177zi6m] { display: block; }
.hide-on-cards[b-hko177zi6m] { display: none !important; }
.show-on-cards[b-hko177zi6m] { display: grid; }
.hide-on-grid[b-hko177zi6m] { display: none !important; }

/* Badges */
.badge[b-hko177zi6m] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hko177zi6m] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hko177zi6m] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hko177zi6m] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hko177zi6m] { text-align: center; }
.text-muted[b-hko177zi6m] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hko177zi6m], .crud-empty-state[b-hko177zi6m] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hko177zi6m] { font-size: 2rem; }
.crud-spinner[b-hko177zi6m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hko177zi6m 0.6s linear infinite; }
.crud-spinner-sm[b-hko177zi6m] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hko177zi6m 0.6s linear infinite; }
@keyframes spin-b-hko177zi6m { to { transform: rotate(360deg); } }
.spin[b-hko177zi6m] { animation: spin-b-hko177zi6m 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hko177zi6m] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hko177zi6m 0.15s ease-out; }
.modal-container[b-hko177zi6m] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hko177zi6m] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hko177zi6m 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hko177zi6m] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hko177zi6m] { max-width: 420px; }
@keyframes fadeIn-b-hko177zi6m { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hko177zi6m { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hko177zi6m] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hko177zi6m] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hko177zi6m] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hko177zi6m] { color: #dc2626; }
.modal-close[b-hko177zi6m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hko177zi6m] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hko177zi6m] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hko177zi6m] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hko177zi6m] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hko177zi6m] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hko177zi6m] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hko177zi6m] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hko177zi6m] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hko177zi6m] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hko177zi6m] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hko177zi6m] { flex: 2; }
.form-group label[b-hko177zi6m] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hko177zi6m], .form-group select[b-hko177zi6m], .form-textarea[b-hko177zi6m] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hko177zi6m], .form-group select:focus[b-hko177zi6m], .form-textarea:focus[b-hko177zi6m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hko177zi6m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hko177zi6m] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hko177zi6m] { flex: 1; display: flex; align-items: center; }
.form-check[b-hko177zi6m] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hko177zi6m] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hko177zi6m] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hko177zi6m] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hko177zi6m] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hko177zi6m] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hko177zi6m] { font-size: 3rem; }
.photo-placeholder span[b-hko177zi6m] { font-size: 0.78rem; }
.photo-actions[b-hko177zi6m] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hko177zi6m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hko177zi6m] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hko177zi6m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hko177zi6m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hko177zi6m] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hko177zi6m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hko177zi6m] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hko177zi6m] { filter: brightness(1.15); transform: scale(1.05); }
[b-hko177zi6m] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hko177zi6m] { padding: 0.75rem; }
    .crud-header[b-hko177zi6m] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hko177zi6m] { font-size: 1.1rem; }
    .btn-text[b-hko177zi6m] { display: none; }
    .form-row[b-hko177zi6m] { flex-direction: column; }
    .form-row-4[b-hko177zi6m] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hko177zi6m] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hko177zi6m] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hko177zi6m] { padding: 0.75rem; }
    .modal-tabs[b-hko177zi6m] { overflow-x: auto; }
    .modal-tab[b-hko177zi6m] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hko177zi6m] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hko177zi6m] { display: grid !important; }
    .crud-cards-wrapper[b-hko177zi6m] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hko177zi6m] { grid-template-columns: 1fr; }
    .card-details[b-hko177zi6m] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hko177zi6m] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hko177zi6m] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hko177zi6m] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hko177zi6m] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdnt_pieza.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-j24ivgjo3l] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-j24ivgjo3l 0.3s ease-out; }
@keyframes slideUp-b-j24ivgjo3l { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-j24ivgjo3l] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-j24ivgjo3l] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-j24ivgjo3l] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-j24ivgjo3l] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-j24ivgjo3l] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-j24ivgjo3l] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-j24ivgjo3l] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-j24ivgjo3l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-j24ivgjo3l] { filter: brightness(1.1); }
.btn-outline[b-j24ivgjo3l] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-j24ivgjo3l] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-j24ivgjo3l] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-j24ivgjo3l] { filter: brightness(1.1); }
.btn-icon[b-j24ivgjo3l] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-j24ivgjo3l] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-j24ivgjo3l] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-j24ivgjo3l] { color: #ef4444; }
.btn-delete:hover[b-j24ivgjo3l] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-j24ivgjo3l] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-j24ivgjo3l] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-j24ivgjo3l] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-j24ivgjo3l] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-j24ivgjo3l] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-j24ivgjo3l] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-j24ivgjo3l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-j24ivgjo3l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-j24ivgjo3l] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-j24ivgjo3l] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-j24ivgjo3l] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-j24ivgjo3l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-j24ivgjo3l] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-j24ivgjo3l] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-j24ivgjo3l] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-j24ivgjo3l] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-j24ivgjo3l] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-j24ivgjo3l] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-j24ivgjo3l] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-j24ivgjo3l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-j24ivgjo3l] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-j24ivgjo3l] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-j24ivgjo3l] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-j24ivgjo3l] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-j24ivgjo3l] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-j24ivgjo3l] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-j24ivgjo3l] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-j24ivgjo3l] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-j24ivgjo3l] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-j24ivgjo3l] { display: block; }
.hide-on-cards[b-j24ivgjo3l] { display: none !important; }
.show-on-cards[b-j24ivgjo3l] { display: grid; }
.hide-on-grid[b-j24ivgjo3l] { display: none !important; }

/* Badges */
.badge[b-j24ivgjo3l] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-j24ivgjo3l] { background: #ecfdf5; color: #065f46; }
.badge-no[b-j24ivgjo3l] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-j24ivgjo3l] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-j24ivgjo3l] { text-align: center; }
.text-muted[b-j24ivgjo3l] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-j24ivgjo3l], .crud-empty-state[b-j24ivgjo3l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-j24ivgjo3l] { font-size: 2rem; }
.crud-spinner[b-j24ivgjo3l] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-j24ivgjo3l 0.6s linear infinite; }
.crud-spinner-sm[b-j24ivgjo3l] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-j24ivgjo3l 0.6s linear infinite; }
@keyframes spin-b-j24ivgjo3l { to { transform: rotate(360deg); } }
.spin[b-j24ivgjo3l] { animation: spin-b-j24ivgjo3l 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-j24ivgjo3l] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-j24ivgjo3l 0.15s ease-out; }
.modal-container[b-j24ivgjo3l] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-j24ivgjo3l] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-j24ivgjo3l 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-j24ivgjo3l] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-j24ivgjo3l] { max-width: 420px; }
@keyframes fadeIn-b-j24ivgjo3l { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-j24ivgjo3l { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-j24ivgjo3l] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-j24ivgjo3l] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-j24ivgjo3l] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-j24ivgjo3l] { color: #dc2626; }
.modal-close[b-j24ivgjo3l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-j24ivgjo3l] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-j24ivgjo3l] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-j24ivgjo3l] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-j24ivgjo3l] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-j24ivgjo3l] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-j24ivgjo3l] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-j24ivgjo3l] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-j24ivgjo3l] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-j24ivgjo3l] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-j24ivgjo3l] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-j24ivgjo3l] { flex: 2; }
.form-group label[b-j24ivgjo3l] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-j24ivgjo3l], .form-group select[b-j24ivgjo3l], .form-textarea[b-j24ivgjo3l] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-j24ivgjo3l], .form-group select:focus[b-j24ivgjo3l], .form-textarea:focus[b-j24ivgjo3l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-j24ivgjo3l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-j24ivgjo3l] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-j24ivgjo3l] { flex: 1; display: flex; align-items: center; }
.form-check[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-j24ivgjo3l] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-j24ivgjo3l] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-j24ivgjo3l] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-j24ivgjo3l] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-j24ivgjo3l] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-j24ivgjo3l] { font-size: 3rem; }
.photo-placeholder span[b-j24ivgjo3l] { font-size: 0.78rem; }
.photo-actions[b-j24ivgjo3l] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-j24ivgjo3l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-j24ivgjo3l] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-j24ivgjo3l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-j24ivgjo3l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-j24ivgjo3l] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-j24ivgjo3l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-j24ivgjo3l] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-j24ivgjo3l] { filter: brightness(1.15); transform: scale(1.05); }
[b-j24ivgjo3l] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-j24ivgjo3l] { padding: 0.75rem; }
    .crud-header[b-j24ivgjo3l] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-j24ivgjo3l] { font-size: 1.1rem; }
    .btn-text[b-j24ivgjo3l] { display: none; }
    .form-row[b-j24ivgjo3l] { flex-direction: column; }
    .form-row-4[b-j24ivgjo3l] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-j24ivgjo3l] { width: 98%; max-height: 95vh; }
    .modal-lg[b-j24ivgjo3l] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-j24ivgjo3l] { padding: 0.75rem; }
    .modal-tabs[b-j24ivgjo3l] { overflow-x: auto; }
    .modal-tab[b-j24ivgjo3l] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-j24ivgjo3l] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-j24ivgjo3l] { display: grid !important; }
    .crud-cards-wrapper[b-j24ivgjo3l] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-j24ivgjo3l] { grid-template-columns: 1fr; }
    .card-details[b-j24ivgjo3l] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-j24ivgjo3l] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-j24ivgjo3l] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-j24ivgjo3l] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-j24ivgjo3l] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdnt_presupuesto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fazpzysqob] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fazpzysqob 0.3s ease-out; }
@keyframes slideUp-b-fazpzysqob { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fazpzysqob] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fazpzysqob] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fazpzysqob] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fazpzysqob] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fazpzysqob] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fazpzysqob] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fazpzysqob] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fazpzysqob] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fazpzysqob] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fazpzysqob] { filter: brightness(1.1); }
.btn-outline[b-fazpzysqob] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fazpzysqob] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fazpzysqob] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fazpzysqob] { filter: brightness(1.1); }
.btn-icon[b-fazpzysqob] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fazpzysqob] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fazpzysqob] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fazpzysqob] { color: #ef4444; }
.btn-delete:hover[b-fazpzysqob] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fazpzysqob] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fazpzysqob] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fazpzysqob] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fazpzysqob] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fazpzysqob] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fazpzysqob] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fazpzysqob] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fazpzysqob] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fazpzysqob] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fazpzysqob] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fazpzysqob] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fazpzysqob] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fazpzysqob] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fazpzysqob] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fazpzysqob] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fazpzysqob] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fazpzysqob] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fazpzysqob] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fazpzysqob] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fazpzysqob] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fazpzysqob] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fazpzysqob] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fazpzysqob] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fazpzysqob] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fazpzysqob] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fazpzysqob] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fazpzysqob] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fazpzysqob] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fazpzysqob] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fazpzysqob] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fazpzysqob] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fazpzysqob] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fazpzysqob] { display: block; }
.hide-on-cards[b-fazpzysqob] { display: none !important; }
.show-on-cards[b-fazpzysqob] { display: grid; }
.hide-on-grid[b-fazpzysqob] { display: none !important; }

/* Badges */
.badge[b-fazpzysqob] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fazpzysqob] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fazpzysqob] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fazpzysqob] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fazpzysqob] { text-align: center; }
.text-muted[b-fazpzysqob] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fazpzysqob], .crud-empty-state[b-fazpzysqob] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fazpzysqob] { font-size: 2rem; }
.crud-spinner[b-fazpzysqob] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fazpzysqob 0.6s linear infinite; }
.crud-spinner-sm[b-fazpzysqob] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fazpzysqob 0.6s linear infinite; }
@keyframes spin-b-fazpzysqob { to { transform: rotate(360deg); } }
.spin[b-fazpzysqob] { animation: spin-b-fazpzysqob 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fazpzysqob] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fazpzysqob 0.15s ease-out; }
.modal-container[b-fazpzysqob] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fazpzysqob] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fazpzysqob 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fazpzysqob] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fazpzysqob] { max-width: 420px; }
@keyframes fadeIn-b-fazpzysqob { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fazpzysqob { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fazpzysqob] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fazpzysqob] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fazpzysqob] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fazpzysqob] { color: #dc2626; }
.modal-close[b-fazpzysqob] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fazpzysqob] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fazpzysqob] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fazpzysqob] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fazpzysqob] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fazpzysqob] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fazpzysqob] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fazpzysqob] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fazpzysqob] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fazpzysqob] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fazpzysqob] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fazpzysqob] { flex: 2; }
.form-group label[b-fazpzysqob] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fazpzysqob], .form-group select[b-fazpzysqob], .form-textarea[b-fazpzysqob] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fazpzysqob], .form-group select:focus[b-fazpzysqob], .form-textarea:focus[b-fazpzysqob] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fazpzysqob] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fazpzysqob] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fazpzysqob] { flex: 1; display: flex; align-items: center; }
.form-check[b-fazpzysqob] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fazpzysqob] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fazpzysqob] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fazpzysqob] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fazpzysqob] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fazpzysqob] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fazpzysqob] { font-size: 3rem; }
.photo-placeholder span[b-fazpzysqob] { font-size: 0.78rem; }
.photo-actions[b-fazpzysqob] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fazpzysqob] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fazpzysqob] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fazpzysqob] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fazpzysqob] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fazpzysqob] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fazpzysqob] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fazpzysqob] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fazpzysqob] { filter: brightness(1.15); transform: scale(1.05); }
[b-fazpzysqob] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fazpzysqob] { padding: 0.75rem; }
    .crud-header[b-fazpzysqob] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fazpzysqob] { font-size: 1.1rem; }
    .btn-text[b-fazpzysqob] { display: none; }
    .form-row[b-fazpzysqob] { flex-direction: column; }
    .form-row-4[b-fazpzysqob] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fazpzysqob] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fazpzysqob] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fazpzysqob] { padding: 0.75rem; }
    .modal-tabs[b-fazpzysqob] { overflow-x: auto; }
    .modal-tab[b-fazpzysqob] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fazpzysqob] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fazpzysqob] { display: grid !important; }
    .crud-cards-wrapper[b-fazpzysqob] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fazpzysqob] { grid-template-columns: 1fr; }
    .card-details[b-fazpzysqob] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fazpzysqob] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fazpzysqob] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fazpzysqob] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fazpzysqob] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Dental/Frmdnt_productos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-b71c9lfrh7] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-b71c9lfrh7 0.3s ease-out; }
@keyframes slideUp-b-b71c9lfrh7 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-b71c9lfrh7] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-b71c9lfrh7] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-b71c9lfrh7] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-b71c9lfrh7] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-b71c9lfrh7] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-b71c9lfrh7] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-b71c9lfrh7] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-b71c9lfrh7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-b71c9lfrh7] { filter: brightness(1.1); }
.btn-outline[b-b71c9lfrh7] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-b71c9lfrh7] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-b71c9lfrh7] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-b71c9lfrh7] { filter: brightness(1.1); }
.btn-icon[b-b71c9lfrh7] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-b71c9lfrh7] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-b71c9lfrh7] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-b71c9lfrh7] { color: #ef4444; }
.btn-delete:hover[b-b71c9lfrh7] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-b71c9lfrh7] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-b71c9lfrh7] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-b71c9lfrh7] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-b71c9lfrh7] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-b71c9lfrh7] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-b71c9lfrh7] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-b71c9lfrh7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-b71c9lfrh7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-b71c9lfrh7] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-b71c9lfrh7] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-b71c9lfrh7] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-b71c9lfrh7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-b71c9lfrh7] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-b71c9lfrh7] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-b71c9lfrh7] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-b71c9lfrh7] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-b71c9lfrh7] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-b71c9lfrh7] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-b71c9lfrh7] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-b71c9lfrh7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-b71c9lfrh7] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-b71c9lfrh7] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-b71c9lfrh7] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-b71c9lfrh7] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-b71c9lfrh7] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-b71c9lfrh7] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-b71c9lfrh7] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-b71c9lfrh7] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-b71c9lfrh7] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-b71c9lfrh7] { display: block; }
.hide-on-cards[b-b71c9lfrh7] { display: none !important; }
.show-on-cards[b-b71c9lfrh7] { display: grid; }
.hide-on-grid[b-b71c9lfrh7] { display: none !important; }

/* Badges */
.badge[b-b71c9lfrh7] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-b71c9lfrh7] { background: #ecfdf5; color: #065f46; }
.badge-no[b-b71c9lfrh7] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-b71c9lfrh7] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-b71c9lfrh7] { text-align: center; }
.text-muted[b-b71c9lfrh7] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-b71c9lfrh7], .crud-empty-state[b-b71c9lfrh7] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-b71c9lfrh7] { font-size: 2rem; }
.crud-spinner[b-b71c9lfrh7] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-b71c9lfrh7 0.6s linear infinite; }
.crud-spinner-sm[b-b71c9lfrh7] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-b71c9lfrh7 0.6s linear infinite; }
@keyframes spin-b-b71c9lfrh7 { to { transform: rotate(360deg); } }
.spin[b-b71c9lfrh7] { animation: spin-b-b71c9lfrh7 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-b71c9lfrh7] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-b71c9lfrh7 0.15s ease-out; }
.modal-container[b-b71c9lfrh7] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-b71c9lfrh7] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-b71c9lfrh7 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-b71c9lfrh7] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-b71c9lfrh7] { max-width: 420px; }
@keyframes fadeIn-b-b71c9lfrh7 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-b71c9lfrh7 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-b71c9lfrh7] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-b71c9lfrh7] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-b71c9lfrh7] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-b71c9lfrh7] { color: #dc2626; }
.modal-close[b-b71c9lfrh7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-b71c9lfrh7] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-b71c9lfrh7] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-b71c9lfrh7] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-b71c9lfrh7] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-b71c9lfrh7] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-b71c9lfrh7] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-b71c9lfrh7] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-b71c9lfrh7] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-b71c9lfrh7] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-b71c9lfrh7] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-b71c9lfrh7] { flex: 2; }
.form-group label[b-b71c9lfrh7] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-b71c9lfrh7], .form-group select[b-b71c9lfrh7], .form-textarea[b-b71c9lfrh7] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-b71c9lfrh7], .form-group select:focus[b-b71c9lfrh7], .form-textarea:focus[b-b71c9lfrh7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-b71c9lfrh7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-b71c9lfrh7] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-b71c9lfrh7] { flex: 1; display: flex; align-items: center; }
.form-check[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-b71c9lfrh7] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-b71c9lfrh7] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-b71c9lfrh7] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-b71c9lfrh7] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-b71c9lfrh7] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-b71c9lfrh7] { font-size: 3rem; }
.photo-placeholder span[b-b71c9lfrh7] { font-size: 0.78rem; }
.photo-actions[b-b71c9lfrh7] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-b71c9lfrh7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-b71c9lfrh7] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-b71c9lfrh7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-b71c9lfrh7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-b71c9lfrh7] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-b71c9lfrh7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-b71c9lfrh7] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-b71c9lfrh7] { filter: brightness(1.15); transform: scale(1.05); }
[b-b71c9lfrh7] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-b71c9lfrh7] { padding: 0.75rem; }
    .crud-header[b-b71c9lfrh7] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-b71c9lfrh7] { font-size: 1.1rem; }
    .btn-text[b-b71c9lfrh7] { display: none; }
    .form-row[b-b71c9lfrh7] { flex-direction: column; }
    .form-row-4[b-b71c9lfrh7] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-b71c9lfrh7] { width: 98%; max-height: 95vh; }
    .modal-lg[b-b71c9lfrh7] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-b71c9lfrh7] { padding: 0.75rem; }
    .modal-tabs[b-b71c9lfrh7] { overflow-x: auto; }
    .modal-tab[b-b71c9lfrh7] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-b71c9lfrh7] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-b71c9lfrh7] { display: grid !important; }
    .crud-cards-wrapper[b-b71c9lfrh7] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-b71c9lfrh7] { grid-template-columns: 1fr; }
    .card-details[b-b71c9lfrh7] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-b71c9lfrh7] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-b71c9lfrh7] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-b71c9lfrh7] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-b71c9lfrh7] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/DocumentIntelligence/FrmDocumentIntelligenceConfig.razor.rz.scp.css */
/* ============================================================
   Document Intelligence Config — replica patrón Frmclientes
   Página: listado CRUD + Modal CENTRADO para nuevo/editar
   ============================================================ */

.crud-container[b-8glo41wxcn] {
    padding: 1.25rem;
    max-width: 720px;
    margin: 2rem auto;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}
.rg-slide-up[b-8glo41wxcn] { animation: slideUp-b-8glo41wxcn 0.3s ease-out; }
@keyframes slideUp-b-8glo41wxcn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-8glo41wxcn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8glo41wxcn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8glo41wxcn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8glo41wxcn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8glo41wxcn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8glo41wxcn] { display: flex; gap: 0.5rem; }

.btn-crud[b-8glo41wxcn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8glo41wxcn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8glo41wxcn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8glo41wxcn] { filter: brightness(1.1); }
.btn-outline[b-8glo41wxcn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8glo41wxcn] { background: var(--rg-bg-hover, #f1f5f9); }

.btn-icon[b-8glo41wxcn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8glo41wxcn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8glo41wxcn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8glo41wxcn] { color: #ef4444; }
.btn-delete:hover[b-8glo41wxcn] { background: rgba(239, 68, 68, 0.1); }

.crud-alert[b-8glo41wxcn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8glo41wxcn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8glo41wxcn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8glo41wxcn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* ---- Listado CRUD ---- */
.crud-grid-wrapper[b-8glo41wxcn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 220px); }
.crud-table[b-8glo41wxcn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8glo41wxcn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8glo41wxcn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8glo41wxcn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8glo41wxcn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8glo41wxcn] { width: 120px; text-align: center; white-space: nowrap; }
.font-mono[b-8glo41wxcn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

.crud-loading[b-8glo41wxcn], .crud-empty-state[b-8glo41wxcn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8glo41wxcn] { font-size: 2rem; }

.crud-spinner[b-8glo41wxcn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8glo41wxcn 0.6s linear infinite; }
.crud-spinner-sm[b-8glo41wxcn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8glo41wxcn 0.6s linear infinite; }
@keyframes spin-b-8glo41wxcn { to { transform: rotate(360deg); } }

.badge[b-8glo41wxcn] { display: inline-block; padding: 0.15rem 0.5rem; border-radius: 999px; font-size: 0.68rem; font-weight: 600; }
.badge-ok[b-8glo41wxcn] { background: #d1fae5; color: #065f46; }
.badge-off[b-8glo41wxcn] { background: #e2e8f0; color: #475569; }

/* ---- Modal CENTRADO (idéntico al de Frmclientes) ---- */
.modal-backdrop[b-8glo41wxcn] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: fadeIn-b-8glo41wxcn 0.15s ease-out;
    opacity: 1 !important;
}
.modal-container[b-8glo41wxcn] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.modal-dialog[b-8glo41wxcn] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 520px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    animation: scaleIn-b-8glo41wxcn 0.2s ease-out;
    position: static;
    margin: 0;
}
@keyframes fadeIn-b-8glo41wxcn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8glo41wxcn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8glo41wxcn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8glo41wxcn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-8glo41wxcn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; width: 32px; height: 32px; }
.modal-close:hover[b-8glo41wxcn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8glo41wxcn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8glo41wxcn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ---- Form groups (idéntico al sistema) ---- */
.form-group[b-8glo41wxcn] { display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: 0.9rem; }
.form-group label[b-8glo41wxcn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8glo41wxcn] { padding: 0.5rem 0.625rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; }
.form-group input:focus[b-8glo41wxcn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group small[b-8glo41wxcn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }
.form-group small.warn[b-8glo41wxcn] { color: #b45309; display: flex; align-items: center; gap: 0.25rem; }

.apikey-row[b-8glo41wxcn] { display: flex; gap: 0.35rem; }
.apikey-row input[b-8glo41wxcn] { flex: 1; }
.apikey-row .btn-crud[b-8glo41wxcn] { flex-shrink: 0; padding: 0.4rem 0.6rem; }

@media (max-width: 768px) {
    .crud-container[b-8glo41wxcn] { padding: 0.75rem; }
    .crud-header[b-8glo41wxcn] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-8glo41wxcn] { display: none; }
    .modal-dialog[b-8glo41wxcn] { width: 98%; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Documentoslegales/Frmcontratos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-gnur4bpytw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gnur4bpytw 0.3s ease-out; }
@keyframes slideUp-b-gnur4bpytw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gnur4bpytw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gnur4bpytw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-gnur4bpytw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-gnur4bpytw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-gnur4bpytw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-gnur4bpytw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gnur4bpytw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-gnur4bpytw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gnur4bpytw] { filter: brightness(1.1); }
.btn-outline[b-gnur4bpytw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-gnur4bpytw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-gnur4bpytw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gnur4bpytw] { filter: brightness(1.1); }
.btn-icon[b-gnur4bpytw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-gnur4bpytw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gnur4bpytw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gnur4bpytw] { color: #ef4444; }
.btn-delete:hover[b-gnur4bpytw] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-gnur4bpytw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gnur4bpytw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gnur4bpytw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gnur4bpytw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-gnur4bpytw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gnur4bpytw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-gnur4bpytw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-gnur4bpytw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-gnur4bpytw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-gnur4bpytw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gnur4bpytw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gnur4bpytw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gnur4bpytw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-gnur4bpytw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-gnur4bpytw] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-gnur4bpytw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-gnur4bpytw] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-gnur4bpytw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-gnur4bpytw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-gnur4bpytw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-gnur4bpytw] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-gnur4bpytw] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-gnur4bpytw] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-gnur4bpytw] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-gnur4bpytw] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-gnur4bpytw] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-gnur4bpytw] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-gnur4bpytw] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-gnur4bpytw] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-gnur4bpytw] { display: block; }
.hide-on-cards[b-gnur4bpytw] { display: none !important; }
.show-on-cards[b-gnur4bpytw] { display: grid; }
.hide-on-grid[b-gnur4bpytw] { display: none !important; }

/* Badges */
.badge[b-gnur4bpytw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-gnur4bpytw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gnur4bpytw] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-gnur4bpytw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-gnur4bpytw] { text-align: center; }
.text-muted[b-gnur4bpytw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-gnur4bpytw], .crud-empty-state[b-gnur4bpytw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-gnur4bpytw] { font-size: 2rem; }
.crud-spinner[b-gnur4bpytw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-gnur4bpytw 0.6s linear infinite; }
.crud-spinner-sm[b-gnur4bpytw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-gnur4bpytw 0.6s linear infinite; }
@keyframes spin-b-gnur4bpytw { to { transform: rotate(360deg); } }
.spin[b-gnur4bpytw] { animation: spin-b-gnur4bpytw 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-gnur4bpytw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-gnur4bpytw 0.15s ease-out; }
.modal-container[b-gnur4bpytw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gnur4bpytw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-gnur4bpytw 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-gnur4bpytw] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-gnur4bpytw] { max-width: 420px; }
@keyframes fadeIn-b-gnur4bpytw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gnur4bpytw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-gnur4bpytw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-gnur4bpytw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-gnur4bpytw] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-gnur4bpytw] { color: #dc2626; }
.modal-close[b-gnur4bpytw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-gnur4bpytw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-gnur4bpytw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gnur4bpytw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-gnur4bpytw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-gnur4bpytw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-gnur4bpytw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-gnur4bpytw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-gnur4bpytw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-gnur4bpytw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gnur4bpytw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-gnur4bpytw] { flex: 2; }
.form-group label[b-gnur4bpytw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gnur4bpytw], .form-group select[b-gnur4bpytw], .form-textarea[b-gnur4bpytw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-gnur4bpytw], .form-group select:focus[b-gnur4bpytw], .form-textarea:focus[b-gnur4bpytw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-gnur4bpytw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-gnur4bpytw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-gnur4bpytw] { flex: 1; display: flex; align-items: center; }
.form-check[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-gnur4bpytw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-gnur4bpytw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-gnur4bpytw] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-gnur4bpytw] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-gnur4bpytw] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-gnur4bpytw] { font-size: 3rem; }
.photo-placeholder span[b-gnur4bpytw] { font-size: 0.78rem; }
.photo-actions[b-gnur4bpytw] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-gnur4bpytw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-gnur4bpytw] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-gnur4bpytw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-gnur4bpytw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-gnur4bpytw] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-gnur4bpytw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-gnur4bpytw] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-gnur4bpytw] { filter: brightness(1.15); transform: scale(1.05); }
[b-gnur4bpytw] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-gnur4bpytw] { padding: 0.75rem; }
    .crud-header[b-gnur4bpytw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gnur4bpytw] { font-size: 1.1rem; }
    .btn-text[b-gnur4bpytw] { display: none; }
    .form-row[b-gnur4bpytw] { flex-direction: column; }
    .form-row-4[b-gnur4bpytw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-gnur4bpytw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-gnur4bpytw] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-gnur4bpytw] { padding: 0.75rem; }
    .modal-tabs[b-gnur4bpytw] { overflow-x: auto; }
    .modal-tab[b-gnur4bpytw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-gnur4bpytw] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-gnur4bpytw] { display: grid !important; }
    .crud-cards-wrapper[b-gnur4bpytw] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-gnur4bpytw] { grid-template-columns: 1fr; }
    .card-details[b-gnur4bpytw] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-gnur4bpytw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-gnur4bpytw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-gnur4bpytw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-gnur4bpytw] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Documentoslegales/Frmlegalesfactoringdoc.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-d8h9zpx5v0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-d8h9zpx5v0 0.3s ease-out; }
@keyframes slideUp-b-d8h9zpx5v0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-d8h9zpx5v0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-d8h9zpx5v0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-d8h9zpx5v0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-d8h9zpx5v0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-d8h9zpx5v0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-d8h9zpx5v0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-d8h9zpx5v0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-d8h9zpx5v0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-d8h9zpx5v0] { filter: brightness(1.1); }
.btn-outline[b-d8h9zpx5v0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-d8h9zpx5v0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-d8h9zpx5v0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-d8h9zpx5v0] { filter: brightness(1.1); }
.btn-icon[b-d8h9zpx5v0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-d8h9zpx5v0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-d8h9zpx5v0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-d8h9zpx5v0] { color: #ef4444; }
.btn-delete:hover[b-d8h9zpx5v0] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-d8h9zpx5v0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-d8h9zpx5v0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-d8h9zpx5v0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-d8h9zpx5v0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-d8h9zpx5v0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-d8h9zpx5v0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-d8h9zpx5v0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-d8h9zpx5v0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-d8h9zpx5v0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-d8h9zpx5v0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-d8h9zpx5v0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-d8h9zpx5v0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-d8h9zpx5v0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-d8h9zpx5v0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-d8h9zpx5v0] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-d8h9zpx5v0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-d8h9zpx5v0] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-d8h9zpx5v0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-d8h9zpx5v0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-d8h9zpx5v0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-d8h9zpx5v0] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-d8h9zpx5v0] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-d8h9zpx5v0] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-d8h9zpx5v0] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-d8h9zpx5v0] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-d8h9zpx5v0] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-d8h9zpx5v0] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-d8h9zpx5v0] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-d8h9zpx5v0] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-d8h9zpx5v0] { display: block; }
.hide-on-cards[b-d8h9zpx5v0] { display: none !important; }
.show-on-cards[b-d8h9zpx5v0] { display: grid; }
.hide-on-grid[b-d8h9zpx5v0] { display: none !important; }

/* Badges */
.badge[b-d8h9zpx5v0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-d8h9zpx5v0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-d8h9zpx5v0] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-d8h9zpx5v0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-d8h9zpx5v0] { text-align: center; }
.text-muted[b-d8h9zpx5v0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-d8h9zpx5v0], .crud-empty-state[b-d8h9zpx5v0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-d8h9zpx5v0] { font-size: 2rem; }
.crud-spinner[b-d8h9zpx5v0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-d8h9zpx5v0 0.6s linear infinite; }
.crud-spinner-sm[b-d8h9zpx5v0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-d8h9zpx5v0 0.6s linear infinite; }
@keyframes spin-b-d8h9zpx5v0 { to { transform: rotate(360deg); } }
.spin[b-d8h9zpx5v0] { animation: spin-b-d8h9zpx5v0 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-d8h9zpx5v0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-d8h9zpx5v0 0.15s ease-out; }
.modal-container[b-d8h9zpx5v0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-d8h9zpx5v0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-d8h9zpx5v0 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-d8h9zpx5v0] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-d8h9zpx5v0] { max-width: 420px; }
@keyframes fadeIn-b-d8h9zpx5v0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-d8h9zpx5v0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-d8h9zpx5v0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-d8h9zpx5v0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-d8h9zpx5v0] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-d8h9zpx5v0] { color: #dc2626; }
.modal-close[b-d8h9zpx5v0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-d8h9zpx5v0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-d8h9zpx5v0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-d8h9zpx5v0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-d8h9zpx5v0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-d8h9zpx5v0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-d8h9zpx5v0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-d8h9zpx5v0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-d8h9zpx5v0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-d8h9zpx5v0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-d8h9zpx5v0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-d8h9zpx5v0] { flex: 2; }
.form-group label[b-d8h9zpx5v0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-d8h9zpx5v0], .form-group select[b-d8h9zpx5v0], .form-textarea[b-d8h9zpx5v0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-d8h9zpx5v0], .form-group select:focus[b-d8h9zpx5v0], .form-textarea:focus[b-d8h9zpx5v0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-d8h9zpx5v0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-d8h9zpx5v0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-d8h9zpx5v0] { flex: 1; display: flex; align-items: center; }
.form-check[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-d8h9zpx5v0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-d8h9zpx5v0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-d8h9zpx5v0] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-d8h9zpx5v0] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-d8h9zpx5v0] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-d8h9zpx5v0] { font-size: 3rem; }
.photo-placeholder span[b-d8h9zpx5v0] { font-size: 0.78rem; }
.photo-actions[b-d8h9zpx5v0] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-d8h9zpx5v0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-d8h9zpx5v0] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-d8h9zpx5v0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-d8h9zpx5v0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-d8h9zpx5v0] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-d8h9zpx5v0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-d8h9zpx5v0] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-d8h9zpx5v0] { filter: brightness(1.15); transform: scale(1.05); }
[b-d8h9zpx5v0] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-d8h9zpx5v0] { padding: 0.75rem; }
    .crud-header[b-d8h9zpx5v0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-d8h9zpx5v0] { font-size: 1.1rem; }
    .btn-text[b-d8h9zpx5v0] { display: none; }
    .form-row[b-d8h9zpx5v0] { flex-direction: column; }
    .form-row-4[b-d8h9zpx5v0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-d8h9zpx5v0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-d8h9zpx5v0] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-d8h9zpx5v0] { padding: 0.75rem; }
    .modal-tabs[b-d8h9zpx5v0] { overflow-x: auto; }
    .modal-tab[b-d8h9zpx5v0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-d8h9zpx5v0] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-d8h9zpx5v0] { display: grid !important; }
    .crud-cards-wrapper[b-d8h9zpx5v0] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-d8h9zpx5v0] { grid-template-columns: 1fr; }
    .card-details[b-d8h9zpx5v0] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-d8h9zpx5v0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-d8h9zpx5v0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-d8h9zpx5v0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-d8h9zpx5v0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Fmrftrcontratos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4iufrdc82v] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4iufrdc82v 0.3s ease-out; }
@keyframes slideUp-b-4iufrdc82v { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4iufrdc82v] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4iufrdc82v] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4iufrdc82v] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4iufrdc82v] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4iufrdc82v] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4iufrdc82v] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4iufrdc82v] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4iufrdc82v] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4iufrdc82v] { filter: brightness(1.1); }
.btn-outline[b-4iufrdc82v] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4iufrdc82v] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4iufrdc82v] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4iufrdc82v] { filter: brightness(1.1); }
.btn-icon[b-4iufrdc82v] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4iufrdc82v] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4iufrdc82v] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4iufrdc82v] { color: #ef4444; }
.btn-delete:hover[b-4iufrdc82v] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4iufrdc82v] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4iufrdc82v] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4iufrdc82v] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4iufrdc82v] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4iufrdc82v] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4iufrdc82v] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4iufrdc82v] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4iufrdc82v] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4iufrdc82v] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4iufrdc82v] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4iufrdc82v] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4iufrdc82v] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4iufrdc82v] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4iufrdc82v] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4iufrdc82v] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4iufrdc82v] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4iufrdc82v] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4iufrdc82v] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4iufrdc82v] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4iufrdc82v] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4iufrdc82v] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4iufrdc82v] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4iufrdc82v] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4iufrdc82v] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4iufrdc82v] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4iufrdc82v] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4iufrdc82v] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4iufrdc82v] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4iufrdc82v] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4iufrdc82v] { display: block; }
.hide-on-cards[b-4iufrdc82v] { display: none !important; }
.show-on-cards[b-4iufrdc82v] { display: grid; }
.hide-on-grid[b-4iufrdc82v] { display: none !important; }

/* Badges */
.badge[b-4iufrdc82v] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4iufrdc82v] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4iufrdc82v] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4iufrdc82v] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4iufrdc82v] { text-align: center; }
.text-muted[b-4iufrdc82v] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4iufrdc82v], .crud-empty-state[b-4iufrdc82v] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4iufrdc82v] { font-size: 2rem; }
.crud-spinner[b-4iufrdc82v] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4iufrdc82v 0.6s linear infinite; }
.crud-spinner-sm[b-4iufrdc82v] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4iufrdc82v 0.6s linear infinite; }
@keyframes spin-b-4iufrdc82v { to { transform: rotate(360deg); } }
.spin[b-4iufrdc82v] { animation: spin-b-4iufrdc82v 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4iufrdc82v] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4iufrdc82v 0.15s ease-out; }
.modal-container[b-4iufrdc82v] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4iufrdc82v] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4iufrdc82v 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4iufrdc82v] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4iufrdc82v] { max-width: 420px; }
@keyframes fadeIn-b-4iufrdc82v { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4iufrdc82v { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4iufrdc82v] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4iufrdc82v] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4iufrdc82v] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4iufrdc82v] { color: #dc2626; }
.modal-close[b-4iufrdc82v] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4iufrdc82v] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4iufrdc82v] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4iufrdc82v] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4iufrdc82v] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4iufrdc82v] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4iufrdc82v] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4iufrdc82v] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4iufrdc82v] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4iufrdc82v] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4iufrdc82v] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4iufrdc82v] { flex: 2; }
.form-group label[b-4iufrdc82v] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4iufrdc82v], .form-group select[b-4iufrdc82v], .form-textarea[b-4iufrdc82v] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4iufrdc82v], .form-group select:focus[b-4iufrdc82v], .form-textarea:focus[b-4iufrdc82v] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4iufrdc82v] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4iufrdc82v] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4iufrdc82v] { flex: 1; display: flex; align-items: center; }
.form-check[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4iufrdc82v] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4iufrdc82v] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4iufrdc82v] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4iufrdc82v] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4iufrdc82v] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4iufrdc82v] { font-size: 3rem; }
.photo-placeholder span[b-4iufrdc82v] { font-size: 0.78rem; }
.photo-actions[b-4iufrdc82v] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4iufrdc82v] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4iufrdc82v] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4iufrdc82v] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4iufrdc82v] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4iufrdc82v] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4iufrdc82v] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4iufrdc82v] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4iufrdc82v] { filter: brightness(1.15); transform: scale(1.05); }
[b-4iufrdc82v] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4iufrdc82v] { padding: 0.75rem; }
    .crud-header[b-4iufrdc82v] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4iufrdc82v] { font-size: 1.1rem; }
    .btn-text[b-4iufrdc82v] { display: none; }
    .form-row[b-4iufrdc82v] { flex-direction: column; }
    .form-row-4[b-4iufrdc82v] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4iufrdc82v] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4iufrdc82v] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4iufrdc82v] { padding: 0.75rem; }
    .modal-tabs[b-4iufrdc82v] { overflow-x: auto; }
    .modal-tab[b-4iufrdc82v] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4iufrdc82v] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4iufrdc82v] { display: grid !important; }
    .crud-cards-wrapper[b-4iufrdc82v] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4iufrdc82v] { grid-template-columns: 1fr; }
    .card-details[b-4iufrdc82v] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4iufrdc82v] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4iufrdc82v] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4iufrdc82v] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4iufrdc82v] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Fmrftrcontratosreservas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6de6a9lbwz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6de6a9lbwz 0.3s ease-out; }
@keyframes slideUp-b-6de6a9lbwz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6de6a9lbwz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6de6a9lbwz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6de6a9lbwz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6de6a9lbwz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6de6a9lbwz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6de6a9lbwz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6de6a9lbwz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6de6a9lbwz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6de6a9lbwz] { filter: brightness(1.1); }
.btn-outline[b-6de6a9lbwz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6de6a9lbwz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6de6a9lbwz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6de6a9lbwz] { filter: brightness(1.1); }
.btn-icon[b-6de6a9lbwz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6de6a9lbwz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6de6a9lbwz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6de6a9lbwz] { color: #ef4444; }
.btn-delete:hover[b-6de6a9lbwz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6de6a9lbwz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6de6a9lbwz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6de6a9lbwz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6de6a9lbwz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6de6a9lbwz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6de6a9lbwz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6de6a9lbwz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6de6a9lbwz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6de6a9lbwz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6de6a9lbwz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6de6a9lbwz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6de6a9lbwz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6de6a9lbwz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6de6a9lbwz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6de6a9lbwz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6de6a9lbwz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6de6a9lbwz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6de6a9lbwz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6de6a9lbwz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6de6a9lbwz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6de6a9lbwz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6de6a9lbwz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6de6a9lbwz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6de6a9lbwz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6de6a9lbwz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6de6a9lbwz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6de6a9lbwz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6de6a9lbwz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6de6a9lbwz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6de6a9lbwz] { display: block; }
.hide-on-cards[b-6de6a9lbwz] { display: none !important; }
.show-on-cards[b-6de6a9lbwz] { display: grid; }
.hide-on-grid[b-6de6a9lbwz] { display: none !important; }

/* Badges */
.badge[b-6de6a9lbwz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6de6a9lbwz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6de6a9lbwz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6de6a9lbwz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6de6a9lbwz] { text-align: center; }
.text-muted[b-6de6a9lbwz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6de6a9lbwz], .crud-empty-state[b-6de6a9lbwz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6de6a9lbwz] { font-size: 2rem; }
.crud-spinner[b-6de6a9lbwz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6de6a9lbwz 0.6s linear infinite; }
.crud-spinner-sm[b-6de6a9lbwz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6de6a9lbwz 0.6s linear infinite; }
@keyframes spin-b-6de6a9lbwz { to { transform: rotate(360deg); } }
.spin[b-6de6a9lbwz] { animation: spin-b-6de6a9lbwz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6de6a9lbwz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6de6a9lbwz 0.15s ease-out; }
.modal-container[b-6de6a9lbwz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6de6a9lbwz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6de6a9lbwz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6de6a9lbwz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6de6a9lbwz] { max-width: 420px; }
@keyframes fadeIn-b-6de6a9lbwz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6de6a9lbwz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6de6a9lbwz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6de6a9lbwz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6de6a9lbwz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6de6a9lbwz] { color: #dc2626; }
.modal-close[b-6de6a9lbwz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6de6a9lbwz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6de6a9lbwz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6de6a9lbwz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6de6a9lbwz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6de6a9lbwz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6de6a9lbwz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6de6a9lbwz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6de6a9lbwz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6de6a9lbwz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6de6a9lbwz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6de6a9lbwz] { flex: 2; }
.form-group label[b-6de6a9lbwz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6de6a9lbwz], .form-group select[b-6de6a9lbwz], .form-textarea[b-6de6a9lbwz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6de6a9lbwz], .form-group select:focus[b-6de6a9lbwz], .form-textarea:focus[b-6de6a9lbwz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6de6a9lbwz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6de6a9lbwz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6de6a9lbwz] { flex: 1; display: flex; align-items: center; }
.form-check[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6de6a9lbwz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6de6a9lbwz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6de6a9lbwz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6de6a9lbwz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6de6a9lbwz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6de6a9lbwz] { font-size: 3rem; }
.photo-placeholder span[b-6de6a9lbwz] { font-size: 0.78rem; }
.photo-actions[b-6de6a9lbwz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6de6a9lbwz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6de6a9lbwz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6de6a9lbwz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6de6a9lbwz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6de6a9lbwz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6de6a9lbwz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6de6a9lbwz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6de6a9lbwz] { filter: brightness(1.15); transform: scale(1.05); }
[b-6de6a9lbwz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6de6a9lbwz] { padding: 0.75rem; }
    .crud-header[b-6de6a9lbwz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6de6a9lbwz] { font-size: 1.1rem; }
    .btn-text[b-6de6a9lbwz] { display: none; }
    .form-row[b-6de6a9lbwz] { flex-direction: column; }
    .form-row-4[b-6de6a9lbwz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6de6a9lbwz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6de6a9lbwz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6de6a9lbwz] { padding: 0.75rem; }
    .modal-tabs[b-6de6a9lbwz] { overflow-x: auto; }
    .modal-tab[b-6de6a9lbwz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6de6a9lbwz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6de6a9lbwz] { display: grid !important; }
    .crud-cards-wrapper[b-6de6a9lbwz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6de6a9lbwz] { grid-template-columns: 1fr; }
    .card-details[b-6de6a9lbwz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6de6a9lbwz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6de6a9lbwz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6de6a9lbwz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6de6a9lbwz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmemisionncf.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zx9bfcu711] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zx9bfcu711 0.3s ease-out; }
@keyframes slideUp-b-zx9bfcu711 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zx9bfcu711] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zx9bfcu711] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zx9bfcu711] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zx9bfcu711] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zx9bfcu711] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zx9bfcu711] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zx9bfcu711] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zx9bfcu711] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zx9bfcu711] { filter: brightness(1.1); }
.btn-outline[b-zx9bfcu711] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zx9bfcu711] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zx9bfcu711] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zx9bfcu711] { filter: brightness(1.1); }
.btn-icon[b-zx9bfcu711] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zx9bfcu711] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zx9bfcu711] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zx9bfcu711] { color: #ef4444; }
.btn-delete:hover[b-zx9bfcu711] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zx9bfcu711] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zx9bfcu711] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zx9bfcu711] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zx9bfcu711] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zx9bfcu711] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zx9bfcu711] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zx9bfcu711] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zx9bfcu711] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zx9bfcu711] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zx9bfcu711] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zx9bfcu711] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zx9bfcu711] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zx9bfcu711] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zx9bfcu711] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zx9bfcu711] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zx9bfcu711] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zx9bfcu711] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zx9bfcu711] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zx9bfcu711] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zx9bfcu711] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zx9bfcu711] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zx9bfcu711] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zx9bfcu711] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zx9bfcu711] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zx9bfcu711] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zx9bfcu711] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zx9bfcu711] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zx9bfcu711] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zx9bfcu711] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zx9bfcu711] { display: block; }
.hide-on-cards[b-zx9bfcu711] { display: none !important; }
.show-on-cards[b-zx9bfcu711] { display: grid; }
.hide-on-grid[b-zx9bfcu711] { display: none !important; }

/* Badges */
.badge[b-zx9bfcu711] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zx9bfcu711] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zx9bfcu711] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zx9bfcu711] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zx9bfcu711] { text-align: center; }
.text-muted[b-zx9bfcu711] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zx9bfcu711], .crud-empty-state[b-zx9bfcu711] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zx9bfcu711] { font-size: 2rem; }
.crud-spinner[b-zx9bfcu711] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zx9bfcu711 0.6s linear infinite; }
.crud-spinner-sm[b-zx9bfcu711] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zx9bfcu711 0.6s linear infinite; }
@keyframes spin-b-zx9bfcu711 { to { transform: rotate(360deg); } }
.spin[b-zx9bfcu711] { animation: spin-b-zx9bfcu711 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zx9bfcu711] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zx9bfcu711 0.15s ease-out; }
.modal-container[b-zx9bfcu711] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zx9bfcu711] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zx9bfcu711 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zx9bfcu711] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zx9bfcu711] { max-width: 420px; }
@keyframes fadeIn-b-zx9bfcu711 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zx9bfcu711 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zx9bfcu711] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zx9bfcu711] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zx9bfcu711] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zx9bfcu711] { color: #dc2626; }
.modal-close[b-zx9bfcu711] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zx9bfcu711] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zx9bfcu711] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zx9bfcu711] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zx9bfcu711] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zx9bfcu711] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zx9bfcu711] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zx9bfcu711] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zx9bfcu711] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zx9bfcu711] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zx9bfcu711] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zx9bfcu711] { flex: 2; }
.form-group label[b-zx9bfcu711] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zx9bfcu711], .form-group select[b-zx9bfcu711], .form-textarea[b-zx9bfcu711] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zx9bfcu711], .form-group select:focus[b-zx9bfcu711], .form-textarea:focus[b-zx9bfcu711] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zx9bfcu711] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zx9bfcu711] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zx9bfcu711] { flex: 1; display: flex; align-items: center; }
.form-check[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zx9bfcu711] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zx9bfcu711] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zx9bfcu711] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zx9bfcu711] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zx9bfcu711] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zx9bfcu711] { font-size: 3rem; }
.photo-placeholder span[b-zx9bfcu711] { font-size: 0.78rem; }
.photo-actions[b-zx9bfcu711] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zx9bfcu711] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zx9bfcu711] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zx9bfcu711] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zx9bfcu711] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zx9bfcu711] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zx9bfcu711] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zx9bfcu711] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zx9bfcu711] { filter: brightness(1.15); transform: scale(1.05); }
[b-zx9bfcu711] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zx9bfcu711] { padding: 0.75rem; }
    .crud-header[b-zx9bfcu711] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zx9bfcu711] { font-size: 1.1rem; }
    .btn-text[b-zx9bfcu711] { display: none; }
    .form-row[b-zx9bfcu711] { flex-direction: column; }
    .form-row-4[b-zx9bfcu711] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zx9bfcu711] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zx9bfcu711] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zx9bfcu711] { padding: 0.75rem; }
    .modal-tabs[b-zx9bfcu711] { overflow-x: auto; }
    .modal-tab[b-zx9bfcu711] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zx9bfcu711] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zx9bfcu711] { display: grid !important; }
    .crud-cards-wrapper[b-zx9bfcu711] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zx9bfcu711] { grid-template-columns: 1fr; }
    .card-details[b-zx9bfcu711] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zx9bfcu711] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zx9bfcu711] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zx9bfcu711] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zx9bfcu711] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmfactoringcobros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tok5gkvn46] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tok5gkvn46 0.3s ease-out; }
@keyframes slideUp-b-tok5gkvn46 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tok5gkvn46] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tok5gkvn46] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tok5gkvn46] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tok5gkvn46] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tok5gkvn46] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tok5gkvn46] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tok5gkvn46] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tok5gkvn46] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tok5gkvn46] { filter: brightness(1.1); }
.btn-outline[b-tok5gkvn46] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tok5gkvn46] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tok5gkvn46] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tok5gkvn46] { filter: brightness(1.1); }
.btn-icon[b-tok5gkvn46] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tok5gkvn46] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tok5gkvn46] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tok5gkvn46] { color: #ef4444; }
.btn-delete:hover[b-tok5gkvn46] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tok5gkvn46] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tok5gkvn46] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tok5gkvn46] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tok5gkvn46] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tok5gkvn46] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tok5gkvn46] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tok5gkvn46] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tok5gkvn46] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tok5gkvn46] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tok5gkvn46] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tok5gkvn46] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tok5gkvn46] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tok5gkvn46] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tok5gkvn46] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tok5gkvn46] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tok5gkvn46] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tok5gkvn46] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tok5gkvn46] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tok5gkvn46] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tok5gkvn46] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tok5gkvn46] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tok5gkvn46] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tok5gkvn46] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tok5gkvn46] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tok5gkvn46] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tok5gkvn46] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tok5gkvn46] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tok5gkvn46] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tok5gkvn46] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tok5gkvn46] { display: block; }
.hide-on-cards[b-tok5gkvn46] { display: none !important; }
.show-on-cards[b-tok5gkvn46] { display: grid; }
.hide-on-grid[b-tok5gkvn46] { display: none !important; }

/* Badges */
.badge[b-tok5gkvn46] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tok5gkvn46] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tok5gkvn46] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tok5gkvn46] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tok5gkvn46] { text-align: center; }
.text-muted[b-tok5gkvn46] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tok5gkvn46], .crud-empty-state[b-tok5gkvn46] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tok5gkvn46] { font-size: 2rem; }
.crud-spinner[b-tok5gkvn46] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tok5gkvn46 0.6s linear infinite; }
.crud-spinner-sm[b-tok5gkvn46] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tok5gkvn46 0.6s linear infinite; }
@keyframes spin-b-tok5gkvn46 { to { transform: rotate(360deg); } }
.spin[b-tok5gkvn46] { animation: spin-b-tok5gkvn46 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tok5gkvn46] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tok5gkvn46 0.15s ease-out; }
.modal-container[b-tok5gkvn46] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tok5gkvn46] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tok5gkvn46 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tok5gkvn46] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tok5gkvn46] { max-width: 420px; }
@keyframes fadeIn-b-tok5gkvn46 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tok5gkvn46 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tok5gkvn46] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tok5gkvn46] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tok5gkvn46] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tok5gkvn46] { color: #dc2626; }
.modal-close[b-tok5gkvn46] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tok5gkvn46] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tok5gkvn46] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tok5gkvn46] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tok5gkvn46] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tok5gkvn46] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tok5gkvn46] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tok5gkvn46] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tok5gkvn46] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tok5gkvn46] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tok5gkvn46] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tok5gkvn46] { flex: 2; }
.form-group label[b-tok5gkvn46] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tok5gkvn46], .form-group select[b-tok5gkvn46], .form-textarea[b-tok5gkvn46] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tok5gkvn46], .form-group select:focus[b-tok5gkvn46], .form-textarea:focus[b-tok5gkvn46] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tok5gkvn46] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tok5gkvn46] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tok5gkvn46] { flex: 1; display: flex; align-items: center; }
.form-check[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tok5gkvn46] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tok5gkvn46] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tok5gkvn46] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tok5gkvn46] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tok5gkvn46] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tok5gkvn46] { font-size: 3rem; }
.photo-placeholder span[b-tok5gkvn46] { font-size: 0.78rem; }
.photo-actions[b-tok5gkvn46] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tok5gkvn46] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tok5gkvn46] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tok5gkvn46] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tok5gkvn46] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tok5gkvn46] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tok5gkvn46] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tok5gkvn46] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tok5gkvn46] { filter: brightness(1.15); transform: scale(1.05); }
[b-tok5gkvn46] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tok5gkvn46] { padding: 0.75rem; }
    .crud-header[b-tok5gkvn46] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tok5gkvn46] { font-size: 1.1rem; }
    .btn-text[b-tok5gkvn46] { display: none; }
    .form-row[b-tok5gkvn46] { flex-direction: column; }
    .form-row-4[b-tok5gkvn46] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tok5gkvn46] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tok5gkvn46] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tok5gkvn46] { padding: 0.75rem; }
    .modal-tabs[b-tok5gkvn46] { overflow-x: auto; }
    .modal-tab[b-tok5gkvn46] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tok5gkvn46] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tok5gkvn46] { display: grid !important; }
    .crud-cards-wrapper[b-tok5gkvn46] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tok5gkvn46] { grid-template-columns: 1fr; }
    .card-details[b-tok5gkvn46] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tok5gkvn46] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tok5gkvn46] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tok5gkvn46] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tok5gkvn46] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftrcalculo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hv995y5qt1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hv995y5qt1 0.3s ease-out; }
@keyframes slideUp-b-hv995y5qt1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hv995y5qt1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hv995y5qt1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hv995y5qt1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hv995y5qt1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hv995y5qt1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hv995y5qt1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hv995y5qt1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hv995y5qt1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hv995y5qt1] { filter: brightness(1.1); }
.btn-outline[b-hv995y5qt1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hv995y5qt1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hv995y5qt1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hv995y5qt1] { filter: brightness(1.1); }
.btn-icon[b-hv995y5qt1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hv995y5qt1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hv995y5qt1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hv995y5qt1] { color: #ef4444; }
.btn-delete:hover[b-hv995y5qt1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hv995y5qt1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hv995y5qt1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hv995y5qt1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hv995y5qt1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hv995y5qt1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hv995y5qt1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hv995y5qt1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hv995y5qt1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hv995y5qt1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hv995y5qt1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hv995y5qt1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hv995y5qt1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hv995y5qt1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hv995y5qt1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hv995y5qt1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hv995y5qt1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hv995y5qt1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hv995y5qt1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hv995y5qt1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hv995y5qt1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hv995y5qt1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hv995y5qt1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hv995y5qt1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hv995y5qt1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hv995y5qt1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hv995y5qt1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hv995y5qt1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hv995y5qt1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hv995y5qt1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hv995y5qt1] { display: block; }
.hide-on-cards[b-hv995y5qt1] { display: none !important; }
.show-on-cards[b-hv995y5qt1] { display: grid; }
.hide-on-grid[b-hv995y5qt1] { display: none !important; }

/* Badges */
.badge[b-hv995y5qt1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hv995y5qt1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hv995y5qt1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hv995y5qt1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hv995y5qt1] { text-align: center; }
.text-muted[b-hv995y5qt1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hv995y5qt1], .crud-empty-state[b-hv995y5qt1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hv995y5qt1] { font-size: 2rem; }
.crud-spinner[b-hv995y5qt1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hv995y5qt1 0.6s linear infinite; }
.crud-spinner-sm[b-hv995y5qt1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hv995y5qt1 0.6s linear infinite; }
@keyframes spin-b-hv995y5qt1 { to { transform: rotate(360deg); } }
.spin[b-hv995y5qt1] { animation: spin-b-hv995y5qt1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hv995y5qt1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hv995y5qt1 0.15s ease-out; }
.modal-container[b-hv995y5qt1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hv995y5qt1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hv995y5qt1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hv995y5qt1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hv995y5qt1] { max-width: 420px; }
@keyframes fadeIn-b-hv995y5qt1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hv995y5qt1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hv995y5qt1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hv995y5qt1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hv995y5qt1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hv995y5qt1] { color: #dc2626; }
.modal-close[b-hv995y5qt1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hv995y5qt1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hv995y5qt1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hv995y5qt1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hv995y5qt1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hv995y5qt1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hv995y5qt1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hv995y5qt1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hv995y5qt1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hv995y5qt1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hv995y5qt1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hv995y5qt1] { flex: 2; }
.form-group label[b-hv995y5qt1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hv995y5qt1], .form-group select[b-hv995y5qt1], .form-textarea[b-hv995y5qt1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hv995y5qt1], .form-group select:focus[b-hv995y5qt1], .form-textarea:focus[b-hv995y5qt1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hv995y5qt1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hv995y5qt1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hv995y5qt1] { flex: 1; display: flex; align-items: center; }
.form-check[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hv995y5qt1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hv995y5qt1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hv995y5qt1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hv995y5qt1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hv995y5qt1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hv995y5qt1] { font-size: 3rem; }
.photo-placeholder span[b-hv995y5qt1] { font-size: 0.78rem; }
.photo-actions[b-hv995y5qt1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hv995y5qt1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hv995y5qt1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hv995y5qt1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hv995y5qt1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hv995y5qt1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hv995y5qt1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hv995y5qt1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hv995y5qt1] { filter: brightness(1.15); transform: scale(1.05); }
[b-hv995y5qt1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hv995y5qt1] { padding: 0.75rem; }
    .crud-header[b-hv995y5qt1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hv995y5qt1] { font-size: 1.1rem; }
    .btn-text[b-hv995y5qt1] { display: none; }
    .form-row[b-hv995y5qt1] { flex-direction: column; }
    .form-row-4[b-hv995y5qt1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hv995y5qt1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hv995y5qt1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hv995y5qt1] { padding: 0.75rem; }
    .modal-tabs[b-hv995y5qt1] { overflow-x: auto; }
    .modal-tab[b-hv995y5qt1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hv995y5qt1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hv995y5qt1] { display: grid !important; }
    .crud-cards-wrapper[b-hv995y5qt1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hv995y5qt1] { grid-template-columns: 1fr; }
    .card-details[b-hv995y5qt1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hv995y5qt1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hv995y5qt1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hv995y5qt1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hv995y5qt1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftrcalculoreimpresion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7hzsd22u3b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7hzsd22u3b 0.3s ease-out; }
@keyframes slideUp-b-7hzsd22u3b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7hzsd22u3b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7hzsd22u3b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7hzsd22u3b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7hzsd22u3b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7hzsd22u3b] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7hzsd22u3b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7hzsd22u3b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7hzsd22u3b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7hzsd22u3b] { filter: brightness(1.1); }
.btn-outline[b-7hzsd22u3b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7hzsd22u3b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7hzsd22u3b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7hzsd22u3b] { filter: brightness(1.1); }
.btn-icon[b-7hzsd22u3b] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7hzsd22u3b] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7hzsd22u3b] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7hzsd22u3b] { color: #ef4444; }
.btn-delete:hover[b-7hzsd22u3b] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7hzsd22u3b] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7hzsd22u3b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7hzsd22u3b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7hzsd22u3b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7hzsd22u3b] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7hzsd22u3b] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7hzsd22u3b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7hzsd22u3b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7hzsd22u3b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7hzsd22u3b] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7hzsd22u3b] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7hzsd22u3b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7hzsd22u3b] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7hzsd22u3b] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7hzsd22u3b] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7hzsd22u3b] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7hzsd22u3b] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7hzsd22u3b] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7hzsd22u3b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7hzsd22u3b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7hzsd22u3b] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7hzsd22u3b] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7hzsd22u3b] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7hzsd22u3b] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7hzsd22u3b] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7hzsd22u3b] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7hzsd22u3b] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7hzsd22u3b] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7hzsd22u3b] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7hzsd22u3b] { display: block; }
.hide-on-cards[b-7hzsd22u3b] { display: none !important; }
.show-on-cards[b-7hzsd22u3b] { display: grid; }
.hide-on-grid[b-7hzsd22u3b] { display: none !important; }

/* Badges */
.badge[b-7hzsd22u3b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7hzsd22u3b] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7hzsd22u3b] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7hzsd22u3b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7hzsd22u3b] { text-align: center; }
.text-muted[b-7hzsd22u3b] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7hzsd22u3b], .crud-empty-state[b-7hzsd22u3b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7hzsd22u3b] { font-size: 2rem; }
.crud-spinner[b-7hzsd22u3b] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7hzsd22u3b 0.6s linear infinite; }
.crud-spinner-sm[b-7hzsd22u3b] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7hzsd22u3b 0.6s linear infinite; }
@keyframes spin-b-7hzsd22u3b { to { transform: rotate(360deg); } }
.spin[b-7hzsd22u3b] { animation: spin-b-7hzsd22u3b 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7hzsd22u3b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7hzsd22u3b 0.15s ease-out; }
.modal-container[b-7hzsd22u3b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7hzsd22u3b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7hzsd22u3b 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7hzsd22u3b] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7hzsd22u3b] { max-width: 420px; }
@keyframes fadeIn-b-7hzsd22u3b { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7hzsd22u3b { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7hzsd22u3b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7hzsd22u3b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7hzsd22u3b] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7hzsd22u3b] { color: #dc2626; }
.modal-close[b-7hzsd22u3b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7hzsd22u3b] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7hzsd22u3b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7hzsd22u3b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7hzsd22u3b] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7hzsd22u3b] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7hzsd22u3b] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7hzsd22u3b] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7hzsd22u3b] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7hzsd22u3b] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7hzsd22u3b] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7hzsd22u3b] { flex: 2; }
.form-group label[b-7hzsd22u3b] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7hzsd22u3b], .form-group select[b-7hzsd22u3b], .form-textarea[b-7hzsd22u3b] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7hzsd22u3b], .form-group select:focus[b-7hzsd22u3b], .form-textarea:focus[b-7hzsd22u3b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7hzsd22u3b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7hzsd22u3b] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7hzsd22u3b] { flex: 1; display: flex; align-items: center; }
.form-check[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7hzsd22u3b] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7hzsd22u3b] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7hzsd22u3b] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7hzsd22u3b] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7hzsd22u3b] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7hzsd22u3b] { font-size: 3rem; }
.photo-placeholder span[b-7hzsd22u3b] { font-size: 0.78rem; }
.photo-actions[b-7hzsd22u3b] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7hzsd22u3b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7hzsd22u3b] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7hzsd22u3b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7hzsd22u3b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7hzsd22u3b] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7hzsd22u3b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7hzsd22u3b] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7hzsd22u3b] { filter: brightness(1.15); transform: scale(1.05); }
[b-7hzsd22u3b] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7hzsd22u3b] { padding: 0.75rem; }
    .crud-header[b-7hzsd22u3b] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7hzsd22u3b] { font-size: 1.1rem; }
    .btn-text[b-7hzsd22u3b] { display: none; }
    .form-row[b-7hzsd22u3b] { flex-direction: column; }
    .form-row-4[b-7hzsd22u3b] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7hzsd22u3b] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7hzsd22u3b] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7hzsd22u3b] { padding: 0.75rem; }
    .modal-tabs[b-7hzsd22u3b] { overflow-x: auto; }
    .modal-tab[b-7hzsd22u3b] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7hzsd22u3b] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7hzsd22u3b] { display: grid !important; }
    .crud-cards-wrapper[b-7hzsd22u3b] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7hzsd22u3b] { grid-template-columns: 1fr; }
    .card-details[b-7hzsd22u3b] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7hzsd22u3b] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7hzsd22u3b] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7hzsd22u3b] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7hzsd22u3b] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_aseguradora_y_cedente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-66qfix58qh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-66qfix58qh 0.3s ease-out; }
@keyframes slideUp-b-66qfix58qh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-66qfix58qh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-66qfix58qh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-66qfix58qh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-66qfix58qh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-66qfix58qh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-66qfix58qh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-66qfix58qh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-66qfix58qh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-66qfix58qh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-66qfix58qh] { filter: brightness(1.1); }
.btn-outline[b-66qfix58qh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-66qfix58qh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-66qfix58qh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-66qfix58qh] { filter: brightness(1.1); }
.btn-icon[b-66qfix58qh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-66qfix58qh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-66qfix58qh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-66qfix58qh] { color: #ef4444; }
.btn-delete:hover[b-66qfix58qh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-66qfix58qh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-66qfix58qh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-66qfix58qh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-66qfix58qh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-66qfix58qh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-66qfix58qh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-66qfix58qh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-66qfix58qh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-66qfix58qh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-66qfix58qh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-66qfix58qh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-66qfix58qh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-66qfix58qh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-66qfix58qh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-66qfix58qh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-66qfix58qh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-66qfix58qh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-66qfix58qh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-66qfix58qh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-66qfix58qh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-66qfix58qh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-66qfix58qh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-66qfix58qh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-66qfix58qh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-66qfix58qh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-66qfix58qh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-66qfix58qh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-66qfix58qh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-66qfix58qh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-66qfix58qh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-66qfix58qh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-66qfix58qh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-66qfix58qh] { display: block; }
.hide-on-cards[b-66qfix58qh] { display: none !important; }
.show-on-cards[b-66qfix58qh] { display: grid; }
.hide-on-grid[b-66qfix58qh] { display: none !important; }

/* Badges */
.badge[b-66qfix58qh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-66qfix58qh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-66qfix58qh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-66qfix58qh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-66qfix58qh] { text-align: center; }
.text-muted[b-66qfix58qh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-66qfix58qh], .crud-empty-state[b-66qfix58qh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-66qfix58qh] { font-size: 2rem; }
.crud-spinner[b-66qfix58qh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-66qfix58qh 0.6s linear infinite; }
.crud-spinner-sm[b-66qfix58qh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-66qfix58qh 0.6s linear infinite; }
@keyframes spin-b-66qfix58qh { to { transform: rotate(360deg); } }
.spin[b-66qfix58qh] { animation: spin-b-66qfix58qh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-66qfix58qh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-66qfix58qh 0.15s ease-out; }
.modal-container[b-66qfix58qh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-66qfix58qh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-66qfix58qh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-66qfix58qh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-66qfix58qh] { max-width: 420px; }
@keyframes fadeIn-b-66qfix58qh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-66qfix58qh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-66qfix58qh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-66qfix58qh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-66qfix58qh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-66qfix58qh] { color: #dc2626; }
.modal-close[b-66qfix58qh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-66qfix58qh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-66qfix58qh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-66qfix58qh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-66qfix58qh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-66qfix58qh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-66qfix58qh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-66qfix58qh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-66qfix58qh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-66qfix58qh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-66qfix58qh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-66qfix58qh] { flex: 2; }
.form-group label[b-66qfix58qh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-66qfix58qh], .form-group select[b-66qfix58qh], .form-textarea[b-66qfix58qh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-66qfix58qh], .form-group select:focus[b-66qfix58qh], .form-textarea:focus[b-66qfix58qh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-66qfix58qh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-66qfix58qh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-66qfix58qh] { flex: 1; display: flex; align-items: center; }
.form-check[b-66qfix58qh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-66qfix58qh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-66qfix58qh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-66qfix58qh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-66qfix58qh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-66qfix58qh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-66qfix58qh] { font-size: 3rem; }
.photo-placeholder span[b-66qfix58qh] { font-size: 0.78rem; }
.photo-actions[b-66qfix58qh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-66qfix58qh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-66qfix58qh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-66qfix58qh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-66qfix58qh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-66qfix58qh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-66qfix58qh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-66qfix58qh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-66qfix58qh] { filter: brightness(1.15); transform: scale(1.05); }
[b-66qfix58qh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-66qfix58qh] { padding: 0.75rem; }
    .crud-header[b-66qfix58qh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-66qfix58qh] { font-size: 1.1rem; }
    .btn-text[b-66qfix58qh] { display: none; }
    .form-row[b-66qfix58qh] { flex-direction: column; }
    .form-row-4[b-66qfix58qh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-66qfix58qh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-66qfix58qh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-66qfix58qh] { padding: 0.75rem; }
    .modal-tabs[b-66qfix58qh] { overflow-x: auto; }
    .modal-tab[b-66qfix58qh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-66qfix58qh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-66qfix58qh] { display: grid !important; }
    .crud-cards-wrapper[b-66qfix58qh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-66qfix58qh] { grid-template-columns: 1fr; }
    .card-details[b-66qfix58qh] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-66qfix58qh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-66qfix58qh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-66qfix58qh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-66qfix58qh] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_parametros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-o4lx0g3678] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-o4lx0g3678 0.3s ease-out; }
@keyframes slideUp-b-o4lx0g3678 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-o4lx0g3678] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-o4lx0g3678] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-o4lx0g3678] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-o4lx0g3678] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-o4lx0g3678] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-o4lx0g3678] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-o4lx0g3678] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-o4lx0g3678] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-o4lx0g3678] { filter: brightness(1.1); }
.btn-outline[b-o4lx0g3678] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-o4lx0g3678] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-o4lx0g3678] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-o4lx0g3678] { filter: brightness(1.1); }
.btn-icon[b-o4lx0g3678] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-o4lx0g3678] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-o4lx0g3678] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-o4lx0g3678] { color: #ef4444; }
.btn-delete:hover[b-o4lx0g3678] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-o4lx0g3678] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-o4lx0g3678] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-o4lx0g3678] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-o4lx0g3678] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-o4lx0g3678] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-o4lx0g3678] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-o4lx0g3678] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-o4lx0g3678] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-o4lx0g3678] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-o4lx0g3678] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-o4lx0g3678] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-o4lx0g3678] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-o4lx0g3678] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-o4lx0g3678] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-o4lx0g3678] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-o4lx0g3678] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-o4lx0g3678] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-o4lx0g3678] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-o4lx0g3678] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-o4lx0g3678] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-o4lx0g3678] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-o4lx0g3678] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-o4lx0g3678] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-o4lx0g3678] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-o4lx0g3678] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-o4lx0g3678] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-o4lx0g3678] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-o4lx0g3678] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-o4lx0g3678] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-o4lx0g3678] { display: block; }
.hide-on-cards[b-o4lx0g3678] { display: none !important; }
.show-on-cards[b-o4lx0g3678] { display: grid; }
.hide-on-grid[b-o4lx0g3678] { display: none !important; }

/* Badges */
.badge[b-o4lx0g3678] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-o4lx0g3678] { background: #ecfdf5; color: #065f46; }
.badge-no[b-o4lx0g3678] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-o4lx0g3678] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-o4lx0g3678] { text-align: center; }
.text-muted[b-o4lx0g3678] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-o4lx0g3678], .crud-empty-state[b-o4lx0g3678] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-o4lx0g3678] { font-size: 2rem; }
.crud-spinner[b-o4lx0g3678] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-o4lx0g3678 0.6s linear infinite; }
.crud-spinner-sm[b-o4lx0g3678] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-o4lx0g3678 0.6s linear infinite; }
@keyframes spin-b-o4lx0g3678 { to { transform: rotate(360deg); } }
.spin[b-o4lx0g3678] { animation: spin-b-o4lx0g3678 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-o4lx0g3678] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-o4lx0g3678 0.15s ease-out; }
.modal-container[b-o4lx0g3678] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-o4lx0g3678] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-o4lx0g3678 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-o4lx0g3678] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-o4lx0g3678] { max-width: 420px; }
@keyframes fadeIn-b-o4lx0g3678 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-o4lx0g3678 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-o4lx0g3678] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-o4lx0g3678] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-o4lx0g3678] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-o4lx0g3678] { color: #dc2626; }
.modal-close[b-o4lx0g3678] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-o4lx0g3678] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-o4lx0g3678] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-o4lx0g3678] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-o4lx0g3678] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-o4lx0g3678] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-o4lx0g3678] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-o4lx0g3678] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-o4lx0g3678] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-o4lx0g3678] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-o4lx0g3678] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-o4lx0g3678] { flex: 2; }
.form-group label[b-o4lx0g3678] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-o4lx0g3678], .form-group select[b-o4lx0g3678], .form-textarea[b-o4lx0g3678] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-o4lx0g3678], .form-group select:focus[b-o4lx0g3678], .form-textarea:focus[b-o4lx0g3678] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-o4lx0g3678] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-o4lx0g3678] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-o4lx0g3678] { flex: 1; display: flex; align-items: center; }
.form-check[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-o4lx0g3678] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-o4lx0g3678] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-o4lx0g3678] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-o4lx0g3678] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-o4lx0g3678] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-o4lx0g3678] { font-size: 3rem; }
.photo-placeholder span[b-o4lx0g3678] { font-size: 0.78rem; }
.photo-actions[b-o4lx0g3678] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-o4lx0g3678] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-o4lx0g3678] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-o4lx0g3678] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-o4lx0g3678] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-o4lx0g3678] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-o4lx0g3678] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-o4lx0g3678] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-o4lx0g3678] { filter: brightness(1.15); transform: scale(1.05); }
[b-o4lx0g3678] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-o4lx0g3678] { padding: 0.75rem; }
    .crud-header[b-o4lx0g3678] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-o4lx0g3678] { font-size: 1.1rem; }
    .btn-text[b-o4lx0g3678] { display: none; }
    .form-row[b-o4lx0g3678] { flex-direction: column; }
    .form-row-4[b-o4lx0g3678] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-o4lx0g3678] { width: 98%; max-height: 95vh; }
    .modal-lg[b-o4lx0g3678] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-o4lx0g3678] { padding: 0.75rem; }
    .modal-tabs[b-o4lx0g3678] { overflow-x: auto; }
    .modal-tab[b-o4lx0g3678] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-o4lx0g3678] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-o4lx0g3678] { display: grid !important; }
    .crud-cards-wrapper[b-o4lx0g3678] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-o4lx0g3678] { grid-template-columns: 1fr; }
    .card-details[b-o4lx0g3678] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-o4lx0g3678] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-o4lx0g3678] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-o4lx0g3678] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-o4lx0g3678] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_prestadoraservicios.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7hg97wa3hi] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7hg97wa3hi 0.3s ease-out; }
@keyframes slideUp-b-7hg97wa3hi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7hg97wa3hi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7hg97wa3hi] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7hg97wa3hi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7hg97wa3hi] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7hg97wa3hi] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7hg97wa3hi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7hg97wa3hi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7hg97wa3hi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7hg97wa3hi] { filter: brightness(1.1); }
.btn-outline[b-7hg97wa3hi] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7hg97wa3hi] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7hg97wa3hi] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7hg97wa3hi] { filter: brightness(1.1); }
.btn-icon[b-7hg97wa3hi] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7hg97wa3hi] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7hg97wa3hi] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7hg97wa3hi] { color: #ef4444; }
.btn-delete:hover[b-7hg97wa3hi] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7hg97wa3hi] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7hg97wa3hi] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7hg97wa3hi] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7hg97wa3hi] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7hg97wa3hi] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7hg97wa3hi] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7hg97wa3hi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7hg97wa3hi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7hg97wa3hi] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7hg97wa3hi] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7hg97wa3hi] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7hg97wa3hi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7hg97wa3hi] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7hg97wa3hi] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7hg97wa3hi] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7hg97wa3hi] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7hg97wa3hi] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7hg97wa3hi] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7hg97wa3hi] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7hg97wa3hi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7hg97wa3hi] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7hg97wa3hi] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7hg97wa3hi] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7hg97wa3hi] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7hg97wa3hi] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7hg97wa3hi] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7hg97wa3hi] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7hg97wa3hi] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7hg97wa3hi] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7hg97wa3hi] { display: block; }
.hide-on-cards[b-7hg97wa3hi] { display: none !important; }
.show-on-cards[b-7hg97wa3hi] { display: grid; }
.hide-on-grid[b-7hg97wa3hi] { display: none !important; }

/* Badges */
.badge[b-7hg97wa3hi] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7hg97wa3hi] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7hg97wa3hi] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7hg97wa3hi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7hg97wa3hi] { text-align: center; }
.text-muted[b-7hg97wa3hi] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7hg97wa3hi], .crud-empty-state[b-7hg97wa3hi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7hg97wa3hi] { font-size: 2rem; }
.crud-spinner[b-7hg97wa3hi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7hg97wa3hi 0.6s linear infinite; }
.crud-spinner-sm[b-7hg97wa3hi] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7hg97wa3hi 0.6s linear infinite; }
@keyframes spin-b-7hg97wa3hi { to { transform: rotate(360deg); } }
.spin[b-7hg97wa3hi] { animation: spin-b-7hg97wa3hi 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7hg97wa3hi] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7hg97wa3hi 0.15s ease-out; }
.modal-container[b-7hg97wa3hi] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7hg97wa3hi] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7hg97wa3hi 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7hg97wa3hi] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7hg97wa3hi] { max-width: 420px; }
@keyframes fadeIn-b-7hg97wa3hi { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7hg97wa3hi { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7hg97wa3hi] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7hg97wa3hi] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7hg97wa3hi] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7hg97wa3hi] { color: #dc2626; }
.modal-close[b-7hg97wa3hi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7hg97wa3hi] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7hg97wa3hi] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7hg97wa3hi] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7hg97wa3hi] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7hg97wa3hi] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7hg97wa3hi] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7hg97wa3hi] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7hg97wa3hi] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7hg97wa3hi] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7hg97wa3hi] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7hg97wa3hi] { flex: 2; }
.form-group label[b-7hg97wa3hi] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7hg97wa3hi], .form-group select[b-7hg97wa3hi], .form-textarea[b-7hg97wa3hi] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7hg97wa3hi], .form-group select:focus[b-7hg97wa3hi], .form-textarea:focus[b-7hg97wa3hi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7hg97wa3hi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7hg97wa3hi] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7hg97wa3hi] { flex: 1; display: flex; align-items: center; }
.form-check[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7hg97wa3hi] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7hg97wa3hi] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7hg97wa3hi] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7hg97wa3hi] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7hg97wa3hi] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7hg97wa3hi] { font-size: 3rem; }
.photo-placeholder span[b-7hg97wa3hi] { font-size: 0.78rem; }
.photo-actions[b-7hg97wa3hi] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7hg97wa3hi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7hg97wa3hi] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7hg97wa3hi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7hg97wa3hi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7hg97wa3hi] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7hg97wa3hi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7hg97wa3hi] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7hg97wa3hi] { filter: brightness(1.15); transform: scale(1.05); }
[b-7hg97wa3hi] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7hg97wa3hi] { padding: 0.75rem; }
    .crud-header[b-7hg97wa3hi] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7hg97wa3hi] { font-size: 1.1rem; }
    .btn-text[b-7hg97wa3hi] { display: none; }
    .form-row[b-7hg97wa3hi] { flex-direction: column; }
    .form-row-4[b-7hg97wa3hi] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7hg97wa3hi] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7hg97wa3hi] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7hg97wa3hi] { padding: 0.75rem; }
    .modal-tabs[b-7hg97wa3hi] { overflow-x: auto; }
    .modal-tab[b-7hg97wa3hi] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7hg97wa3hi] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7hg97wa3hi] { display: grid !important; }
    .crud-cards-wrapper[b-7hg97wa3hi] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7hg97wa3hi] { grid-template-columns: 1fr; }
    .card-details[b-7hg97wa3hi] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7hg97wa3hi] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7hg97wa3hi] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7hg97wa3hi] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7hg97wa3hi] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_productos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-891rmnmrpm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-891rmnmrpm 0.3s ease-out; }
@keyframes slideUp-b-891rmnmrpm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-891rmnmrpm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-891rmnmrpm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-891rmnmrpm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-891rmnmrpm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-891rmnmrpm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-891rmnmrpm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-891rmnmrpm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-891rmnmrpm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-891rmnmrpm] { filter: brightness(1.1); }
.btn-outline[b-891rmnmrpm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-891rmnmrpm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-891rmnmrpm] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-891rmnmrpm] { filter: brightness(1.1); }
.btn-icon[b-891rmnmrpm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-891rmnmrpm] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-891rmnmrpm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-891rmnmrpm] { color: #ef4444; }
.btn-delete:hover[b-891rmnmrpm] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-891rmnmrpm] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-891rmnmrpm] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-891rmnmrpm] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-891rmnmrpm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-891rmnmrpm] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-891rmnmrpm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-891rmnmrpm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-891rmnmrpm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-891rmnmrpm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-891rmnmrpm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-891rmnmrpm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-891rmnmrpm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-891rmnmrpm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-891rmnmrpm] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-891rmnmrpm] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-891rmnmrpm] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-891rmnmrpm] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-891rmnmrpm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-891rmnmrpm] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-891rmnmrpm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-891rmnmrpm] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-891rmnmrpm] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-891rmnmrpm] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-891rmnmrpm] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-891rmnmrpm] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-891rmnmrpm] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-891rmnmrpm] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-891rmnmrpm] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-891rmnmrpm] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-891rmnmrpm] { display: block; }
.hide-on-cards[b-891rmnmrpm] { display: none !important; }
.show-on-cards[b-891rmnmrpm] { display: grid; }
.hide-on-grid[b-891rmnmrpm] { display: none !important; }

/* Badges */
.badge[b-891rmnmrpm] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-891rmnmrpm] { background: #ecfdf5; color: #065f46; }
.badge-no[b-891rmnmrpm] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-891rmnmrpm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-891rmnmrpm] { text-align: center; }
.text-muted[b-891rmnmrpm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-891rmnmrpm], .crud-empty-state[b-891rmnmrpm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-891rmnmrpm] { font-size: 2rem; }
.crud-spinner[b-891rmnmrpm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-891rmnmrpm 0.6s linear infinite; }
.crud-spinner-sm[b-891rmnmrpm] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-891rmnmrpm 0.6s linear infinite; }
@keyframes spin-b-891rmnmrpm { to { transform: rotate(360deg); } }
.spin[b-891rmnmrpm] { animation: spin-b-891rmnmrpm 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-891rmnmrpm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-891rmnmrpm 0.15s ease-out; }
.modal-container[b-891rmnmrpm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-891rmnmrpm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-891rmnmrpm 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-891rmnmrpm] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-891rmnmrpm] { max-width: 420px; }
@keyframes fadeIn-b-891rmnmrpm { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-891rmnmrpm { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-891rmnmrpm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-891rmnmrpm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-891rmnmrpm] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-891rmnmrpm] { color: #dc2626; }
.modal-close[b-891rmnmrpm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-891rmnmrpm] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-891rmnmrpm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-891rmnmrpm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-891rmnmrpm] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-891rmnmrpm] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-891rmnmrpm] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-891rmnmrpm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-891rmnmrpm] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-891rmnmrpm] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-891rmnmrpm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-891rmnmrpm] { flex: 2; }
.form-group label[b-891rmnmrpm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-891rmnmrpm], .form-group select[b-891rmnmrpm], .form-textarea[b-891rmnmrpm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-891rmnmrpm], .form-group select:focus[b-891rmnmrpm], .form-textarea:focus[b-891rmnmrpm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-891rmnmrpm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-891rmnmrpm] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-891rmnmrpm] { flex: 1; display: flex; align-items: center; }
.form-check[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-891rmnmrpm] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-891rmnmrpm] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-891rmnmrpm] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-891rmnmrpm] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-891rmnmrpm] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-891rmnmrpm] { font-size: 3rem; }
.photo-placeholder span[b-891rmnmrpm] { font-size: 0.78rem; }
.photo-actions[b-891rmnmrpm] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-891rmnmrpm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-891rmnmrpm] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-891rmnmrpm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-891rmnmrpm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-891rmnmrpm] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-891rmnmrpm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-891rmnmrpm] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-891rmnmrpm] { filter: brightness(1.15); transform: scale(1.05); }
[b-891rmnmrpm] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-891rmnmrpm] { padding: 0.75rem; }
    .crud-header[b-891rmnmrpm] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-891rmnmrpm] { font-size: 1.1rem; }
    .btn-text[b-891rmnmrpm] { display: none; }
    .form-row[b-891rmnmrpm] { flex-direction: column; }
    .form-row-4[b-891rmnmrpm] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-891rmnmrpm] { width: 98%; max-height: 95vh; }
    .modal-lg[b-891rmnmrpm] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-891rmnmrpm] { padding: 0.75rem; }
    .modal-tabs[b-891rmnmrpm] { overflow-x: auto; }
    .modal-tab[b-891rmnmrpm] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-891rmnmrpm] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-891rmnmrpm] { display: grid !important; }
    .crud-cards-wrapper[b-891rmnmrpm] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-891rmnmrpm] { grid-template-columns: 1fr; }
    .card-details[b-891rmnmrpm] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-891rmnmrpm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-891rmnmrpm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-891rmnmrpm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-891rmnmrpm] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_registra_contrato.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-20hqae98vt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-20hqae98vt 0.3s ease-out; }
@keyframes slideUp-b-20hqae98vt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-20hqae98vt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-20hqae98vt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-20hqae98vt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-20hqae98vt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-20hqae98vt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-20hqae98vt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-20hqae98vt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-20hqae98vt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-20hqae98vt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-20hqae98vt] { filter: brightness(1.1); }
.btn-outline[b-20hqae98vt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-20hqae98vt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-20hqae98vt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-20hqae98vt] { filter: brightness(1.1); }
.btn-icon[b-20hqae98vt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-20hqae98vt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-20hqae98vt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-20hqae98vt] { color: #ef4444; }
.btn-delete:hover[b-20hqae98vt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-20hqae98vt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-20hqae98vt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-20hqae98vt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-20hqae98vt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-20hqae98vt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-20hqae98vt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-20hqae98vt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-20hqae98vt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-20hqae98vt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-20hqae98vt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-20hqae98vt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-20hqae98vt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-20hqae98vt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-20hqae98vt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-20hqae98vt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-20hqae98vt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-20hqae98vt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-20hqae98vt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-20hqae98vt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-20hqae98vt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-20hqae98vt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-20hqae98vt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-20hqae98vt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-20hqae98vt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-20hqae98vt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-20hqae98vt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-20hqae98vt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-20hqae98vt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-20hqae98vt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-20hqae98vt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-20hqae98vt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-20hqae98vt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-20hqae98vt] { display: block; }
.hide-on-cards[b-20hqae98vt] { display: none !important; }
.show-on-cards[b-20hqae98vt] { display: grid; }
.hide-on-grid[b-20hqae98vt] { display: none !important; }

/* Badges */
.badge[b-20hqae98vt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-20hqae98vt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-20hqae98vt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-20hqae98vt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-20hqae98vt] { text-align: center; }
.text-muted[b-20hqae98vt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-20hqae98vt], .crud-empty-state[b-20hqae98vt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-20hqae98vt] { font-size: 2rem; }
.crud-spinner[b-20hqae98vt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-20hqae98vt 0.6s linear infinite; }
.crud-spinner-sm[b-20hqae98vt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-20hqae98vt 0.6s linear infinite; }
@keyframes spin-b-20hqae98vt { to { transform: rotate(360deg); } }
.spin[b-20hqae98vt] { animation: spin-b-20hqae98vt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-20hqae98vt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-20hqae98vt 0.15s ease-out; }
.modal-container[b-20hqae98vt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-20hqae98vt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-20hqae98vt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-20hqae98vt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-20hqae98vt] { max-width: 420px; }
@keyframes fadeIn-b-20hqae98vt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-20hqae98vt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-20hqae98vt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-20hqae98vt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-20hqae98vt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-20hqae98vt] { color: #dc2626; }
.modal-close[b-20hqae98vt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-20hqae98vt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-20hqae98vt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-20hqae98vt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-20hqae98vt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-20hqae98vt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-20hqae98vt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-20hqae98vt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-20hqae98vt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-20hqae98vt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-20hqae98vt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-20hqae98vt] { flex: 2; }
.form-group label[b-20hqae98vt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-20hqae98vt], .form-group select[b-20hqae98vt], .form-textarea[b-20hqae98vt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-20hqae98vt], .form-group select:focus[b-20hqae98vt], .form-textarea:focus[b-20hqae98vt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-20hqae98vt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-20hqae98vt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-20hqae98vt] { flex: 1; display: flex; align-items: center; }
.form-check[b-20hqae98vt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-20hqae98vt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-20hqae98vt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-20hqae98vt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-20hqae98vt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-20hqae98vt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-20hqae98vt] { font-size: 3rem; }
.photo-placeholder span[b-20hqae98vt] { font-size: 0.78rem; }
.photo-actions[b-20hqae98vt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-20hqae98vt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-20hqae98vt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-20hqae98vt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-20hqae98vt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-20hqae98vt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-20hqae98vt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-20hqae98vt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-20hqae98vt] { filter: brightness(1.15); transform: scale(1.05); }
[b-20hqae98vt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-20hqae98vt] { padding: 0.75rem; }
    .crud-header[b-20hqae98vt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-20hqae98vt] { font-size: 1.1rem; }
    .btn-text[b-20hqae98vt] { display: none; }
    .form-row[b-20hqae98vt] { flex-direction: column; }
    .form-row-4[b-20hqae98vt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-20hqae98vt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-20hqae98vt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-20hqae98vt] { padding: 0.75rem; }
    .modal-tabs[b-20hqae98vt] { overflow-x: auto; }
    .modal-tab[b-20hqae98vt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-20hqae98vt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-20hqae98vt] { display: grid !important; }
    .crud-cards-wrapper[b-20hqae98vt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-20hqae98vt] { grid-template-columns: 1fr; }
    .card-details[b-20hqae98vt] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-20hqae98vt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-20hqae98vt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-20hqae98vt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-20hqae98vt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_reimpresion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tksnalsh6f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tksnalsh6f 0.3s ease-out; }
@keyframes slideUp-b-tksnalsh6f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tksnalsh6f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tksnalsh6f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tksnalsh6f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tksnalsh6f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tksnalsh6f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tksnalsh6f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tksnalsh6f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tksnalsh6f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tksnalsh6f] { filter: brightness(1.1); }
.btn-outline[b-tksnalsh6f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tksnalsh6f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tksnalsh6f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tksnalsh6f] { filter: brightness(1.1); }
.btn-icon[b-tksnalsh6f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tksnalsh6f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tksnalsh6f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tksnalsh6f] { color: #ef4444; }
.btn-delete:hover[b-tksnalsh6f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tksnalsh6f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tksnalsh6f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tksnalsh6f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tksnalsh6f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tksnalsh6f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tksnalsh6f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tksnalsh6f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tksnalsh6f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tksnalsh6f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tksnalsh6f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tksnalsh6f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tksnalsh6f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tksnalsh6f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tksnalsh6f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tksnalsh6f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tksnalsh6f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tksnalsh6f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tksnalsh6f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tksnalsh6f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tksnalsh6f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tksnalsh6f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tksnalsh6f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tksnalsh6f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tksnalsh6f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tksnalsh6f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tksnalsh6f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tksnalsh6f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tksnalsh6f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tksnalsh6f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tksnalsh6f] { display: block; }
.hide-on-cards[b-tksnalsh6f] { display: none !important; }
.show-on-cards[b-tksnalsh6f] { display: grid; }
.hide-on-grid[b-tksnalsh6f] { display: none !important; }

/* Badges */
.badge[b-tksnalsh6f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tksnalsh6f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tksnalsh6f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tksnalsh6f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tksnalsh6f] { text-align: center; }
.text-muted[b-tksnalsh6f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tksnalsh6f], .crud-empty-state[b-tksnalsh6f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tksnalsh6f] { font-size: 2rem; }
.crud-spinner[b-tksnalsh6f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tksnalsh6f 0.6s linear infinite; }
.crud-spinner-sm[b-tksnalsh6f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tksnalsh6f 0.6s linear infinite; }
@keyframes spin-b-tksnalsh6f { to { transform: rotate(360deg); } }
.spin[b-tksnalsh6f] { animation: spin-b-tksnalsh6f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tksnalsh6f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tksnalsh6f 0.15s ease-out; }
.modal-container[b-tksnalsh6f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tksnalsh6f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tksnalsh6f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tksnalsh6f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tksnalsh6f] { max-width: 420px; }
@keyframes fadeIn-b-tksnalsh6f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tksnalsh6f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tksnalsh6f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tksnalsh6f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tksnalsh6f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tksnalsh6f] { color: #dc2626; }
.modal-close[b-tksnalsh6f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tksnalsh6f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tksnalsh6f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tksnalsh6f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tksnalsh6f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tksnalsh6f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tksnalsh6f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tksnalsh6f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tksnalsh6f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tksnalsh6f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tksnalsh6f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tksnalsh6f] { flex: 2; }
.form-group label[b-tksnalsh6f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tksnalsh6f], .form-group select[b-tksnalsh6f], .form-textarea[b-tksnalsh6f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tksnalsh6f], .form-group select:focus[b-tksnalsh6f], .form-textarea:focus[b-tksnalsh6f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tksnalsh6f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tksnalsh6f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tksnalsh6f] { flex: 1; display: flex; align-items: center; }
.form-check[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tksnalsh6f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tksnalsh6f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tksnalsh6f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tksnalsh6f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tksnalsh6f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tksnalsh6f] { font-size: 3rem; }
.photo-placeholder span[b-tksnalsh6f] { font-size: 0.78rem; }
.photo-actions[b-tksnalsh6f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tksnalsh6f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tksnalsh6f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tksnalsh6f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tksnalsh6f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tksnalsh6f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tksnalsh6f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tksnalsh6f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tksnalsh6f] { filter: brightness(1.15); transform: scale(1.05); }
[b-tksnalsh6f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tksnalsh6f] { padding: 0.75rem; }
    .crud-header[b-tksnalsh6f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tksnalsh6f] { font-size: 1.1rem; }
    .btn-text[b-tksnalsh6f] { display: none; }
    .form-row[b-tksnalsh6f] { flex-direction: column; }
    .form-row-4[b-tksnalsh6f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tksnalsh6f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tksnalsh6f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tksnalsh6f] { padding: 0.75rem; }
    .modal-tabs[b-tksnalsh6f] { overflow-x: auto; }
    .modal-tab[b-tksnalsh6f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tksnalsh6f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tksnalsh6f] { display: grid !important; }
    .crud-cards-wrapper[b-tksnalsh6f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tksnalsh6f] { grid-template-columns: 1fr; }
    .card-details[b-tksnalsh6f] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tksnalsh6f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tksnalsh6f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tksnalsh6f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tksnalsh6f] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Factoring/Frmftr_rpt_movimientos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-opgedrtajx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-opgedrtajx 0.3s ease-out; }
@keyframes slideUp-b-opgedrtajx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-opgedrtajx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-opgedrtajx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-opgedrtajx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-opgedrtajx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-opgedrtajx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-opgedrtajx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-opgedrtajx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-opgedrtajx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-opgedrtajx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-opgedrtajx] { filter: brightness(1.1); }
.btn-outline[b-opgedrtajx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-opgedrtajx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-opgedrtajx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-opgedrtajx] { filter: brightness(1.1); }
.btn-icon[b-opgedrtajx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-opgedrtajx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-opgedrtajx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-opgedrtajx] { color: #ef4444; }
.btn-delete:hover[b-opgedrtajx] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-opgedrtajx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-opgedrtajx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-opgedrtajx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-opgedrtajx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-opgedrtajx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-opgedrtajx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-opgedrtajx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-opgedrtajx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-opgedrtajx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-opgedrtajx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-opgedrtajx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-opgedrtajx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-opgedrtajx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-opgedrtajx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-opgedrtajx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-opgedrtajx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-opgedrtajx] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-opgedrtajx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-opgedrtajx] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-opgedrtajx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-opgedrtajx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-opgedrtajx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-opgedrtajx] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-opgedrtajx] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-opgedrtajx] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-opgedrtajx] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-opgedrtajx] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-opgedrtajx] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-opgedrtajx] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-opgedrtajx] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-opgedrtajx] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-opgedrtajx] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-opgedrtajx] { display: block; }
.hide-on-cards[b-opgedrtajx] { display: none !important; }
.show-on-cards[b-opgedrtajx] { display: grid; }
.hide-on-grid[b-opgedrtajx] { display: none !important; }

/* Badges */
.badge[b-opgedrtajx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-opgedrtajx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-opgedrtajx] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-opgedrtajx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-opgedrtajx] { text-align: center; }
.text-muted[b-opgedrtajx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-opgedrtajx], .crud-empty-state[b-opgedrtajx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-opgedrtajx] { font-size: 2rem; }
.crud-spinner[b-opgedrtajx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-opgedrtajx 0.6s linear infinite; }
.crud-spinner-sm[b-opgedrtajx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-opgedrtajx 0.6s linear infinite; }
@keyframes spin-b-opgedrtajx { to { transform: rotate(360deg); } }
.spin[b-opgedrtajx] { animation: spin-b-opgedrtajx 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-opgedrtajx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-opgedrtajx 0.15s ease-out; }
.modal-container[b-opgedrtajx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-opgedrtajx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-opgedrtajx 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-opgedrtajx] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-opgedrtajx] { max-width: 420px; }
@keyframes fadeIn-b-opgedrtajx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-opgedrtajx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-opgedrtajx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-opgedrtajx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-opgedrtajx] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-opgedrtajx] { color: #dc2626; }
.modal-close[b-opgedrtajx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-opgedrtajx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-opgedrtajx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-opgedrtajx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-opgedrtajx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-opgedrtajx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-opgedrtajx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-opgedrtajx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-opgedrtajx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-opgedrtajx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-opgedrtajx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-opgedrtajx] { flex: 2; }
.form-group label[b-opgedrtajx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-opgedrtajx], .form-group select[b-opgedrtajx], .form-textarea[b-opgedrtajx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-opgedrtajx], .form-group select:focus[b-opgedrtajx], .form-textarea:focus[b-opgedrtajx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-opgedrtajx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-opgedrtajx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-opgedrtajx] { flex: 1; display: flex; align-items: center; }
.form-check[b-opgedrtajx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-opgedrtajx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-opgedrtajx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-opgedrtajx] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-opgedrtajx] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-opgedrtajx] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-opgedrtajx] { font-size: 3rem; }
.photo-placeholder span[b-opgedrtajx] { font-size: 0.78rem; }
.photo-actions[b-opgedrtajx] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-opgedrtajx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-opgedrtajx] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-opgedrtajx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-opgedrtajx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-opgedrtajx] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-opgedrtajx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-opgedrtajx] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-opgedrtajx] { filter: brightness(1.15); transform: scale(1.05); }
[b-opgedrtajx] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-opgedrtajx] { padding: 0.75rem; }
    .crud-header[b-opgedrtajx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-opgedrtajx] { font-size: 1.1rem; }
    .btn-text[b-opgedrtajx] { display: none; }
    .form-row[b-opgedrtajx] { flex-direction: column; }
    .form-row-4[b-opgedrtajx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-opgedrtajx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-opgedrtajx] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-opgedrtajx] { padding: 0.75rem; }
    .modal-tabs[b-opgedrtajx] { overflow-x: auto; }
    .modal-tab[b-opgedrtajx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-opgedrtajx] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-opgedrtajx] { display: grid !important; }
    .crud-cards-wrapper[b-opgedrtajx] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-opgedrtajx] { grid-template-columns: 1fr; }
    .card-details[b-opgedrtajx] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-opgedrtajx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-opgedrtajx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-opgedrtajx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-opgedrtajx] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Clsfacturacionlote_class1_frmfacturacionlote.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4h4clzzrmd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4h4clzzrmd 0.3s ease-out; }
@keyframes slideUp-b-4h4clzzrmd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4h4clzzrmd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4h4clzzrmd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4h4clzzrmd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4h4clzzrmd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4h4clzzrmd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4h4clzzrmd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4h4clzzrmd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4h4clzzrmd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4h4clzzrmd] { filter: brightness(1.1); }
.btn-outline[b-4h4clzzrmd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4h4clzzrmd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4h4clzzrmd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4h4clzzrmd] { filter: brightness(1.1); }
.btn-icon[b-4h4clzzrmd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4h4clzzrmd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4h4clzzrmd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4h4clzzrmd] { color: #ef4444; }
.btn-delete:hover[b-4h4clzzrmd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4h4clzzrmd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4h4clzzrmd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4h4clzzrmd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4h4clzzrmd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4h4clzzrmd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4h4clzzrmd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4h4clzzrmd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4h4clzzrmd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4h4clzzrmd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4h4clzzrmd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4h4clzzrmd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4h4clzzrmd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4h4clzzrmd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4h4clzzrmd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4h4clzzrmd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4h4clzzrmd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4h4clzzrmd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4h4clzzrmd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4h4clzzrmd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4h4clzzrmd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4h4clzzrmd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4h4clzzrmd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4h4clzzrmd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4h4clzzrmd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4h4clzzrmd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4h4clzzrmd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4h4clzzrmd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4h4clzzrmd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4h4clzzrmd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4h4clzzrmd] { display: block; }
.hide-on-cards[b-4h4clzzrmd] { display: none !important; }
.show-on-cards[b-4h4clzzrmd] { display: grid; }
.hide-on-grid[b-4h4clzzrmd] { display: none !important; }

/* Badges */
.badge[b-4h4clzzrmd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4h4clzzrmd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4h4clzzrmd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4h4clzzrmd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4h4clzzrmd] { text-align: center; }
.text-muted[b-4h4clzzrmd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4h4clzzrmd], .crud-empty-state[b-4h4clzzrmd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4h4clzzrmd] { font-size: 2rem; }
.crud-spinner[b-4h4clzzrmd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4h4clzzrmd 0.6s linear infinite; }
.crud-spinner-sm[b-4h4clzzrmd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4h4clzzrmd 0.6s linear infinite; }
@keyframes spin-b-4h4clzzrmd { to { transform: rotate(360deg); } }
.spin[b-4h4clzzrmd] { animation: spin-b-4h4clzzrmd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4h4clzzrmd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4h4clzzrmd 0.15s ease-out; }
.modal-container[b-4h4clzzrmd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4h4clzzrmd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4h4clzzrmd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4h4clzzrmd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4h4clzzrmd] { max-width: 420px; }
@keyframes fadeIn-b-4h4clzzrmd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4h4clzzrmd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4h4clzzrmd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4h4clzzrmd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4h4clzzrmd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4h4clzzrmd] { color: #dc2626; }
.modal-close[b-4h4clzzrmd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4h4clzzrmd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4h4clzzrmd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4h4clzzrmd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4h4clzzrmd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4h4clzzrmd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4h4clzzrmd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4h4clzzrmd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4h4clzzrmd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4h4clzzrmd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4h4clzzrmd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4h4clzzrmd] { flex: 2; }
.form-group label[b-4h4clzzrmd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4h4clzzrmd], .form-group select[b-4h4clzzrmd], .form-textarea[b-4h4clzzrmd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4h4clzzrmd], .form-group select:focus[b-4h4clzzrmd], .form-textarea:focus[b-4h4clzzrmd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4h4clzzrmd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4h4clzzrmd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4h4clzzrmd] { flex: 1; display: flex; align-items: center; }
.form-check[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4h4clzzrmd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4h4clzzrmd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4h4clzzrmd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4h4clzzrmd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4h4clzzrmd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4h4clzzrmd] { font-size: 3rem; }
.photo-placeholder span[b-4h4clzzrmd] { font-size: 0.78rem; }
.photo-actions[b-4h4clzzrmd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4h4clzzrmd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4h4clzzrmd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4h4clzzrmd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4h4clzzrmd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4h4clzzrmd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4h4clzzrmd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4h4clzzrmd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4h4clzzrmd] { filter: brightness(1.15); transform: scale(1.05); }
[b-4h4clzzrmd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4h4clzzrmd] { padding: 0.75rem; }
    .crud-header[b-4h4clzzrmd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4h4clzzrmd] { font-size: 1.1rem; }
    .btn-text[b-4h4clzzrmd] { display: none; }
    .form-row[b-4h4clzzrmd] { flex-direction: column; }
    .form-row-4[b-4h4clzzrmd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4h4clzzrmd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4h4clzzrmd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4h4clzzrmd] { padding: 0.75rem; }
    .modal-tabs[b-4h4clzzrmd] { overflow-x: auto; }
    .modal-tab[b-4h4clzzrmd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4h4clzzrmd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4h4clzzrmd] { display: grid !important; }
    .crud-cards-wrapper[b-4h4clzzrmd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4h4clzzrmd] { grid-template-columns: 1fr; }
    .card-details[b-4h4clzzrmd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4h4clzzrmd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4h4clzzrmd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4h4clzzrmd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4h4clzzrmd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Conteofisicopv.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zbiivz7hqs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zbiivz7hqs 0.3s ease-out; }
@keyframes slideUp-b-zbiivz7hqs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zbiivz7hqs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zbiivz7hqs] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zbiivz7hqs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zbiivz7hqs] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zbiivz7hqs] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zbiivz7hqs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zbiivz7hqs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zbiivz7hqs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zbiivz7hqs] { filter: brightness(1.1); }
.btn-outline[b-zbiivz7hqs] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zbiivz7hqs] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zbiivz7hqs] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zbiivz7hqs] { filter: brightness(1.1); }
.btn-icon[b-zbiivz7hqs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zbiivz7hqs] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zbiivz7hqs] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zbiivz7hqs] { color: #ef4444; }
.btn-delete:hover[b-zbiivz7hqs] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zbiivz7hqs] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zbiivz7hqs] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zbiivz7hqs] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zbiivz7hqs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zbiivz7hqs] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zbiivz7hqs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zbiivz7hqs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zbiivz7hqs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zbiivz7hqs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zbiivz7hqs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zbiivz7hqs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zbiivz7hqs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zbiivz7hqs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zbiivz7hqs] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zbiivz7hqs] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zbiivz7hqs] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zbiivz7hqs] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zbiivz7hqs] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zbiivz7hqs] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zbiivz7hqs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zbiivz7hqs] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zbiivz7hqs] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zbiivz7hqs] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zbiivz7hqs] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zbiivz7hqs] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zbiivz7hqs] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zbiivz7hqs] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zbiivz7hqs] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zbiivz7hqs] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zbiivz7hqs] { display: block; }
.hide-on-cards[b-zbiivz7hqs] { display: none !important; }
.show-on-cards[b-zbiivz7hqs] { display: grid; }
.hide-on-grid[b-zbiivz7hqs] { display: none !important; }

/* Badges */
.badge[b-zbiivz7hqs] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zbiivz7hqs] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zbiivz7hqs] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zbiivz7hqs] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zbiivz7hqs] { text-align: center; }
.text-muted[b-zbiivz7hqs] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zbiivz7hqs], .crud-empty-state[b-zbiivz7hqs] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zbiivz7hqs] { font-size: 2rem; }
.crud-spinner[b-zbiivz7hqs] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zbiivz7hqs 0.6s linear infinite; }
.crud-spinner-sm[b-zbiivz7hqs] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zbiivz7hqs 0.6s linear infinite; }
@keyframes spin-b-zbiivz7hqs { to { transform: rotate(360deg); } }
.spin[b-zbiivz7hqs] { animation: spin-b-zbiivz7hqs 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zbiivz7hqs] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zbiivz7hqs 0.15s ease-out; }
.modal-container[b-zbiivz7hqs] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zbiivz7hqs] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zbiivz7hqs 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zbiivz7hqs] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zbiivz7hqs] { max-width: 420px; }
@keyframes fadeIn-b-zbiivz7hqs { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zbiivz7hqs { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zbiivz7hqs] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zbiivz7hqs] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zbiivz7hqs] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zbiivz7hqs] { color: #dc2626; }
.modal-close[b-zbiivz7hqs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zbiivz7hqs] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zbiivz7hqs] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zbiivz7hqs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zbiivz7hqs] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zbiivz7hqs] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zbiivz7hqs] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zbiivz7hqs] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zbiivz7hqs] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zbiivz7hqs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zbiivz7hqs] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zbiivz7hqs] { flex: 2; }
.form-group label[b-zbiivz7hqs] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zbiivz7hqs], .form-group select[b-zbiivz7hqs], .form-textarea[b-zbiivz7hqs] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zbiivz7hqs], .form-group select:focus[b-zbiivz7hqs], .form-textarea:focus[b-zbiivz7hqs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zbiivz7hqs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zbiivz7hqs] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zbiivz7hqs] { flex: 1; display: flex; align-items: center; }
.form-check[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zbiivz7hqs] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zbiivz7hqs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zbiivz7hqs] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zbiivz7hqs] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zbiivz7hqs] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zbiivz7hqs] { font-size: 3rem; }
.photo-placeholder span[b-zbiivz7hqs] { font-size: 0.78rem; }
.photo-actions[b-zbiivz7hqs] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zbiivz7hqs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zbiivz7hqs] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zbiivz7hqs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zbiivz7hqs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zbiivz7hqs] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zbiivz7hqs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zbiivz7hqs] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zbiivz7hqs] { filter: brightness(1.15); transform: scale(1.05); }
[b-zbiivz7hqs] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zbiivz7hqs] { padding: 0.75rem; }
    .crud-header[b-zbiivz7hqs] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zbiivz7hqs] { font-size: 1.1rem; }
    .btn-text[b-zbiivz7hqs] { display: none; }
    .form-row[b-zbiivz7hqs] { flex-direction: column; }
    .form-row-4[b-zbiivz7hqs] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zbiivz7hqs] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zbiivz7hqs] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zbiivz7hqs] { padding: 0.75rem; }
    .modal-tabs[b-zbiivz7hqs] { overflow-x: auto; }
    .modal-tab[b-zbiivz7hqs] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zbiivz7hqs] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zbiivz7hqs] { display: grid !important; }
    .crud-cards-wrapper[b-zbiivz7hqs] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zbiivz7hqs] { grid-template-columns: 1fr; }
    .card-details[b-zbiivz7hqs] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zbiivz7hqs] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zbiivz7hqs] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zbiivz7hqs] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zbiivz7hqs] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmanulacionitems.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ije2tdkdwe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ije2tdkdwe 0.3s ease-out; }
@keyframes slideUp-b-ije2tdkdwe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ije2tdkdwe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ije2tdkdwe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ije2tdkdwe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ije2tdkdwe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ije2tdkdwe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ije2tdkdwe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ije2tdkdwe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ije2tdkdwe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ije2tdkdwe] { filter: brightness(1.1); }
.btn-outline[b-ije2tdkdwe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ije2tdkdwe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ije2tdkdwe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ije2tdkdwe] { filter: brightness(1.1); }
.btn-icon[b-ije2tdkdwe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ije2tdkdwe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ije2tdkdwe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ije2tdkdwe] { color: #ef4444; }
.btn-delete:hover[b-ije2tdkdwe] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ije2tdkdwe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ije2tdkdwe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ije2tdkdwe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ije2tdkdwe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ije2tdkdwe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ije2tdkdwe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ije2tdkdwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ije2tdkdwe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ije2tdkdwe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ije2tdkdwe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ije2tdkdwe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ije2tdkdwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ije2tdkdwe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ije2tdkdwe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ije2tdkdwe] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ije2tdkdwe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ije2tdkdwe] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ije2tdkdwe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ije2tdkdwe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ije2tdkdwe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ije2tdkdwe] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ije2tdkdwe] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ije2tdkdwe] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ije2tdkdwe] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ije2tdkdwe] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ije2tdkdwe] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ije2tdkdwe] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ije2tdkdwe] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ije2tdkdwe] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ije2tdkdwe] { display: block; }
.hide-on-cards[b-ije2tdkdwe] { display: none !important; }
.show-on-cards[b-ije2tdkdwe] { display: grid; }
.hide-on-grid[b-ije2tdkdwe] { display: none !important; }

/* Badges */
.badge[b-ije2tdkdwe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ije2tdkdwe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ije2tdkdwe] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ije2tdkdwe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ije2tdkdwe] { text-align: center; }
.text-muted[b-ije2tdkdwe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ije2tdkdwe], .crud-empty-state[b-ije2tdkdwe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ije2tdkdwe] { font-size: 2rem; }
.crud-spinner[b-ije2tdkdwe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ije2tdkdwe 0.6s linear infinite; }
.crud-spinner-sm[b-ije2tdkdwe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ije2tdkdwe 0.6s linear infinite; }
@keyframes spin-b-ije2tdkdwe { to { transform: rotate(360deg); } }
.spin[b-ije2tdkdwe] { animation: spin-b-ije2tdkdwe 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ije2tdkdwe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ije2tdkdwe 0.15s ease-out; }
.modal-container[b-ije2tdkdwe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ije2tdkdwe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ije2tdkdwe 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ije2tdkdwe] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ije2tdkdwe] { max-width: 420px; }
@keyframes fadeIn-b-ije2tdkdwe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ije2tdkdwe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ije2tdkdwe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ije2tdkdwe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ije2tdkdwe] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ije2tdkdwe] { color: #dc2626; }
.modal-close[b-ije2tdkdwe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ije2tdkdwe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ije2tdkdwe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ije2tdkdwe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ije2tdkdwe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ije2tdkdwe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ije2tdkdwe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ije2tdkdwe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ije2tdkdwe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ije2tdkdwe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ije2tdkdwe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ije2tdkdwe] { flex: 2; }
.form-group label[b-ije2tdkdwe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ije2tdkdwe], .form-group select[b-ije2tdkdwe], .form-textarea[b-ije2tdkdwe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ije2tdkdwe], .form-group select:focus[b-ije2tdkdwe], .form-textarea:focus[b-ije2tdkdwe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ije2tdkdwe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ije2tdkdwe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ije2tdkdwe] { flex: 1; display: flex; align-items: center; }
.form-check[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ije2tdkdwe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ije2tdkdwe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ije2tdkdwe] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ije2tdkdwe] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ije2tdkdwe] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ije2tdkdwe] { font-size: 3rem; }
.photo-placeholder span[b-ije2tdkdwe] { font-size: 0.78rem; }
.photo-actions[b-ije2tdkdwe] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ije2tdkdwe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ije2tdkdwe] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ije2tdkdwe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ije2tdkdwe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ije2tdkdwe] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ije2tdkdwe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ije2tdkdwe] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ije2tdkdwe] { filter: brightness(1.15); transform: scale(1.05); }
[b-ije2tdkdwe] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ije2tdkdwe] { padding: 0.75rem; }
    .crud-header[b-ije2tdkdwe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ije2tdkdwe] { font-size: 1.1rem; }
    .btn-text[b-ije2tdkdwe] { display: none; }
    .form-row[b-ije2tdkdwe] { flex-direction: column; }
    .form-row-4[b-ije2tdkdwe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ije2tdkdwe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ije2tdkdwe] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ije2tdkdwe] { padding: 0.75rem; }
    .modal-tabs[b-ije2tdkdwe] { overflow-x: auto; }
    .modal-tab[b-ije2tdkdwe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ije2tdkdwe] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ije2tdkdwe] { display: grid !important; }
    .crud-cards-wrapper[b-ije2tdkdwe] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ije2tdkdwe] { grid-template-columns: 1fr; }
    .card-details[b-ije2tdkdwe] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ije2tdkdwe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ije2tdkdwe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ije2tdkdwe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ije2tdkdwe] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmanulacionitemsmonto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vqx96amfje] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vqx96amfje 0.3s ease-out; }
@keyframes slideUp-b-vqx96amfje { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vqx96amfje] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vqx96amfje] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vqx96amfje] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vqx96amfje] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vqx96amfje] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vqx96amfje] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vqx96amfje] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vqx96amfje] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vqx96amfje] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vqx96amfje] { filter: brightness(1.1); }
.btn-outline[b-vqx96amfje] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vqx96amfje] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vqx96amfje] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vqx96amfje] { filter: brightness(1.1); }
.btn-icon[b-vqx96amfje] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vqx96amfje] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vqx96amfje] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vqx96amfje] { color: #ef4444; }
.btn-delete:hover[b-vqx96amfje] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vqx96amfje] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vqx96amfje] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vqx96amfje] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vqx96amfje] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vqx96amfje] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vqx96amfje] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vqx96amfje] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vqx96amfje] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vqx96amfje] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vqx96amfje] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vqx96amfje] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vqx96amfje] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vqx96amfje] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vqx96amfje] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vqx96amfje] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vqx96amfje] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vqx96amfje] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vqx96amfje] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vqx96amfje] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vqx96amfje] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vqx96amfje] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vqx96amfje] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vqx96amfje] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vqx96amfje] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vqx96amfje] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vqx96amfje] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vqx96amfje] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vqx96amfje] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vqx96amfje] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vqx96amfje] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vqx96amfje] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vqx96amfje] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vqx96amfje] { display: block; }
.hide-on-cards[b-vqx96amfje] { display: none !important; }
.show-on-cards[b-vqx96amfje] { display: grid; }
.hide-on-grid[b-vqx96amfje] { display: none !important; }

/* Badges */
.badge[b-vqx96amfje] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vqx96amfje] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vqx96amfje] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vqx96amfje] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vqx96amfje] { text-align: center; }
.text-muted[b-vqx96amfje] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vqx96amfje], .crud-empty-state[b-vqx96amfje] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vqx96amfje] { font-size: 2rem; }
.crud-spinner[b-vqx96amfje] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vqx96amfje 0.6s linear infinite; }
.crud-spinner-sm[b-vqx96amfje] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vqx96amfje 0.6s linear infinite; }
@keyframes spin-b-vqx96amfje { to { transform: rotate(360deg); } }
.spin[b-vqx96amfje] { animation: spin-b-vqx96amfje 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vqx96amfje] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vqx96amfje 0.15s ease-out; }
.modal-container[b-vqx96amfje] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vqx96amfje] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vqx96amfje 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vqx96amfje] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vqx96amfje] { max-width: 420px; }
@keyframes fadeIn-b-vqx96amfje { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vqx96amfje { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vqx96amfje] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vqx96amfje] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vqx96amfje] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vqx96amfje] { color: #dc2626; }
.modal-close[b-vqx96amfje] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vqx96amfje] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vqx96amfje] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vqx96amfje] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vqx96amfje] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vqx96amfje] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vqx96amfje] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vqx96amfje] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vqx96amfje] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vqx96amfje] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vqx96amfje] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vqx96amfje] { flex: 2; }
.form-group label[b-vqx96amfje] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vqx96amfje], .form-group select[b-vqx96amfje], .form-textarea[b-vqx96amfje] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vqx96amfje], .form-group select:focus[b-vqx96amfje], .form-textarea:focus[b-vqx96amfje] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vqx96amfje] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vqx96amfje] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vqx96amfje] { flex: 1; display: flex; align-items: center; }
.form-check[b-vqx96amfje] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vqx96amfje] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vqx96amfje] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vqx96amfje] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vqx96amfje] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vqx96amfje] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vqx96amfje] { font-size: 3rem; }
.photo-placeholder span[b-vqx96amfje] { font-size: 0.78rem; }
.photo-actions[b-vqx96amfje] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vqx96amfje] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vqx96amfje] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vqx96amfje] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vqx96amfje] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vqx96amfje] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vqx96amfje] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vqx96amfje] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vqx96amfje] { filter: brightness(1.15); transform: scale(1.05); }
[b-vqx96amfje] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vqx96amfje] { padding: 0.75rem; }
    .crud-header[b-vqx96amfje] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vqx96amfje] { font-size: 1.1rem; }
    .btn-text[b-vqx96amfje] { display: none; }
    .form-row[b-vqx96amfje] { flex-direction: column; }
    .form-row-4[b-vqx96amfje] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vqx96amfje] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vqx96amfje] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vqx96amfje] { padding: 0.75rem; }
    .modal-tabs[b-vqx96amfje] { overflow-x: auto; }
    .modal-tab[b-vqx96amfje] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vqx96amfje] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vqx96amfje] { display: grid !important; }
    .crud-cards-wrapper[b-vqx96amfje] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vqx96amfje] { grid-template-columns: 1fr; }
    .card-details[b-vqx96amfje] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vqx96amfje] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vqx96amfje] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vqx96amfje] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vqx96amfje] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmasignatarjetacliente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-r90wbnspcd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-r90wbnspcd 0.3s ease-out; }
@keyframes slideUp-b-r90wbnspcd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-r90wbnspcd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-r90wbnspcd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-r90wbnspcd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-r90wbnspcd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-r90wbnspcd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-r90wbnspcd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-r90wbnspcd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-r90wbnspcd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-r90wbnspcd] { filter: brightness(1.1); }
.btn-outline[b-r90wbnspcd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-r90wbnspcd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-r90wbnspcd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-r90wbnspcd] { filter: brightness(1.1); }
.btn-icon[b-r90wbnspcd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-r90wbnspcd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-r90wbnspcd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-r90wbnspcd] { color: #ef4444; }
.btn-delete:hover[b-r90wbnspcd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-r90wbnspcd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-r90wbnspcd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-r90wbnspcd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-r90wbnspcd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-r90wbnspcd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-r90wbnspcd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-r90wbnspcd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-r90wbnspcd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-r90wbnspcd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-r90wbnspcd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-r90wbnspcd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-r90wbnspcd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-r90wbnspcd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-r90wbnspcd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-r90wbnspcd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-r90wbnspcd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-r90wbnspcd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-r90wbnspcd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-r90wbnspcd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-r90wbnspcd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-r90wbnspcd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-r90wbnspcd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-r90wbnspcd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-r90wbnspcd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-r90wbnspcd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-r90wbnspcd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-r90wbnspcd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-r90wbnspcd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-r90wbnspcd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-r90wbnspcd] { display: block; }
.hide-on-cards[b-r90wbnspcd] { display: none !important; }
.show-on-cards[b-r90wbnspcd] { display: grid; }
.hide-on-grid[b-r90wbnspcd] { display: none !important; }

/* Badges */
.badge[b-r90wbnspcd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-r90wbnspcd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-r90wbnspcd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-r90wbnspcd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-r90wbnspcd] { text-align: center; }
.text-muted[b-r90wbnspcd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-r90wbnspcd], .crud-empty-state[b-r90wbnspcd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-r90wbnspcd] { font-size: 2rem; }
.crud-spinner[b-r90wbnspcd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-r90wbnspcd 0.6s linear infinite; }
.crud-spinner-sm[b-r90wbnspcd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-r90wbnspcd 0.6s linear infinite; }
@keyframes spin-b-r90wbnspcd { to { transform: rotate(360deg); } }
.spin[b-r90wbnspcd] { animation: spin-b-r90wbnspcd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-r90wbnspcd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-r90wbnspcd 0.15s ease-out; }
.modal-container[b-r90wbnspcd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-r90wbnspcd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-r90wbnspcd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-r90wbnspcd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-r90wbnspcd] { max-width: 420px; }
@keyframes fadeIn-b-r90wbnspcd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-r90wbnspcd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-r90wbnspcd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-r90wbnspcd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-r90wbnspcd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-r90wbnspcd] { color: #dc2626; }
.modal-close[b-r90wbnspcd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-r90wbnspcd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-r90wbnspcd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-r90wbnspcd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-r90wbnspcd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-r90wbnspcd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-r90wbnspcd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-r90wbnspcd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-r90wbnspcd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-r90wbnspcd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-r90wbnspcd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-r90wbnspcd] { flex: 2; }
.form-group label[b-r90wbnspcd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-r90wbnspcd], .form-group select[b-r90wbnspcd], .form-textarea[b-r90wbnspcd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-r90wbnspcd], .form-group select:focus[b-r90wbnspcd], .form-textarea:focus[b-r90wbnspcd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-r90wbnspcd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-r90wbnspcd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-r90wbnspcd] { flex: 1; display: flex; align-items: center; }
.form-check[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-r90wbnspcd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-r90wbnspcd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-r90wbnspcd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-r90wbnspcd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-r90wbnspcd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-r90wbnspcd] { font-size: 3rem; }
.photo-placeholder span[b-r90wbnspcd] { font-size: 0.78rem; }
.photo-actions[b-r90wbnspcd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-r90wbnspcd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-r90wbnspcd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-r90wbnspcd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-r90wbnspcd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-r90wbnspcd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-r90wbnspcd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-r90wbnspcd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-r90wbnspcd] { filter: brightness(1.15); transform: scale(1.05); }
[b-r90wbnspcd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-r90wbnspcd] { padding: 0.75rem; }
    .crud-header[b-r90wbnspcd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-r90wbnspcd] { font-size: 1.1rem; }
    .btn-text[b-r90wbnspcd] { display: none; }
    .form-row[b-r90wbnspcd] { flex-direction: column; }
    .form-row-4[b-r90wbnspcd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-r90wbnspcd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-r90wbnspcd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-r90wbnspcd] { padding: 0.75rem; }
    .modal-tabs[b-r90wbnspcd] { overflow-x: auto; }
    .modal-tab[b-r90wbnspcd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-r90wbnspcd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-r90wbnspcd] { display: grid !important; }
    .crud-cards-wrapper[b-r90wbnspcd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-r90wbnspcd] { grid-template-columns: 1fr; }
    .card-details[b-r90wbnspcd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-r90wbnspcd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-r90wbnspcd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-r90wbnspcd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-r90wbnspcd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmcolores.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-cl8e701wcu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-cl8e701wcu 0.3s ease-out; }
@keyframes slideUp-b-cl8e701wcu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-cl8e701wcu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-cl8e701wcu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-cl8e701wcu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-cl8e701wcu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-cl8e701wcu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-cl8e701wcu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-cl8e701wcu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-cl8e701wcu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-cl8e701wcu] { filter: brightness(1.1); }
.btn-outline[b-cl8e701wcu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-cl8e701wcu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-cl8e701wcu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-cl8e701wcu] { filter: brightness(1.1); }
.btn-icon[b-cl8e701wcu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-cl8e701wcu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-cl8e701wcu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-cl8e701wcu] { color: #ef4444; }
.btn-delete:hover[b-cl8e701wcu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-cl8e701wcu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-cl8e701wcu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-cl8e701wcu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-cl8e701wcu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-cl8e701wcu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-cl8e701wcu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-cl8e701wcu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-cl8e701wcu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-cl8e701wcu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-cl8e701wcu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-cl8e701wcu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-cl8e701wcu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-cl8e701wcu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-cl8e701wcu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-cl8e701wcu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-cl8e701wcu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-cl8e701wcu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-cl8e701wcu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-cl8e701wcu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-cl8e701wcu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-cl8e701wcu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-cl8e701wcu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-cl8e701wcu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-cl8e701wcu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-cl8e701wcu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-cl8e701wcu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-cl8e701wcu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-cl8e701wcu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-cl8e701wcu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-cl8e701wcu] { display: block; }
.hide-on-cards[b-cl8e701wcu] { display: none !important; }
.show-on-cards[b-cl8e701wcu] { display: grid; }
.hide-on-grid[b-cl8e701wcu] { display: none !important; }

/* Badges */
.badge[b-cl8e701wcu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-cl8e701wcu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-cl8e701wcu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-cl8e701wcu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-cl8e701wcu] { text-align: center; }
.text-muted[b-cl8e701wcu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-cl8e701wcu], .crud-empty-state[b-cl8e701wcu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-cl8e701wcu] { font-size: 2rem; }
.crud-spinner[b-cl8e701wcu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-cl8e701wcu 0.6s linear infinite; }
.crud-spinner-sm[b-cl8e701wcu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-cl8e701wcu 0.6s linear infinite; }
@keyframes spin-b-cl8e701wcu { to { transform: rotate(360deg); } }
.spin[b-cl8e701wcu] { animation: spin-b-cl8e701wcu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-cl8e701wcu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-cl8e701wcu 0.15s ease-out; }
.modal-container[b-cl8e701wcu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-cl8e701wcu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-cl8e701wcu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-cl8e701wcu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-cl8e701wcu] { max-width: 420px; }
@keyframes fadeIn-b-cl8e701wcu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-cl8e701wcu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-cl8e701wcu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-cl8e701wcu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-cl8e701wcu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-cl8e701wcu] { color: #dc2626; }
.modal-close[b-cl8e701wcu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-cl8e701wcu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-cl8e701wcu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-cl8e701wcu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-cl8e701wcu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-cl8e701wcu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-cl8e701wcu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-cl8e701wcu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-cl8e701wcu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-cl8e701wcu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-cl8e701wcu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-cl8e701wcu] { flex: 2; }
.form-group label[b-cl8e701wcu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-cl8e701wcu], .form-group select[b-cl8e701wcu], .form-textarea[b-cl8e701wcu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-cl8e701wcu], .form-group select:focus[b-cl8e701wcu], .form-textarea:focus[b-cl8e701wcu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-cl8e701wcu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-cl8e701wcu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-cl8e701wcu] { flex: 1; display: flex; align-items: center; }
.form-check[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-cl8e701wcu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-cl8e701wcu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-cl8e701wcu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-cl8e701wcu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-cl8e701wcu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-cl8e701wcu] { font-size: 3rem; }
.photo-placeholder span[b-cl8e701wcu] { font-size: 0.78rem; }
.photo-actions[b-cl8e701wcu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-cl8e701wcu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-cl8e701wcu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-cl8e701wcu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-cl8e701wcu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-cl8e701wcu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-cl8e701wcu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-cl8e701wcu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-cl8e701wcu] { filter: brightness(1.15); transform: scale(1.05); }
[b-cl8e701wcu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-cl8e701wcu] { padding: 0.75rem; }
    .crud-header[b-cl8e701wcu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-cl8e701wcu] { font-size: 1.1rem; }
    .btn-text[b-cl8e701wcu] { display: none; }
    .form-row[b-cl8e701wcu] { flex-direction: column; }
    .form-row-4[b-cl8e701wcu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-cl8e701wcu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-cl8e701wcu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-cl8e701wcu] { padding: 0.75rem; }
    .modal-tabs[b-cl8e701wcu] { overflow-x: auto; }
    .modal-tab[b-cl8e701wcu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-cl8e701wcu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-cl8e701wcu] { display: grid !important; }
    .crud-cards-wrapper[b-cl8e701wcu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-cl8e701wcu] { grid-template-columns: 1fr; }
    .card-details[b-cl8e701wcu] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-cl8e701wcu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cl8e701wcu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cl8e701wcu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cl8e701wcu] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmcomboproductoseteo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-dyx21jx53f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-dyx21jx53f 0.3s ease-out; }
@keyframes slideUp-b-dyx21jx53f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-dyx21jx53f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dyx21jx53f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-dyx21jx53f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-dyx21jx53f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-dyx21jx53f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-dyx21jx53f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dyx21jx53f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dyx21jx53f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dyx21jx53f] { filter: brightness(1.1); }
.btn-outline[b-dyx21jx53f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dyx21jx53f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dyx21jx53f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dyx21jx53f] { filter: brightness(1.1); }
.btn-icon[b-dyx21jx53f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-dyx21jx53f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-dyx21jx53f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-dyx21jx53f] { color: #ef4444; }
.btn-delete:hover[b-dyx21jx53f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-dyx21jx53f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-dyx21jx53f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-dyx21jx53f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-dyx21jx53f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-dyx21jx53f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-dyx21jx53f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-dyx21jx53f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-dyx21jx53f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-dyx21jx53f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-dyx21jx53f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-dyx21jx53f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dyx21jx53f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-dyx21jx53f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-dyx21jx53f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-dyx21jx53f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-dyx21jx53f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-dyx21jx53f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-dyx21jx53f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-dyx21jx53f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-dyx21jx53f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-dyx21jx53f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-dyx21jx53f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-dyx21jx53f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-dyx21jx53f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-dyx21jx53f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-dyx21jx53f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-dyx21jx53f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-dyx21jx53f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-dyx21jx53f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-dyx21jx53f] { display: block; }
.hide-on-cards[b-dyx21jx53f] { display: none !important; }
.show-on-cards[b-dyx21jx53f] { display: grid; }
.hide-on-grid[b-dyx21jx53f] { display: none !important; }

/* Badges */
.badge[b-dyx21jx53f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-dyx21jx53f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-dyx21jx53f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-dyx21jx53f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-dyx21jx53f] { text-align: center; }
.text-muted[b-dyx21jx53f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-dyx21jx53f], .crud-empty-state[b-dyx21jx53f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-dyx21jx53f] { font-size: 2rem; }
.crud-spinner[b-dyx21jx53f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-dyx21jx53f 0.6s linear infinite; }
.crud-spinner-sm[b-dyx21jx53f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-dyx21jx53f 0.6s linear infinite; }
@keyframes spin-b-dyx21jx53f { to { transform: rotate(360deg); } }
.spin[b-dyx21jx53f] { animation: spin-b-dyx21jx53f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-dyx21jx53f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-dyx21jx53f 0.15s ease-out; }
.modal-container[b-dyx21jx53f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-dyx21jx53f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-dyx21jx53f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-dyx21jx53f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-dyx21jx53f] { max-width: 420px; }
@keyframes fadeIn-b-dyx21jx53f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-dyx21jx53f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-dyx21jx53f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-dyx21jx53f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-dyx21jx53f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-dyx21jx53f] { color: #dc2626; }
.modal-close[b-dyx21jx53f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-dyx21jx53f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-dyx21jx53f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-dyx21jx53f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-dyx21jx53f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-dyx21jx53f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-dyx21jx53f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-dyx21jx53f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-dyx21jx53f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-dyx21jx53f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dyx21jx53f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-dyx21jx53f] { flex: 2; }
.form-group label[b-dyx21jx53f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dyx21jx53f], .form-group select[b-dyx21jx53f], .form-textarea[b-dyx21jx53f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-dyx21jx53f], .form-group select:focus[b-dyx21jx53f], .form-textarea:focus[b-dyx21jx53f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-dyx21jx53f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-dyx21jx53f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-dyx21jx53f] { flex: 1; display: flex; align-items: center; }
.form-check[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-dyx21jx53f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-dyx21jx53f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-dyx21jx53f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-dyx21jx53f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-dyx21jx53f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-dyx21jx53f] { font-size: 3rem; }
.photo-placeholder span[b-dyx21jx53f] { font-size: 0.78rem; }
.photo-actions[b-dyx21jx53f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-dyx21jx53f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-dyx21jx53f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-dyx21jx53f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-dyx21jx53f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-dyx21jx53f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-dyx21jx53f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-dyx21jx53f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-dyx21jx53f] { filter: brightness(1.15); transform: scale(1.05); }
[b-dyx21jx53f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-dyx21jx53f] { padding: 0.75rem; }
    .crud-header[b-dyx21jx53f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-dyx21jx53f] { font-size: 1.1rem; }
    .btn-text[b-dyx21jx53f] { display: none; }
    .form-row[b-dyx21jx53f] { flex-direction: column; }
    .form-row-4[b-dyx21jx53f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-dyx21jx53f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-dyx21jx53f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-dyx21jx53f] { padding: 0.75rem; }
    .modal-tabs[b-dyx21jx53f] { overflow-x: auto; }
    .modal-tab[b-dyx21jx53f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-dyx21jx53f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-dyx21jx53f] { display: grid !important; }
    .crud-cards-wrapper[b-dyx21jx53f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-dyx21jx53f] { grid-template-columns: 1fr; }
    .card-details[b-dyx21jx53f] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-dyx21jx53f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-dyx21jx53f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-dyx21jx53f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-dyx21jx53f] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmconteofisicovspc.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-wn989z4ssm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wn989z4ssm 0.3s ease-out; }
@keyframes slideUp-b-wn989z4ssm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wn989z4ssm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wn989z4ssm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wn989z4ssm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wn989z4ssm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wn989z4ssm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wn989z4ssm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wn989z4ssm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wn989z4ssm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wn989z4ssm] { filter: brightness(1.1); }
.btn-outline[b-wn989z4ssm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wn989z4ssm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wn989z4ssm] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wn989z4ssm] { filter: brightness(1.1); }
.btn-icon[b-wn989z4ssm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wn989z4ssm] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wn989z4ssm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wn989z4ssm] { color: #ef4444; }
.btn-delete:hover[b-wn989z4ssm] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-wn989z4ssm] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wn989z4ssm] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wn989z4ssm] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wn989z4ssm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wn989z4ssm] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wn989z4ssm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-wn989z4ssm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wn989z4ssm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-wn989z4ssm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wn989z4ssm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wn989z4ssm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wn989z4ssm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wn989z4ssm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wn989z4ssm] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wn989z4ssm] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-wn989z4ssm] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-wn989z4ssm] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-wn989z4ssm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-wn989z4ssm] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-wn989z4ssm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-wn989z4ssm] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-wn989z4ssm] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-wn989z4ssm] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-wn989z4ssm] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-wn989z4ssm] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-wn989z4ssm] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-wn989z4ssm] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-wn989z4ssm] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-wn989z4ssm] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-wn989z4ssm] { display: block; }
.hide-on-cards[b-wn989z4ssm] { display: none !important; }
.show-on-cards[b-wn989z4ssm] { display: grid; }
.hide-on-grid[b-wn989z4ssm] { display: none !important; }

/* Badges */
.badge[b-wn989z4ssm] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wn989z4ssm] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wn989z4ssm] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-wn989z4ssm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wn989z4ssm] { text-align: center; }
.text-muted[b-wn989z4ssm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wn989z4ssm], .crud-empty-state[b-wn989z4ssm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wn989z4ssm] { font-size: 2rem; }
.crud-spinner[b-wn989z4ssm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wn989z4ssm 0.6s linear infinite; }
.crud-spinner-sm[b-wn989z4ssm] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wn989z4ssm 0.6s linear infinite; }
@keyframes spin-b-wn989z4ssm { to { transform: rotate(360deg); } }
.spin[b-wn989z4ssm] { animation: spin-b-wn989z4ssm 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-wn989z4ssm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wn989z4ssm 0.15s ease-out; }
.modal-container[b-wn989z4ssm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wn989z4ssm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wn989z4ssm 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-wn989z4ssm] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-wn989z4ssm] { max-width: 420px; }
@keyframes fadeIn-b-wn989z4ssm { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wn989z4ssm { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wn989z4ssm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wn989z4ssm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-wn989z4ssm] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-wn989z4ssm] { color: #dc2626; }
.modal-close[b-wn989z4ssm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wn989z4ssm] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wn989z4ssm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wn989z4ssm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wn989z4ssm] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-wn989z4ssm] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wn989z4ssm] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wn989z4ssm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wn989z4ssm] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wn989z4ssm] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wn989z4ssm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wn989z4ssm] { flex: 2; }
.form-group label[b-wn989z4ssm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wn989z4ssm], .form-group select[b-wn989z4ssm], .form-textarea[b-wn989z4ssm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wn989z4ssm], .form-group select:focus[b-wn989z4ssm], .form-textarea:focus[b-wn989z4ssm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wn989z4ssm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wn989z4ssm] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wn989z4ssm] { flex: 1; display: flex; align-items: center; }
.form-check[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wn989z4ssm] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-wn989z4ssm] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-wn989z4ssm] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-wn989z4ssm] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-wn989z4ssm] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-wn989z4ssm] { font-size: 3rem; }
.photo-placeholder span[b-wn989z4ssm] { font-size: 0.78rem; }
.photo-actions[b-wn989z4ssm] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-wn989z4ssm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-wn989z4ssm] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-wn989z4ssm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-wn989z4ssm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-wn989z4ssm] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-wn989z4ssm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-wn989z4ssm] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-wn989z4ssm] { filter: brightness(1.15); transform: scale(1.05); }
[b-wn989z4ssm] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wn989z4ssm] { padding: 0.75rem; }
    .crud-header[b-wn989z4ssm] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wn989z4ssm] { font-size: 1.1rem; }
    .btn-text[b-wn989z4ssm] { display: none; }
    .form-row[b-wn989z4ssm] { flex-direction: column; }
    .form-row-4[b-wn989z4ssm] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wn989z4ssm] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wn989z4ssm] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-wn989z4ssm] { padding: 0.75rem; }
    .modal-tabs[b-wn989z4ssm] { overflow-x: auto; }
    .modal-tab[b-wn989z4ssm] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-wn989z4ssm] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-wn989z4ssm] { display: grid !important; }
    .crud-cards-wrapper[b-wn989z4ssm] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-wn989z4ssm] { grid-template-columns: 1fr; }
    .card-details[b-wn989z4ssm] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-wn989z4ssm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wn989z4ssm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wn989z4ssm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wn989z4ssm] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfacturaemitidas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kt59wp8tzl] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kt59wp8tzl 0.3s ease-out; }
@keyframes slideUp-b-kt59wp8tzl { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kt59wp8tzl] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kt59wp8tzl] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kt59wp8tzl] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kt59wp8tzl] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kt59wp8tzl] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kt59wp8tzl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kt59wp8tzl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kt59wp8tzl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kt59wp8tzl] { filter: brightness(1.1); }
.btn-outline[b-kt59wp8tzl] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kt59wp8tzl] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kt59wp8tzl] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kt59wp8tzl] { filter: brightness(1.1); }
.btn-icon[b-kt59wp8tzl] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kt59wp8tzl] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kt59wp8tzl] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kt59wp8tzl] { color: #ef4444; }
.btn-delete:hover[b-kt59wp8tzl] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kt59wp8tzl] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kt59wp8tzl] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kt59wp8tzl] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kt59wp8tzl] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kt59wp8tzl] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kt59wp8tzl] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kt59wp8tzl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kt59wp8tzl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kt59wp8tzl] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kt59wp8tzl] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kt59wp8tzl] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kt59wp8tzl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kt59wp8tzl] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kt59wp8tzl] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kt59wp8tzl] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kt59wp8tzl] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kt59wp8tzl] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kt59wp8tzl] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kt59wp8tzl] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kt59wp8tzl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kt59wp8tzl] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kt59wp8tzl] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kt59wp8tzl] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kt59wp8tzl] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kt59wp8tzl] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kt59wp8tzl] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kt59wp8tzl] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kt59wp8tzl] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kt59wp8tzl] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kt59wp8tzl] { display: block; }
.hide-on-cards[b-kt59wp8tzl] { display: none !important; }
.show-on-cards[b-kt59wp8tzl] { display: grid; }
.hide-on-grid[b-kt59wp8tzl] { display: none !important; }

/* Badges */
.badge[b-kt59wp8tzl] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kt59wp8tzl] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kt59wp8tzl] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kt59wp8tzl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kt59wp8tzl] { text-align: center; }
.text-muted[b-kt59wp8tzl] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kt59wp8tzl], .crud-empty-state[b-kt59wp8tzl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kt59wp8tzl] { font-size: 2rem; }
.crud-spinner[b-kt59wp8tzl] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kt59wp8tzl 0.6s linear infinite; }
.crud-spinner-sm[b-kt59wp8tzl] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kt59wp8tzl 0.6s linear infinite; }
@keyframes spin-b-kt59wp8tzl { to { transform: rotate(360deg); } }
.spin[b-kt59wp8tzl] { animation: spin-b-kt59wp8tzl 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kt59wp8tzl] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kt59wp8tzl 0.15s ease-out; }
.modal-container[b-kt59wp8tzl] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kt59wp8tzl] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kt59wp8tzl 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kt59wp8tzl] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kt59wp8tzl] { max-width: 420px; }
@keyframes fadeIn-b-kt59wp8tzl { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kt59wp8tzl { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kt59wp8tzl] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kt59wp8tzl] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kt59wp8tzl] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kt59wp8tzl] { color: #dc2626; }
.modal-close[b-kt59wp8tzl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kt59wp8tzl] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kt59wp8tzl] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kt59wp8tzl] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kt59wp8tzl] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kt59wp8tzl] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kt59wp8tzl] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kt59wp8tzl] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kt59wp8tzl] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kt59wp8tzl] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kt59wp8tzl] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kt59wp8tzl] { flex: 2; }
.form-group label[b-kt59wp8tzl] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kt59wp8tzl], .form-group select[b-kt59wp8tzl], .form-textarea[b-kt59wp8tzl] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kt59wp8tzl], .form-group select:focus[b-kt59wp8tzl], .form-textarea:focus[b-kt59wp8tzl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kt59wp8tzl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kt59wp8tzl] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kt59wp8tzl] { flex: 1; display: flex; align-items: center; }
.form-check[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kt59wp8tzl] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kt59wp8tzl] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kt59wp8tzl] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kt59wp8tzl] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kt59wp8tzl] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kt59wp8tzl] { font-size: 3rem; }
.photo-placeholder span[b-kt59wp8tzl] { font-size: 0.78rem; }
.photo-actions[b-kt59wp8tzl] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kt59wp8tzl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kt59wp8tzl] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kt59wp8tzl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kt59wp8tzl] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kt59wp8tzl] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kt59wp8tzl] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kt59wp8tzl] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kt59wp8tzl] { filter: brightness(1.15); transform: scale(1.05); }
[b-kt59wp8tzl] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kt59wp8tzl] { padding: 0.75rem; }
    .crud-header[b-kt59wp8tzl] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kt59wp8tzl] { font-size: 1.1rem; }
    .btn-text[b-kt59wp8tzl] { display: none; }
    .form-row[b-kt59wp8tzl] { flex-direction: column; }
    .form-row-4[b-kt59wp8tzl] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kt59wp8tzl] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kt59wp8tzl] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kt59wp8tzl] { padding: 0.75rem; }
    .modal-tabs[b-kt59wp8tzl] { overflow-x: auto; }
    .modal-tab[b-kt59wp8tzl] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kt59wp8tzl] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kt59wp8tzl] { display: grid !important; }
    .crud-cards-wrapper[b-kt59wp8tzl] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kt59wp8tzl] { grid-template-columns: 1fr; }
    .card-details[b-kt59wp8tzl] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kt59wp8tzl] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kt59wp8tzl] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kt59wp8tzl] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kt59wp8tzl] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfacturasemitidas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3hc77whzbf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3hc77whzbf 0.3s ease-out; }
@keyframes slideUp-b-3hc77whzbf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3hc77whzbf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3hc77whzbf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3hc77whzbf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3hc77whzbf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3hc77whzbf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3hc77whzbf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3hc77whzbf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3hc77whzbf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3hc77whzbf] { filter: brightness(1.1); }
.btn-outline[b-3hc77whzbf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3hc77whzbf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3hc77whzbf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3hc77whzbf] { filter: brightness(1.1); }
.btn-icon[b-3hc77whzbf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3hc77whzbf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3hc77whzbf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3hc77whzbf] { color: #ef4444; }
.btn-delete:hover[b-3hc77whzbf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3hc77whzbf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3hc77whzbf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3hc77whzbf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3hc77whzbf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3hc77whzbf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3hc77whzbf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3hc77whzbf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3hc77whzbf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3hc77whzbf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3hc77whzbf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3hc77whzbf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3hc77whzbf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3hc77whzbf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3hc77whzbf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3hc77whzbf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3hc77whzbf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3hc77whzbf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3hc77whzbf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3hc77whzbf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3hc77whzbf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3hc77whzbf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3hc77whzbf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3hc77whzbf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3hc77whzbf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3hc77whzbf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3hc77whzbf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3hc77whzbf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3hc77whzbf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3hc77whzbf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3hc77whzbf] { display: block; }
.hide-on-cards[b-3hc77whzbf] { display: none !important; }
.show-on-cards[b-3hc77whzbf] { display: grid; }
.hide-on-grid[b-3hc77whzbf] { display: none !important; }

/* Badges */
.badge[b-3hc77whzbf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3hc77whzbf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3hc77whzbf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3hc77whzbf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3hc77whzbf] { text-align: center; }
.text-muted[b-3hc77whzbf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3hc77whzbf], .crud-empty-state[b-3hc77whzbf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3hc77whzbf] { font-size: 2rem; }
.crud-spinner[b-3hc77whzbf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3hc77whzbf 0.6s linear infinite; }
.crud-spinner-sm[b-3hc77whzbf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3hc77whzbf 0.6s linear infinite; }
@keyframes spin-b-3hc77whzbf { to { transform: rotate(360deg); } }
.spin[b-3hc77whzbf] { animation: spin-b-3hc77whzbf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3hc77whzbf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3hc77whzbf 0.15s ease-out; }
.modal-container[b-3hc77whzbf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3hc77whzbf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3hc77whzbf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-3hc77whzbf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-3hc77whzbf] { max-width: 420px; }
@keyframes fadeIn-b-3hc77whzbf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3hc77whzbf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3hc77whzbf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3hc77whzbf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3hc77whzbf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3hc77whzbf] { color: #dc2626; }
.modal-close[b-3hc77whzbf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3hc77whzbf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3hc77whzbf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3hc77whzbf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3hc77whzbf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3hc77whzbf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3hc77whzbf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3hc77whzbf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3hc77whzbf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3hc77whzbf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3hc77whzbf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3hc77whzbf] { flex: 2; }
.form-group label[b-3hc77whzbf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3hc77whzbf], .form-group select[b-3hc77whzbf], .form-textarea[b-3hc77whzbf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3hc77whzbf], .form-group select:focus[b-3hc77whzbf], .form-textarea:focus[b-3hc77whzbf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3hc77whzbf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3hc77whzbf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3hc77whzbf] { flex: 1; display: flex; align-items: center; }
.form-check[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3hc77whzbf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3hc77whzbf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3hc77whzbf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3hc77whzbf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3hc77whzbf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3hc77whzbf] { font-size: 3rem; }
.photo-placeholder span[b-3hc77whzbf] { font-size: 0.78rem; }
.photo-actions[b-3hc77whzbf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3hc77whzbf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-3hc77whzbf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3hc77whzbf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3hc77whzbf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3hc77whzbf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3hc77whzbf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3hc77whzbf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3hc77whzbf] { filter: brightness(1.15); transform: scale(1.05); }
[b-3hc77whzbf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3hc77whzbf] { padding: 0.75rem; }
    .crud-header[b-3hc77whzbf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3hc77whzbf] { font-size: 1.1rem; }
    .btn-text[b-3hc77whzbf] { display: none; }
    .form-row[b-3hc77whzbf] { flex-direction: column; }
    .form-row-4[b-3hc77whzbf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3hc77whzbf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3hc77whzbf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-3hc77whzbf] { padding: 0.75rem; }
    .modal-tabs[b-3hc77whzbf] { overflow-x: auto; }
    .modal-tab[b-3hc77whzbf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3hc77whzbf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3hc77whzbf] { display: grid !important; }
    .crud-cards-wrapper[b-3hc77whzbf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3hc77whzbf] { grid-template-columns: 1fr; }
    .card-details[b-3hc77whzbf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-3hc77whzbf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3hc77whzbf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3hc77whzbf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3hc77whzbf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfacturatipoexcel.razor.rz.scp.css */
/* ============================================================
   Frmfacturatipoexcel — Estilos CRUD estándar + grilla dinámica
   ============================================================ */

.crud-container[b-1ds1f1xr7y] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1ds1f1xr7y 0.3s ease-out; }
@keyframes slideUp-b-1ds1f1xr7y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1ds1f1xr7y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1ds1f1xr7y] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1ds1f1xr7y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1ds1f1xr7y] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1ds1f1xr7y] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1ds1f1xr7y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1ds1f1xr7y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1ds1f1xr7y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1ds1f1xr7y] { filter: brightness(1.1); }
.btn-outline[b-1ds1f1xr7y] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1ds1f1xr7y] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1ds1f1xr7y] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1ds1f1xr7y] { filter: brightness(1.1); }
.btn-sm[b-1ds1f1xr7y] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-1ds1f1xr7y] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1ds1f1xr7y] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1ds1f1xr7y] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1ds1f1xr7y] { color: #ef4444; }
.btn-delete:hover[b-1ds1f1xr7y] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1ds1f1xr7y] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1ds1f1xr7y] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert.warning[b-1ds1f1xr7y] { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.crud-alert-close[b-1ds1f1xr7y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-1ds1f1xr7y] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.25); }
[data-mode="dark"] .crud-alert.error[b-1ds1f1xr7y]   { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.25); }
[data-mode="dark"] .crud-alert.warning[b-1ds1f1xr7y] { background: rgba(234,179,8,0.12); color: #fde68a; border-color: rgba(234,179,8,0.25); }

/* Search bar (para picker de clientes) */
.crud-search-bar[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1ds1f1xr7y] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1ds1f1xr7y] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1ds1f1xr7y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }

/* Empty / Loading */
.crud-loading[b-1ds1f1xr7y], .crud-empty-state[b-1ds1f1xr7y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1ds1f1xr7y] { font-size: 2rem; }
.crud-spinner[b-1ds1f1xr7y] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1ds1f1xr7y 0.6s linear infinite; }
.crud-spinner-sm[b-1ds1f1xr7y] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1ds1f1xr7y 0.6s linear infinite; }
@keyframes spin-b-1ds1f1xr7y { to { transform: rotate(360deg); } }
.spin[b-1ds1f1xr7y] { animation: spin-b-1ds1f1xr7y 0.8s linear infinite; }

/* Form */
.form-row[b-1ds1f1xr7y] { display: flex; gap: 0.6rem; margin-bottom: 0.6rem; flex-wrap: wrap; }
.form-group[b-1ds1f1xr7y] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1ds1f1xr7y] { flex: 2; }
.form-group label[b-1ds1f1xr7y] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1ds1f1xr7y], .form-group select[b-1ds1f1xr7y], .form-group textarea[b-1ds1f1xr7y] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1ds1f1xr7y], .form-group select:focus[b-1ds1f1xr7y], .form-group textarea:focus[b-1ds1f1xr7y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.req[b-1ds1f1xr7y] { color: #ef4444; margin-left: 2px; }

/* Utilities */
.font-mono[b-1ds1f1xr7y] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-1ds1f1xr7y] { text-align: center; }
.text-right[b-1ds1f1xr7y] { text-align: right; }

/* Tabs del formulario (Nueva Factura | Historial) */
.fte-tabs[b-1ds1f1xr7y] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.fte-tab[b-1ds1f1xr7y] { padding: 0.5rem 1.1rem; border: none; background: transparent; font-size: 0.82rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; border-radius: 0.375rem 0.375rem 0 0; transition: all 0.15s; display: inline-flex; align-items: center; gap: 0.35rem; }
.fte-tab:hover[b-1ds1f1xr7y] { color: var(--rg-text-secondary, #475569); background: var(--rg-bg-hover, #f1f5f9); }
.fte-tab.active[b-1ds1f1xr7y] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); background: transparent; }
[data-mode="dark"] .fte-tab:hover[b-1ds1f1xr7y] { background: var(--rg-bg-hover); }
[data-mode="dark"] .fte-tab.active[b-1ds1f1xr7y] { color: var(--rg-accent); border-bottom-color: var(--rg-accent); }

/* Badge CRÉDITO (reemplaza el combo Tipo Doc) */
.fte-credito-badge[b-1ds1f1xr7y] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.75rem; background: rgba(79,70,229,0.12); color: var(--rg-accent, #4f46e5); border: 1px solid rgba(79,70,229,0.3); border-radius: 1rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
[data-mode="dark"] .fte-credito-badge[b-1ds1f1xr7y] { background: rgba(99,102,241,0.18); color: #a5b4fc; border-color: rgba(99,102,241,0.35); }

/* Badge tipo NCF del cliente */
.fte-ncf-badge[b-1ds1f1xr7y] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.65rem; background: rgba(16,185,129,0.1); color: #065f46; border: 1px solid rgba(16,185,129,0.3); border-radius: 1rem; font-size: 0.72rem; font-weight: 600; white-space: nowrap; }
[data-mode="dark"] .fte-ncf-badge[b-1ds1f1xr7y] { background: rgba(16,185,129,0.15); color: #6ee7b7; border-color: rgba(16,185,129,0.3); }

/* Historial grid */
.hist-search-bar[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.hist-search-bar input[b-1ds1f1xr7y] { flex: 1; padding: 0.4rem 0.65rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }
.hist-search-bar input:focus[b-1ds1f1xr7y] { border-color: var(--rg-accent, #4f46e5); }
.hist-count[b-1ds1f1xr7y] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
[data-mode="dark"] .hist-search-bar input[b-1ds1f1xr7y] { background: var(--rg-bg-input); color: var(--rg-text-primary); border-color: var(--rg-border); }

/* Card secciones */
.fte-card[b-1ds1f1xr7y] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem 1.25rem; margin-bottom: 0.75rem; }
.fte-card-title[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem; }

/* Cliente input compuesto */
.fte-cliente-input-wrap[b-1ds1f1xr7y] { display: flex; align-items: stretch; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; overflow: hidden; }
.fte-cliente-input-wrap input[b-1ds1f1xr7y] { flex: 1; padding: 0.375rem 0.5rem; border: none; outline: none; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); cursor: pointer; }
.fte-cliente-input-wrap input:focus[b-1ds1f1xr7y] { box-shadow: none; }
.fte-cliente-clear[b-1ds1f1xr7y], .fte-cliente-search[b-1ds1f1xr7y] { background: none; border: none; border-left: 1px solid var(--rg-border, #e2e8f0); padding: 0 0.5rem; cursor: pointer; color: var(--rg-text-muted, #94a3b8); transition: all 0.15s; display: flex; align-items: center; }
.fte-cliente-clear:hover[b-1ds1f1xr7y] { color: #ef4444; background: rgba(239,68,68,0.05); }
.fte-cliente-search:hover[b-1ds1f1xr7y] { color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.05); }

/* Cliente picker list */
.fte-client-list[b-1ds1f1xr7y] { max-height: calc(100vh - 320px); overflow-y: auto; }
.fte-client-row[b-1ds1f1xr7y] { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0.75rem; border-radius: 0.375rem; cursor: pointer; transition: background 0.12s; }
.fte-client-row:hover[b-1ds1f1xr7y] { background: var(--rg-bg-hover, #f8fafc); }
.fte-client-avatar[b-1ds1f1xr7y] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-subtle, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.1rem; flex-shrink: 0; }
.fte-client-info[b-1ds1f1xr7y] { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.fte-client-name[b-1ds1f1xr7y] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fte-client-id[b-1ds1f1xr7y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }

/* Grilla de líneas */
.fte-grid-wrapper[b-1ds1f1xr7y] { overflow-x: auto; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; }
.fte-table[b-1ds1f1xr7y] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.fte-table thead[b-1ds1f1xr7y] { position: sticky; top: 0; z-index: 1; }
.fte-table th[b-1ds1f1xr7y] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.5rem 0.5rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em; }
.fte-table td[b-1ds1f1xr7y] { padding: 0.3rem 0.4rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.fte-table tbody tr:hover[b-1ds1f1xr7y] { background: var(--rg-bg-hover, #f8fafc); }
/* ← REGLA CRÍTICA: columnas numéricas alineadas a la derecha — mayor especificidad que th { text-align: left } */
.fte-table th.text-right[b-1ds1f1xr7y],
.fte-table td.text-right[b-1ds1f1xr7y] { text-align: right !important; }

.fte-cell-input[b-1ds1f1xr7y] { width: 100%; padding: 0.3rem 0.4rem; border: 1px solid transparent; border-radius: 0.25rem; font-size: 0.78rem; background: transparent; color: var(--rg-text-primary, #1e293b); outline: none; transition: all 0.12s; }
.fte-cell-input:focus[b-1ds1f1xr7y] { border-color: var(--rg-accent, #4f46e5); background: var(--rg-bg-input, #fff); box-shadow: 0 0 0 2px rgba(79,70,229,0.12); }
/* ITBIS sin seleccionar — borde rojo de alerta */
.fte-itbis-required[b-1ds1f1xr7y] { border-color: rgba(239,68,68,0.6) !important; background: rgba(239,68,68,0.04) !important; color: var(--rg-text-muted, #94a3b8) !important; }
[data-mode="dark"] .fte-itbis-required[b-1ds1f1xr7y] { border-color: rgba(239,68,68,0.5) !important; background: rgba(239,68,68,0.08) !important; }
.fte-cell-calc[b-1ds1f1xr7y] { font-family: 'Cascadia Code','Fira Code',monospace; color: var(--rg-text-secondary, #475569); white-space: nowrap; }
.fte-total-cell[b-1ds1f1xr7y] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.fte-row-num[b-1ds1f1xr7y] { color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; font-weight: 600; }

.fte-lineas-empty[b-1ds1f1xr7y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.fte-lineas-empty i[b-1ds1f1xr7y] { font-size: 2rem; }
.fte-lineas-empty span[b-1ds1f1xr7y] { font-size: 0.8rem; }

/* Totales */
.fte-totales[b-1ds1f1xr7y] { display: flex; flex-direction: column; align-items: flex-end; gap: 0.25rem; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.fte-total-row[b-1ds1f1xr7y] { display: flex; align-items: baseline; gap: 1rem; }
.fte-total-label[b-1ds1f1xr7y] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; min-width: 100px; text-align: right; }
.fte-total-value[b-1ds1f1xr7y] { font-size: 0.88rem; color: var(--rg-text-primary, #1e293b); min-width: 100px; text-align: right; }
.fte-total-final .fte-total-label[b-1ds1f1xr7y] { font-size: 0.82rem; color: var(--rg-accent, #4f46e5); }
.fte-total-final .fte-total-value[b-1ds1f1xr7y] { font-size: 1.05rem; font-weight: 800; color: var(--rg-accent, #4f46e5); }

/* Modal */
.modal-backdrop[b-1ds1f1xr7y] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1ds1f1xr7y 0.15s ease-out; }
.modal-container[b-1ds1f1xr7y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1ds1f1xr7y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1ds1f1xr7y 0.2s ease-out; }
.modal-lg[b-1ds1f1xr7y] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1ds1f1xr7y] { max-width: 420px; }
@keyframes fadeIn-b-1ds1f1xr7y { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1ds1f1xr7y { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-1ds1f1xr7y] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1ds1f1xr7y] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-1ds1f1xr7y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1ds1f1xr7y] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1ds1f1xr7y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1ds1f1xr7y] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Modales anidados (post-save → envío) */
.modal-backdrop-nested[b-1ds1f1xr7y]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-1ds1f1xr7y] { z-index: 2001 !important; }

/* Panel post-grabado */
.ps-modal[b-1ds1f1xr7y] { max-width: 380px; }
.ps-recibo-info[b-1ds1f1xr7y] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem; }
.ps-label[b-1ds1f1xr7y] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.ps-value[b-1ds1f1xr7y] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.ps-cliente-info[b-1ds1f1xr7y] { display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--rg-text-secondary, #475569); margin-bottom: 1rem; }
.ps-acciones[b-1ds1f1xr7y] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-1ds1f1xr7y] { width: 100%; justify-content: center; }

/* Dark mode overrides */
[data-mode="dark"] .fte-card[b-1ds1f1xr7y] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .fte-cliente-input-wrap input[b-1ds1f1xr7y] { background: var(--rg-bg-input); color: var(--rg-text-primary); }
[data-mode="dark"] .fte-cell-input[b-1ds1f1xr7y] { color: var(--rg-text-primary); }
[data-mode="dark"] .fte-cell-input:focus[b-1ds1f1xr7y] { background: var(--rg-bg-input); }
[data-mode="dark"] .fte-table th[b-1ds1f1xr7y] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .fte-table tbody tr:hover[b-1ds1f1xr7y] { background: var(--rg-bg-hover); }
[data-mode="dark"] .modal-dialog[b-1ds1f1xr7y] { background: var(--rg-bg-card); }
[data-mode="dark"] .modal-header h2[b-1ds1f1xr7y] { color: var(--rg-text-primary); }
[data-mode="dark"] .ps-recibo-info[b-1ds1f1xr7y] { background: var(--rg-bg-subtle); border-color: var(--rg-border); }
[data-mode="dark"] .fte-client-row:hover[b-1ds1f1xr7y] { background: var(--rg-bg-hover); }
[data-mode="dark"] .fte-client-avatar[b-1ds1f1xr7y] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .crud-search-bar[b-1ds1f1xr7y] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .crud-search-bar input[b-1ds1f1xr7y] { color: var(--rg-text-primary); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1ds1f1xr7y] { padding: 0.75rem; }
    .crud-header[b-1ds1f1xr7y] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-1ds1f1xr7y] { display: none; }
    .form-row[b-1ds1f1xr7y] { flex-direction: column; }
    .modal-dialog[b-1ds1f1xr7y] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1ds1f1xr7y] { width: 98vw; height: 95vh; }
    .fte-table th[b-1ds1f1xr7y], .fte-table td[b-1ds1f1xr7y] { font-size: 0.7rem; padding: 0.25rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfruestadocuentatarjetas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-si4iambbfn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-si4iambbfn 0.3s ease-out; }
@keyframes slideUp-b-si4iambbfn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-si4iambbfn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-si4iambbfn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-si4iambbfn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-si4iambbfn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-si4iambbfn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-si4iambbfn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-si4iambbfn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-si4iambbfn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-si4iambbfn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-si4iambbfn] { filter: brightness(1.1); }
.btn-outline[b-si4iambbfn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-si4iambbfn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-si4iambbfn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-si4iambbfn] { filter: brightness(1.1); }
.btn-icon[b-si4iambbfn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-si4iambbfn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-si4iambbfn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-si4iambbfn] { color: #ef4444; }
.btn-delete:hover[b-si4iambbfn] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-si4iambbfn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-si4iambbfn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-si4iambbfn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-si4iambbfn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-si4iambbfn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-si4iambbfn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-si4iambbfn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-si4iambbfn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-si4iambbfn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-si4iambbfn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-si4iambbfn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-si4iambbfn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-si4iambbfn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-si4iambbfn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-si4iambbfn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-si4iambbfn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-si4iambbfn] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-si4iambbfn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-si4iambbfn] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-si4iambbfn] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-si4iambbfn] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-si4iambbfn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-si4iambbfn] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-si4iambbfn] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-si4iambbfn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-si4iambbfn] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-si4iambbfn] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-si4iambbfn] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-si4iambbfn] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-si4iambbfn] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-si4iambbfn] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-si4iambbfn] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-si4iambbfn] { display: block; }
.hide-on-cards[b-si4iambbfn] { display: none !important; }
.show-on-cards[b-si4iambbfn] { display: grid; }
.hide-on-grid[b-si4iambbfn] { display: none !important; }

/* Badges */
.badge[b-si4iambbfn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-si4iambbfn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-si4iambbfn] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-si4iambbfn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-si4iambbfn] { text-align: center; }
.text-muted[b-si4iambbfn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-si4iambbfn], .crud-empty-state[b-si4iambbfn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-si4iambbfn] { font-size: 2rem; }
.crud-spinner[b-si4iambbfn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-si4iambbfn 0.6s linear infinite; }
.crud-spinner-sm[b-si4iambbfn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-si4iambbfn 0.6s linear infinite; }
@keyframes spin-b-si4iambbfn { to { transform: rotate(360deg); } }
.spin[b-si4iambbfn] { animation: spin-b-si4iambbfn 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-si4iambbfn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-si4iambbfn 0.15s ease-out; }
.modal-container[b-si4iambbfn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-si4iambbfn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-si4iambbfn 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-si4iambbfn] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-si4iambbfn] { max-width: 420px; }
@keyframes fadeIn-b-si4iambbfn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-si4iambbfn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-si4iambbfn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-si4iambbfn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-si4iambbfn] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-si4iambbfn] { color: #dc2626; }
.modal-close[b-si4iambbfn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-si4iambbfn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-si4iambbfn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-si4iambbfn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-si4iambbfn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-si4iambbfn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-si4iambbfn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-si4iambbfn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-si4iambbfn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-si4iambbfn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-si4iambbfn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-si4iambbfn] { flex: 2; }
.form-group label[b-si4iambbfn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-si4iambbfn], .form-group select[b-si4iambbfn], .form-textarea[b-si4iambbfn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-si4iambbfn], .form-group select:focus[b-si4iambbfn], .form-textarea:focus[b-si4iambbfn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-si4iambbfn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-si4iambbfn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-si4iambbfn] { flex: 1; display: flex; align-items: center; }
.form-check[b-si4iambbfn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-si4iambbfn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-si4iambbfn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-si4iambbfn] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-si4iambbfn] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-si4iambbfn] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-si4iambbfn] { font-size: 3rem; }
.photo-placeholder span[b-si4iambbfn] { font-size: 0.78rem; }
.photo-actions[b-si4iambbfn] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-si4iambbfn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-si4iambbfn] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-si4iambbfn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-si4iambbfn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-si4iambbfn] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-si4iambbfn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-si4iambbfn] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-si4iambbfn] { filter: brightness(1.15); transform: scale(1.05); }
[b-si4iambbfn] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-si4iambbfn] { padding: 0.75rem; }
    .crud-header[b-si4iambbfn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-si4iambbfn] { font-size: 1.1rem; }
    .btn-text[b-si4iambbfn] { display: none; }
    .form-row[b-si4iambbfn] { flex-direction: column; }
    .form-row-4[b-si4iambbfn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-si4iambbfn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-si4iambbfn] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-si4iambbfn] { padding: 0.75rem; }
    .modal-tabs[b-si4iambbfn] { overflow-x: auto; }
    .modal-tab[b-si4iambbfn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-si4iambbfn] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-si4iambbfn] { display: grid !important; }
    .crud-cards-wrapper[b-si4iambbfn] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-si4iambbfn] { grid-template-columns: 1fr; }
    .card-details[b-si4iambbfn] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-si4iambbfn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-si4iambbfn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-si4iambbfn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-si4iambbfn] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfrurepentramercancia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-sai54fsul6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-sai54fsul6 0.3s ease-out; }
@keyframes slideUp-b-sai54fsul6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-sai54fsul6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-sai54fsul6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-sai54fsul6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-sai54fsul6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-sai54fsul6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-sai54fsul6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-sai54fsul6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-sai54fsul6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-sai54fsul6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-sai54fsul6] { filter: brightness(1.1); }
.btn-outline[b-sai54fsul6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-sai54fsul6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-sai54fsul6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-sai54fsul6] { filter: brightness(1.1); }
.btn-icon[b-sai54fsul6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-sai54fsul6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-sai54fsul6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-sai54fsul6] { color: #ef4444; }
.btn-delete:hover[b-sai54fsul6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-sai54fsul6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-sai54fsul6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-sai54fsul6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-sai54fsul6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-sai54fsul6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-sai54fsul6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-sai54fsul6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-sai54fsul6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-sai54fsul6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-sai54fsul6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-sai54fsul6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-sai54fsul6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-sai54fsul6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-sai54fsul6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-sai54fsul6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-sai54fsul6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-sai54fsul6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-sai54fsul6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-sai54fsul6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-sai54fsul6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-sai54fsul6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-sai54fsul6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-sai54fsul6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-sai54fsul6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-sai54fsul6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-sai54fsul6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-sai54fsul6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-sai54fsul6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-sai54fsul6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-sai54fsul6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-sai54fsul6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-sai54fsul6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-sai54fsul6] { display: block; }
.hide-on-cards[b-sai54fsul6] { display: none !important; }
.show-on-cards[b-sai54fsul6] { display: grid; }
.hide-on-grid[b-sai54fsul6] { display: none !important; }

/* Badges */
.badge[b-sai54fsul6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-sai54fsul6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-sai54fsul6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-sai54fsul6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-sai54fsul6] { text-align: center; }
.text-muted[b-sai54fsul6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-sai54fsul6], .crud-empty-state[b-sai54fsul6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-sai54fsul6] { font-size: 2rem; }
.crud-spinner[b-sai54fsul6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-sai54fsul6 0.6s linear infinite; }
.crud-spinner-sm[b-sai54fsul6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-sai54fsul6 0.6s linear infinite; }
@keyframes spin-b-sai54fsul6 { to { transform: rotate(360deg); } }
.spin[b-sai54fsul6] { animation: spin-b-sai54fsul6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-sai54fsul6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-sai54fsul6 0.15s ease-out; }
.modal-container[b-sai54fsul6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-sai54fsul6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-sai54fsul6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-sai54fsul6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-sai54fsul6] { max-width: 420px; }
@keyframes fadeIn-b-sai54fsul6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-sai54fsul6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-sai54fsul6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-sai54fsul6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-sai54fsul6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-sai54fsul6] { color: #dc2626; }
.modal-close[b-sai54fsul6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-sai54fsul6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-sai54fsul6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-sai54fsul6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-sai54fsul6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-sai54fsul6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-sai54fsul6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-sai54fsul6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-sai54fsul6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-sai54fsul6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-sai54fsul6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-sai54fsul6] { flex: 2; }
.form-group label[b-sai54fsul6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-sai54fsul6], .form-group select[b-sai54fsul6], .form-textarea[b-sai54fsul6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-sai54fsul6], .form-group select:focus[b-sai54fsul6], .form-textarea:focus[b-sai54fsul6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-sai54fsul6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-sai54fsul6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-sai54fsul6] { flex: 1; display: flex; align-items: center; }
.form-check[b-sai54fsul6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-sai54fsul6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-sai54fsul6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-sai54fsul6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-sai54fsul6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-sai54fsul6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-sai54fsul6] { font-size: 3rem; }
.photo-placeholder span[b-sai54fsul6] { font-size: 0.78rem; }
.photo-actions[b-sai54fsul6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-sai54fsul6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-sai54fsul6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-sai54fsul6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-sai54fsul6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-sai54fsul6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-sai54fsul6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-sai54fsul6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-sai54fsul6] { filter: brightness(1.15); transform: scale(1.05); }
[b-sai54fsul6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-sai54fsul6] { padding: 0.75rem; }
    .crud-header[b-sai54fsul6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-sai54fsul6] { font-size: 1.1rem; }
    .btn-text[b-sai54fsul6] { display: none; }
    .form-row[b-sai54fsul6] { flex-direction: column; }
    .form-row-4[b-sai54fsul6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-sai54fsul6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-sai54fsul6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-sai54fsul6] { padding: 0.75rem; }
    .modal-tabs[b-sai54fsul6] { overflow-x: auto; }
    .modal-tab[b-sai54fsul6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-sai54fsul6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-sai54fsul6] { display: grid !important; }
    .crud-cards-wrapper[b-sai54fsul6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-sai54fsul6] { grid-template-columns: 1fr; }
    .card-details[b-sai54fsul6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-sai54fsul6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-sai54fsul6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-sai54fsul6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-sai54fsul6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfru_conduce_requiereconfirmacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fghj3z9una] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fghj3z9una 0.3s ease-out; }
@keyframes slideUp-b-fghj3z9una { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fghj3z9una] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fghj3z9una] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fghj3z9una] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fghj3z9una] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fghj3z9una] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fghj3z9una] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fghj3z9una] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fghj3z9una] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fghj3z9una] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fghj3z9una] { filter: brightness(1.1); }
.btn-outline[b-fghj3z9una] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fghj3z9una] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fghj3z9una] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fghj3z9una] { filter: brightness(1.1); }
.btn-icon[b-fghj3z9una] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fghj3z9una] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fghj3z9una] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fghj3z9una] { color: #ef4444; }
.btn-delete:hover[b-fghj3z9una] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fghj3z9una] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fghj3z9una] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fghj3z9una] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fghj3z9una] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fghj3z9una] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fghj3z9una] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fghj3z9una] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fghj3z9una] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fghj3z9una] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fghj3z9una] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fghj3z9una] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fghj3z9una] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fghj3z9una] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fghj3z9una] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fghj3z9una] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fghj3z9una] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fghj3z9una] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fghj3z9una] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fghj3z9una] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fghj3z9una] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fghj3z9una] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fghj3z9una] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fghj3z9una] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fghj3z9una] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fghj3z9una] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fghj3z9una] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fghj3z9una] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fghj3z9una] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fghj3z9una] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fghj3z9una] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fghj3z9una] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fghj3z9una] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fghj3z9una] { display: block; }
.hide-on-cards[b-fghj3z9una] { display: none !important; }
.show-on-cards[b-fghj3z9una] { display: grid; }
.hide-on-grid[b-fghj3z9una] { display: none !important; }

/* Badges */
.badge[b-fghj3z9una] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fghj3z9una] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fghj3z9una] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fghj3z9una] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fghj3z9una] { text-align: center; }
.text-muted[b-fghj3z9una] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fghj3z9una], .crud-empty-state[b-fghj3z9una] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fghj3z9una] { font-size: 2rem; }
.crud-spinner[b-fghj3z9una] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fghj3z9una 0.6s linear infinite; }
.crud-spinner-sm[b-fghj3z9una] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fghj3z9una 0.6s linear infinite; }
@keyframes spin-b-fghj3z9una { to { transform: rotate(360deg); } }
.spin[b-fghj3z9una] { animation: spin-b-fghj3z9una 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fghj3z9una] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fghj3z9una 0.15s ease-out; }
.modal-container[b-fghj3z9una] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fghj3z9una] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fghj3z9una 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fghj3z9una] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fghj3z9una] { max-width: 420px; }
@keyframes fadeIn-b-fghj3z9una { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fghj3z9una { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fghj3z9una] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fghj3z9una] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fghj3z9una] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fghj3z9una] { color: #dc2626; }
.modal-close[b-fghj3z9una] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fghj3z9una] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fghj3z9una] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fghj3z9una] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fghj3z9una] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fghj3z9una] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fghj3z9una] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fghj3z9una] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fghj3z9una] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fghj3z9una] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fghj3z9una] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fghj3z9una] { flex: 2; }
.form-group label[b-fghj3z9una] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fghj3z9una], .form-group select[b-fghj3z9una], .form-textarea[b-fghj3z9una] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fghj3z9una], .form-group select:focus[b-fghj3z9una], .form-textarea:focus[b-fghj3z9una] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fghj3z9una] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fghj3z9una] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fghj3z9una] { flex: 1; display: flex; align-items: center; }
.form-check[b-fghj3z9una] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fghj3z9una] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fghj3z9una] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fghj3z9una] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fghj3z9una] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fghj3z9una] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fghj3z9una] { font-size: 3rem; }
.photo-placeholder span[b-fghj3z9una] { font-size: 0.78rem; }
.photo-actions[b-fghj3z9una] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fghj3z9una] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fghj3z9una] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fghj3z9una] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fghj3z9una] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fghj3z9una] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fghj3z9una] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fghj3z9una] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fghj3z9una] { filter: brightness(1.15); transform: scale(1.05); }
[b-fghj3z9una] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fghj3z9una] { padding: 0.75rem; }
    .crud-header[b-fghj3z9una] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fghj3z9una] { font-size: 1.1rem; }
    .btn-text[b-fghj3z9una] { display: none; }
    .form-row[b-fghj3z9una] { flex-direction: column; }
    .form-row-4[b-fghj3z9una] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fghj3z9una] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fghj3z9una] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fghj3z9una] { padding: 0.75rem; }
    .modal-tabs[b-fghj3z9una] { overflow-x: auto; }
    .modal-tab[b-fghj3z9una] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fghj3z9una] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fghj3z9una] { display: grid !important; }
    .crud-cards-wrapper[b-fghj3z9una] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fghj3z9una] { grid-template-columns: 1fr; }
    .card-details[b-fghj3z9una] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fghj3z9una] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fghj3z9una] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fghj3z9una] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fghj3z9una] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfru_confirmaconduce.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-pxfd30yu5y] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pxfd30yu5y 0.3s ease-out; }
@keyframes slideUp-b-pxfd30yu5y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pxfd30yu5y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pxfd30yu5y] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pxfd30yu5y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pxfd30yu5y] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pxfd30yu5y] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pxfd30yu5y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pxfd30yu5y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pxfd30yu5y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pxfd30yu5y] { filter: brightness(1.1); }
.btn-outline[b-pxfd30yu5y] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pxfd30yu5y] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pxfd30yu5y] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pxfd30yu5y] { filter: brightness(1.1); }
.btn-icon[b-pxfd30yu5y] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pxfd30yu5y] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pxfd30yu5y] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pxfd30yu5y] { color: #ef4444; }
.btn-delete:hover[b-pxfd30yu5y] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-pxfd30yu5y] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pxfd30yu5y] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pxfd30yu5y] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pxfd30yu5y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pxfd30yu5y] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pxfd30yu5y] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-pxfd30yu5y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pxfd30yu5y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-pxfd30yu5y] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pxfd30yu5y] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pxfd30yu5y] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pxfd30yu5y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pxfd30yu5y] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pxfd30yu5y] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pxfd30yu5y] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-pxfd30yu5y] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-pxfd30yu5y] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-pxfd30yu5y] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-pxfd30yu5y] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-pxfd30yu5y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-pxfd30yu5y] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-pxfd30yu5y] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-pxfd30yu5y] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-pxfd30yu5y] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-pxfd30yu5y] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-pxfd30yu5y] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-pxfd30yu5y] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-pxfd30yu5y] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-pxfd30yu5y] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-pxfd30yu5y] { display: block; }
.hide-on-cards[b-pxfd30yu5y] { display: none !important; }
.show-on-cards[b-pxfd30yu5y] { display: grid; }
.hide-on-grid[b-pxfd30yu5y] { display: none !important; }

/* Badges */
.badge[b-pxfd30yu5y] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pxfd30yu5y] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pxfd30yu5y] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-pxfd30yu5y] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pxfd30yu5y] { text-align: center; }
.text-muted[b-pxfd30yu5y] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pxfd30yu5y], .crud-empty-state[b-pxfd30yu5y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pxfd30yu5y] { font-size: 2rem; }
.crud-spinner[b-pxfd30yu5y] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pxfd30yu5y 0.6s linear infinite; }
.crud-spinner-sm[b-pxfd30yu5y] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pxfd30yu5y 0.6s linear infinite; }
@keyframes spin-b-pxfd30yu5y { to { transform: rotate(360deg); } }
.spin[b-pxfd30yu5y] { animation: spin-b-pxfd30yu5y 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-pxfd30yu5y] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pxfd30yu5y 0.15s ease-out; }
.modal-container[b-pxfd30yu5y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pxfd30yu5y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pxfd30yu5y 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-pxfd30yu5y] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-pxfd30yu5y] { max-width: 420px; }
@keyframes fadeIn-b-pxfd30yu5y { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pxfd30yu5y { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pxfd30yu5y] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pxfd30yu5y] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-pxfd30yu5y] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-pxfd30yu5y] { color: #dc2626; }
.modal-close[b-pxfd30yu5y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pxfd30yu5y] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pxfd30yu5y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pxfd30yu5y] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pxfd30yu5y] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-pxfd30yu5y] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pxfd30yu5y] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pxfd30yu5y] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pxfd30yu5y] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pxfd30yu5y] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pxfd30yu5y] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pxfd30yu5y] { flex: 2; }
.form-group label[b-pxfd30yu5y] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pxfd30yu5y], .form-group select[b-pxfd30yu5y], .form-textarea[b-pxfd30yu5y] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pxfd30yu5y], .form-group select:focus[b-pxfd30yu5y], .form-textarea:focus[b-pxfd30yu5y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pxfd30yu5y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pxfd30yu5y] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pxfd30yu5y] { flex: 1; display: flex; align-items: center; }
.form-check[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pxfd30yu5y] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-pxfd30yu5y] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-pxfd30yu5y] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-pxfd30yu5y] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-pxfd30yu5y] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-pxfd30yu5y] { font-size: 3rem; }
.photo-placeholder span[b-pxfd30yu5y] { font-size: 0.78rem; }
.photo-actions[b-pxfd30yu5y] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-pxfd30yu5y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-pxfd30yu5y] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-pxfd30yu5y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-pxfd30yu5y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-pxfd30yu5y] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-pxfd30yu5y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-pxfd30yu5y] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-pxfd30yu5y] { filter: brightness(1.15); transform: scale(1.05); }
[b-pxfd30yu5y] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pxfd30yu5y] { padding: 0.75rem; }
    .crud-header[b-pxfd30yu5y] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pxfd30yu5y] { font-size: 1.1rem; }
    .btn-text[b-pxfd30yu5y] { display: none; }
    .form-row[b-pxfd30yu5y] { flex-direction: column; }
    .form-row-4[b-pxfd30yu5y] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pxfd30yu5y] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pxfd30yu5y] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-pxfd30yu5y] { padding: 0.75rem; }
    .modal-tabs[b-pxfd30yu5y] { overflow-x: auto; }
    .modal-tab[b-pxfd30yu5y] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-pxfd30yu5y] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-pxfd30yu5y] { display: grid !important; }
    .crud-cards-wrapper[b-pxfd30yu5y] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-pxfd30yu5y] { grid-template-columns: 1fr; }
    .card-details[b-pxfd30yu5y] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-pxfd30yu5y] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pxfd30yu5y] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pxfd30yu5y] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pxfd30yu5y] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfru_entradas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ue8o2y36ys] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ue8o2y36ys 0.3s ease-out; }
@keyframes slideUp-b-ue8o2y36ys { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ue8o2y36ys] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ue8o2y36ys] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ue8o2y36ys] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ue8o2y36ys] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ue8o2y36ys] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ue8o2y36ys] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ue8o2y36ys] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ue8o2y36ys] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ue8o2y36ys] { filter: brightness(1.1); }
.btn-outline[b-ue8o2y36ys] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ue8o2y36ys] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ue8o2y36ys] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ue8o2y36ys] { filter: brightness(1.1); }
.btn-icon[b-ue8o2y36ys] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ue8o2y36ys] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ue8o2y36ys] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ue8o2y36ys] { color: #ef4444; }
.btn-delete:hover[b-ue8o2y36ys] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ue8o2y36ys] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ue8o2y36ys] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ue8o2y36ys] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ue8o2y36ys] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ue8o2y36ys] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ue8o2y36ys] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ue8o2y36ys] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ue8o2y36ys] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ue8o2y36ys] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ue8o2y36ys] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ue8o2y36ys] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ue8o2y36ys] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ue8o2y36ys] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ue8o2y36ys] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ue8o2y36ys] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ue8o2y36ys] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ue8o2y36ys] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ue8o2y36ys] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ue8o2y36ys] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ue8o2y36ys] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ue8o2y36ys] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ue8o2y36ys] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ue8o2y36ys] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ue8o2y36ys] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ue8o2y36ys] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ue8o2y36ys] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ue8o2y36ys] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ue8o2y36ys] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ue8o2y36ys] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ue8o2y36ys] { display: block; }
.hide-on-cards[b-ue8o2y36ys] { display: none !important; }
.show-on-cards[b-ue8o2y36ys] { display: grid; }
.hide-on-grid[b-ue8o2y36ys] { display: none !important; }

/* Badges */
.badge[b-ue8o2y36ys] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ue8o2y36ys] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ue8o2y36ys] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ue8o2y36ys] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ue8o2y36ys] { text-align: center; }
.text-muted[b-ue8o2y36ys] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ue8o2y36ys], .crud-empty-state[b-ue8o2y36ys] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ue8o2y36ys] { font-size: 2rem; }
.crud-spinner[b-ue8o2y36ys] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ue8o2y36ys 0.6s linear infinite; }
.crud-spinner-sm[b-ue8o2y36ys] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ue8o2y36ys 0.6s linear infinite; }
@keyframes spin-b-ue8o2y36ys { to { transform: rotate(360deg); } }
.spin[b-ue8o2y36ys] { animation: spin-b-ue8o2y36ys 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ue8o2y36ys] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ue8o2y36ys 0.15s ease-out; }
.modal-container[b-ue8o2y36ys] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ue8o2y36ys] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ue8o2y36ys 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ue8o2y36ys] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ue8o2y36ys] { max-width: 420px; }
@keyframes fadeIn-b-ue8o2y36ys { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ue8o2y36ys { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ue8o2y36ys] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ue8o2y36ys] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ue8o2y36ys] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ue8o2y36ys] { color: #dc2626; }
.modal-close[b-ue8o2y36ys] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ue8o2y36ys] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ue8o2y36ys] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ue8o2y36ys] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ue8o2y36ys] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ue8o2y36ys] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ue8o2y36ys] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ue8o2y36ys] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ue8o2y36ys] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ue8o2y36ys] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ue8o2y36ys] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ue8o2y36ys] { flex: 2; }
.form-group label[b-ue8o2y36ys] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ue8o2y36ys], .form-group select[b-ue8o2y36ys], .form-textarea[b-ue8o2y36ys] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ue8o2y36ys], .form-group select:focus[b-ue8o2y36ys], .form-textarea:focus[b-ue8o2y36ys] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ue8o2y36ys] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ue8o2y36ys] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ue8o2y36ys] { flex: 1; display: flex; align-items: center; }
.form-check[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ue8o2y36ys] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ue8o2y36ys] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ue8o2y36ys] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ue8o2y36ys] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ue8o2y36ys] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ue8o2y36ys] { font-size: 3rem; }
.photo-placeholder span[b-ue8o2y36ys] { font-size: 0.78rem; }
.photo-actions[b-ue8o2y36ys] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ue8o2y36ys] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ue8o2y36ys] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ue8o2y36ys] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ue8o2y36ys] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ue8o2y36ys] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ue8o2y36ys] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ue8o2y36ys] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ue8o2y36ys] { filter: brightness(1.15); transform: scale(1.05); }
[b-ue8o2y36ys] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ue8o2y36ys] { padding: 0.75rem; }
    .crud-header[b-ue8o2y36ys] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ue8o2y36ys] { font-size: 1.1rem; }
    .btn-text[b-ue8o2y36ys] { display: none; }
    .form-row[b-ue8o2y36ys] { flex-direction: column; }
    .form-row-4[b-ue8o2y36ys] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ue8o2y36ys] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ue8o2y36ys] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ue8o2y36ys] { padding: 0.75rem; }
    .modal-tabs[b-ue8o2y36ys] { overflow-x: auto; }
    .modal-tab[b-ue8o2y36ys] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ue8o2y36ys] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ue8o2y36ys] { display: grid !important; }
    .crud-cards-wrapper[b-ue8o2y36ys] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ue8o2y36ys] { grid-template-columns: 1fr; }
    .card-details[b-ue8o2y36ys] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ue8o2y36ys] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ue8o2y36ys] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ue8o2y36ys] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ue8o2y36ys] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfru_registraconteoinventario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-gy2z9h7k87] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gy2z9h7k87 0.3s ease-out; }
@keyframes slideUp-b-gy2z9h7k87 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gy2z9h7k87] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gy2z9h7k87] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-gy2z9h7k87] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-gy2z9h7k87] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-gy2z9h7k87] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-gy2z9h7k87] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gy2z9h7k87] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-gy2z9h7k87] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gy2z9h7k87] { filter: brightness(1.1); }
.btn-outline[b-gy2z9h7k87] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-gy2z9h7k87] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-gy2z9h7k87] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gy2z9h7k87] { filter: brightness(1.1); }
.btn-icon[b-gy2z9h7k87] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-gy2z9h7k87] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gy2z9h7k87] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gy2z9h7k87] { color: #ef4444; }
.btn-delete:hover[b-gy2z9h7k87] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-gy2z9h7k87] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gy2z9h7k87] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gy2z9h7k87] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gy2z9h7k87] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-gy2z9h7k87] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gy2z9h7k87] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-gy2z9h7k87] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-gy2z9h7k87] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-gy2z9h7k87] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-gy2z9h7k87] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gy2z9h7k87] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gy2z9h7k87] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gy2z9h7k87] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-gy2z9h7k87] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-gy2z9h7k87] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-gy2z9h7k87] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-gy2z9h7k87] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-gy2z9h7k87] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-gy2z9h7k87] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-gy2z9h7k87] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-gy2z9h7k87] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-gy2z9h7k87] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-gy2z9h7k87] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-gy2z9h7k87] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-gy2z9h7k87] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-gy2z9h7k87] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-gy2z9h7k87] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-gy2z9h7k87] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-gy2z9h7k87] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-gy2z9h7k87] { display: block; }
.hide-on-cards[b-gy2z9h7k87] { display: none !important; }
.show-on-cards[b-gy2z9h7k87] { display: grid; }
.hide-on-grid[b-gy2z9h7k87] { display: none !important; }

/* Badges */
.badge[b-gy2z9h7k87] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-gy2z9h7k87] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gy2z9h7k87] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-gy2z9h7k87] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-gy2z9h7k87] { text-align: center; }
.text-muted[b-gy2z9h7k87] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-gy2z9h7k87], .crud-empty-state[b-gy2z9h7k87] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-gy2z9h7k87] { font-size: 2rem; }
.crud-spinner[b-gy2z9h7k87] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-gy2z9h7k87 0.6s linear infinite; }
.crud-spinner-sm[b-gy2z9h7k87] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-gy2z9h7k87 0.6s linear infinite; }
@keyframes spin-b-gy2z9h7k87 { to { transform: rotate(360deg); } }
.spin[b-gy2z9h7k87] { animation: spin-b-gy2z9h7k87 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-gy2z9h7k87] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-gy2z9h7k87 0.15s ease-out; }
.modal-container[b-gy2z9h7k87] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gy2z9h7k87] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-gy2z9h7k87 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-gy2z9h7k87] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-gy2z9h7k87] { max-width: 420px; }
@keyframes fadeIn-b-gy2z9h7k87 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gy2z9h7k87 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-gy2z9h7k87] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-gy2z9h7k87] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-gy2z9h7k87] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-gy2z9h7k87] { color: #dc2626; }
.modal-close[b-gy2z9h7k87] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-gy2z9h7k87] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-gy2z9h7k87] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gy2z9h7k87] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-gy2z9h7k87] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-gy2z9h7k87] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-gy2z9h7k87] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-gy2z9h7k87] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-gy2z9h7k87] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-gy2z9h7k87] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gy2z9h7k87] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-gy2z9h7k87] { flex: 2; }
.form-group label[b-gy2z9h7k87] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gy2z9h7k87], .form-group select[b-gy2z9h7k87], .form-textarea[b-gy2z9h7k87] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-gy2z9h7k87], .form-group select:focus[b-gy2z9h7k87], .form-textarea:focus[b-gy2z9h7k87] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-gy2z9h7k87] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-gy2z9h7k87] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-gy2z9h7k87] { flex: 1; display: flex; align-items: center; }
.form-check[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-gy2z9h7k87] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-gy2z9h7k87] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-gy2z9h7k87] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-gy2z9h7k87] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-gy2z9h7k87] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-gy2z9h7k87] { font-size: 3rem; }
.photo-placeholder span[b-gy2z9h7k87] { font-size: 0.78rem; }
.photo-actions[b-gy2z9h7k87] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-gy2z9h7k87] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-gy2z9h7k87] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-gy2z9h7k87] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-gy2z9h7k87] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-gy2z9h7k87] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-gy2z9h7k87] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-gy2z9h7k87] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-gy2z9h7k87] { filter: brightness(1.15); transform: scale(1.05); }
[b-gy2z9h7k87] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-gy2z9h7k87] { padding: 0.75rem; }
    .crud-header[b-gy2z9h7k87] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gy2z9h7k87] { font-size: 1.1rem; }
    .btn-text[b-gy2z9h7k87] { display: none; }
    .form-row[b-gy2z9h7k87] { flex-direction: column; }
    .form-row-4[b-gy2z9h7k87] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-gy2z9h7k87] { width: 98%; max-height: 95vh; }
    .modal-lg[b-gy2z9h7k87] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-gy2z9h7k87] { padding: 0.75rem; }
    .modal-tabs[b-gy2z9h7k87] { overflow-x: auto; }
    .modal-tab[b-gy2z9h7k87] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-gy2z9h7k87] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-gy2z9h7k87] { display: grid !important; }
    .crud-cards-wrapper[b-gy2z9h7k87] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-gy2z9h7k87] { grid-template-columns: 1fr; }
    .card-details[b-gy2z9h7k87] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-gy2z9h7k87] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-gy2z9h7k87] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-gy2z9h7k87] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-gy2z9h7k87] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmfru_salidainventario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yf6b8z9gsd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yf6b8z9gsd 0.3s ease-out; }
@keyframes slideUp-b-yf6b8z9gsd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yf6b8z9gsd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yf6b8z9gsd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yf6b8z9gsd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yf6b8z9gsd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yf6b8z9gsd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yf6b8z9gsd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yf6b8z9gsd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yf6b8z9gsd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yf6b8z9gsd] { filter: brightness(1.1); }
.btn-outline[b-yf6b8z9gsd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yf6b8z9gsd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yf6b8z9gsd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yf6b8z9gsd] { filter: brightness(1.1); }
.btn-icon[b-yf6b8z9gsd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yf6b8z9gsd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yf6b8z9gsd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yf6b8z9gsd] { color: #ef4444; }
.btn-delete:hover[b-yf6b8z9gsd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yf6b8z9gsd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yf6b8z9gsd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yf6b8z9gsd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yf6b8z9gsd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yf6b8z9gsd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yf6b8z9gsd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yf6b8z9gsd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yf6b8z9gsd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yf6b8z9gsd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yf6b8z9gsd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yf6b8z9gsd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yf6b8z9gsd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yf6b8z9gsd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yf6b8z9gsd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yf6b8z9gsd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yf6b8z9gsd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yf6b8z9gsd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yf6b8z9gsd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yf6b8z9gsd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yf6b8z9gsd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yf6b8z9gsd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yf6b8z9gsd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yf6b8z9gsd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yf6b8z9gsd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yf6b8z9gsd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yf6b8z9gsd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yf6b8z9gsd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yf6b8z9gsd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yf6b8z9gsd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yf6b8z9gsd] { display: block; }
.hide-on-cards[b-yf6b8z9gsd] { display: none !important; }
.show-on-cards[b-yf6b8z9gsd] { display: grid; }
.hide-on-grid[b-yf6b8z9gsd] { display: none !important; }

/* Badges */
.badge[b-yf6b8z9gsd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yf6b8z9gsd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yf6b8z9gsd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yf6b8z9gsd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yf6b8z9gsd] { text-align: center; }
.text-muted[b-yf6b8z9gsd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yf6b8z9gsd], .crud-empty-state[b-yf6b8z9gsd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yf6b8z9gsd] { font-size: 2rem; }
.crud-spinner[b-yf6b8z9gsd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yf6b8z9gsd 0.6s linear infinite; }
.crud-spinner-sm[b-yf6b8z9gsd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yf6b8z9gsd 0.6s linear infinite; }
@keyframes spin-b-yf6b8z9gsd { to { transform: rotate(360deg); } }
.spin[b-yf6b8z9gsd] { animation: spin-b-yf6b8z9gsd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yf6b8z9gsd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yf6b8z9gsd 0.15s ease-out; }
.modal-container[b-yf6b8z9gsd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yf6b8z9gsd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yf6b8z9gsd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yf6b8z9gsd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yf6b8z9gsd] { max-width: 420px; }
@keyframes fadeIn-b-yf6b8z9gsd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yf6b8z9gsd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yf6b8z9gsd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yf6b8z9gsd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yf6b8z9gsd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yf6b8z9gsd] { color: #dc2626; }
.modal-close[b-yf6b8z9gsd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yf6b8z9gsd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yf6b8z9gsd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yf6b8z9gsd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yf6b8z9gsd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yf6b8z9gsd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yf6b8z9gsd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yf6b8z9gsd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yf6b8z9gsd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yf6b8z9gsd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yf6b8z9gsd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yf6b8z9gsd] { flex: 2; }
.form-group label[b-yf6b8z9gsd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yf6b8z9gsd], .form-group select[b-yf6b8z9gsd], .form-textarea[b-yf6b8z9gsd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yf6b8z9gsd], .form-group select:focus[b-yf6b8z9gsd], .form-textarea:focus[b-yf6b8z9gsd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yf6b8z9gsd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yf6b8z9gsd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yf6b8z9gsd] { flex: 1; display: flex; align-items: center; }
.form-check[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yf6b8z9gsd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yf6b8z9gsd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yf6b8z9gsd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yf6b8z9gsd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yf6b8z9gsd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yf6b8z9gsd] { font-size: 3rem; }
.photo-placeholder span[b-yf6b8z9gsd] { font-size: 0.78rem; }
.photo-actions[b-yf6b8z9gsd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yf6b8z9gsd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yf6b8z9gsd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yf6b8z9gsd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yf6b8z9gsd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yf6b8z9gsd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yf6b8z9gsd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yf6b8z9gsd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yf6b8z9gsd] { filter: brightness(1.15); transform: scale(1.05); }
[b-yf6b8z9gsd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yf6b8z9gsd] { padding: 0.75rem; }
    .crud-header[b-yf6b8z9gsd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yf6b8z9gsd] { font-size: 1.1rem; }
    .btn-text[b-yf6b8z9gsd] { display: none; }
    .form-row[b-yf6b8z9gsd] { flex-direction: column; }
    .form-row-4[b-yf6b8z9gsd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yf6b8z9gsd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yf6b8z9gsd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yf6b8z9gsd] { padding: 0.75rem; }
    .modal-tabs[b-yf6b8z9gsd] { overflow-x: auto; }
    .modal-tab[b-yf6b8z9gsd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yf6b8z9gsd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yf6b8z9gsd] { display: grid !important; }
    .crud-cards-wrapper[b-yf6b8z9gsd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yf6b8z9gsd] { grid-template-columns: 1fr; }
    .card-details[b-yf6b8z9gsd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yf6b8z9gsd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yf6b8z9gsd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yf6b8z9gsd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yf6b8z9gsd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmgrupo_familia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0iph87dncq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0iph87dncq 0.3s ease-out; }
@keyframes slideUp-b-0iph87dncq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0iph87dncq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0iph87dncq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0iph87dncq] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0iph87dncq] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0iph87dncq] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0iph87dncq] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0iph87dncq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0iph87dncq] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0iph87dncq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0iph87dncq] { filter: brightness(1.1); }
.btn-outline[b-0iph87dncq] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0iph87dncq] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0iph87dncq] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0iph87dncq] { filter: brightness(1.1); }
.btn-icon[b-0iph87dncq] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0iph87dncq] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0iph87dncq] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0iph87dncq] { color: #ef4444; }
.btn-delete:hover[b-0iph87dncq] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0iph87dncq] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0iph87dncq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0iph87dncq] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0iph87dncq] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0iph87dncq] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0iph87dncq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0iph87dncq] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0iph87dncq] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0iph87dncq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0iph87dncq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0iph87dncq] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0iph87dncq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0iph87dncq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0iph87dncq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0iph87dncq] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0iph87dncq] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0iph87dncq] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0iph87dncq] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0iph87dncq] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0iph87dncq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0iph87dncq] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0iph87dncq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0iph87dncq] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0iph87dncq] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0iph87dncq] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0iph87dncq] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0iph87dncq] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0iph87dncq] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0iph87dncq] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0iph87dncq] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0iph87dncq] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0iph87dncq] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0iph87dncq] { display: block; }
.hide-on-cards[b-0iph87dncq] { display: none !important; }
.show-on-cards[b-0iph87dncq] { display: grid; }
.hide-on-grid[b-0iph87dncq] { display: none !important; }

/* Badges */
.badge[b-0iph87dncq] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0iph87dncq] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0iph87dncq] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0iph87dncq] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0iph87dncq] { text-align: center; }
.text-muted[b-0iph87dncq] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0iph87dncq], .crud-empty-state[b-0iph87dncq] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0iph87dncq] { font-size: 2rem; }
.crud-spinner[b-0iph87dncq] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0iph87dncq 0.6s linear infinite; }
.crud-spinner-sm[b-0iph87dncq] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0iph87dncq 0.6s linear infinite; }
@keyframes spin-b-0iph87dncq { to { transform: rotate(360deg); } }
.spin[b-0iph87dncq] { animation: spin-b-0iph87dncq 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0iph87dncq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0iph87dncq 0.15s ease-out; }
.modal-container[b-0iph87dncq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0iph87dncq] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0iph87dncq 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0iph87dncq] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0iph87dncq] { max-width: 420px; }
@keyframes fadeIn-b-0iph87dncq { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0iph87dncq { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0iph87dncq] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0iph87dncq] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0iph87dncq] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0iph87dncq] { color: #dc2626; }
.modal-close[b-0iph87dncq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0iph87dncq] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0iph87dncq] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0iph87dncq] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0iph87dncq] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0iph87dncq] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0iph87dncq] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0iph87dncq] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0iph87dncq] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0iph87dncq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0iph87dncq] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0iph87dncq] { flex: 2; }
.form-group label[b-0iph87dncq] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0iph87dncq], .form-group select[b-0iph87dncq], .form-textarea[b-0iph87dncq] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0iph87dncq], .form-group select:focus[b-0iph87dncq], .form-textarea:focus[b-0iph87dncq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0iph87dncq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0iph87dncq] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0iph87dncq] { flex: 1; display: flex; align-items: center; }
.form-check[b-0iph87dncq] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0iph87dncq] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0iph87dncq] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0iph87dncq] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0iph87dncq] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0iph87dncq] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0iph87dncq] { font-size: 3rem; }
.photo-placeholder span[b-0iph87dncq] { font-size: 0.78rem; }
.photo-actions[b-0iph87dncq] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0iph87dncq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0iph87dncq] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0iph87dncq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0iph87dncq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0iph87dncq] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0iph87dncq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0iph87dncq] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0iph87dncq] { filter: brightness(1.15); transform: scale(1.05); }
[b-0iph87dncq] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0iph87dncq] { padding: 0.75rem; }
    .crud-header[b-0iph87dncq] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0iph87dncq] { font-size: 1.1rem; }
    .btn-text[b-0iph87dncq] { display: none; }
    .form-row[b-0iph87dncq] { flex-direction: column; }
    .form-row-4[b-0iph87dncq] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0iph87dncq] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0iph87dncq] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0iph87dncq] { padding: 0.75rem; }
    .modal-tabs[b-0iph87dncq] { overflow-x: auto; }
    .modal-tab[b-0iph87dncq] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0iph87dncq] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0iph87dncq] { display: grid !important; }
    .crud-cards-wrapper[b-0iph87dncq] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0iph87dncq] { grid-template-columns: 1fr; }
    .card-details[b-0iph87dncq] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0iph87dncq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0iph87dncq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0iph87dncq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0iph87dncq] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmguacotizacioncontrato.razor.rz.scp.css */
/* ============================================================
   Frmfacturatipoexcel — Estilos CRUD estándar + grilla dinámica
   ============================================================ */

.crud-container[b-mpgb6sawos] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-mpgb6sawos 0.3s ease-out; }
@keyframes slideUp-b-mpgb6sawos { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-mpgb6sawos] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-mpgb6sawos] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-mpgb6sawos] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-mpgb6sawos] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-mpgb6sawos] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-mpgb6sawos] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-mpgb6sawos] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-mpgb6sawos] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-mpgb6sawos] { filter: brightness(1.1); }
.btn-outline[b-mpgb6sawos] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-mpgb6sawos] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-mpgb6sawos] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-mpgb6sawos] { filter: brightness(1.1); }
.btn-sm[b-mpgb6sawos] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-mpgb6sawos] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-mpgb6sawos] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-mpgb6sawos] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-mpgb6sawos] { color: #ef4444; }
.btn-delete:hover[b-mpgb6sawos] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-mpgb6sawos] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-mpgb6sawos] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert.warning[b-mpgb6sawos] { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.crud-alert-close[b-mpgb6sawos] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-mpgb6sawos] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.25); }
[data-mode="dark"] .crud-alert.error[b-mpgb6sawos]   { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.25); }
[data-mode="dark"] .crud-alert.warning[b-mpgb6sawos] { background: rgba(234,179,8,0.12); color: #fde68a; border-color: rgba(234,179,8,0.25); }

/* Search bar (para picker de clientes) */
.crud-search-bar[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-mpgb6sawos] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-mpgb6sawos] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-mpgb6sawos] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }

/* Empty / Loading */
.crud-loading[b-mpgb6sawos], .crud-empty-state[b-mpgb6sawos] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-mpgb6sawos] { font-size: 2rem; }
.crud-spinner[b-mpgb6sawos] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-mpgb6sawos 0.6s linear infinite; }
.crud-spinner-sm[b-mpgb6sawos] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-mpgb6sawos 0.6s linear infinite; }
@keyframes spin-b-mpgb6sawos { to { transform: rotate(360deg); } }
.spin[b-mpgb6sawos] { animation: spin-b-mpgb6sawos 0.8s linear infinite; }

/* Form */
.form-row[b-mpgb6sawos] { display: flex; gap: 0.6rem; margin-bottom: 0.6rem; flex-wrap: wrap; }
.form-group[b-mpgb6sawos] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-mpgb6sawos] { flex: 2; }
.form-group label[b-mpgb6sawos] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-mpgb6sawos], .form-group select[b-mpgb6sawos], .form-group textarea[b-mpgb6sawos] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-mpgb6sawos], .form-group select:focus[b-mpgb6sawos], .form-group textarea:focus[b-mpgb6sawos] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.req[b-mpgb6sawos] { color: #ef4444; margin-left: 2px; }

/* Utilities */
.font-mono[b-mpgb6sawos] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-mpgb6sawos] { text-align: center; }
.text-right[b-mpgb6sawos] { text-align: right; }

/* Tabs del formulario (Nueva Factura | Historial) */
.fte-tabs[b-mpgb6sawos] { display: flex; gap: 0.25rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.fte-tab[b-mpgb6sawos] { padding: 0.5rem 1.1rem; border: none; background: transparent; font-size: 0.82rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; border-radius: 0.375rem 0.375rem 0 0; transition: all 0.15s; display: inline-flex; align-items: center; gap: 0.35rem; }
.fte-tab:hover[b-mpgb6sawos] { color: var(--rg-text-secondary, #475569); background: var(--rg-bg-hover, #f1f5f9); }
.fte-tab.active[b-mpgb6sawos] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); background: transparent; }
[data-mode="dark"] .fte-tab:hover[b-mpgb6sawos] { background: var(--rg-bg-hover); }
[data-mode="dark"] .fte-tab.active[b-mpgb6sawos] { color: var(--rg-accent); border-bottom-color: var(--rg-accent); }

/* Badge CRÉDITO (reemplaza el combo Tipo Doc) */
.fte-credito-badge[b-mpgb6sawos] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.75rem; background: rgba(79,70,229,0.12); color: var(--rg-accent, #4f46e5); border: 1px solid rgba(79,70,229,0.3); border-radius: 1rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
[data-mode="dark"] .fte-credito-badge[b-mpgb6sawos] { background: rgba(99,102,241,0.18); color: #a5b4fc; border-color: rgba(99,102,241,0.35); }

/* Badge tipo NCF del cliente */
.fte-ncf-badge[b-mpgb6sawos] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.65rem; background: rgba(16,185,129,0.1); color: #065f46; border: 1px solid rgba(16,185,129,0.3); border-radius: 1rem; font-size: 0.72rem; font-weight: 600; white-space: nowrap; }
[data-mode="dark"] .fte-ncf-badge[b-mpgb6sawos] { background: rgba(16,185,129,0.15); color: #6ee7b7; border-color: rgba(16,185,129,0.3); }

/* Historial grid */
.hist-search-bar[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.hist-search-bar input[b-mpgb6sawos] { flex: 1; padding: 0.4rem 0.65rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }
.hist-search-bar input:focus[b-mpgb6sawos] { border-color: var(--rg-accent, #4f46e5); }
.hist-count[b-mpgb6sawos] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }
[data-mode="dark"] .hist-search-bar input[b-mpgb6sawos] { background: var(--rg-bg-input); color: var(--rg-text-primary); border-color: var(--rg-border); }

/* Card secciones */
.fte-card[b-mpgb6sawos] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem 1.25rem; margin-bottom: 0.75rem; }
.fte-card-title[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.75rem; }

/* Cliente input compuesto */
.fte-cliente-input-wrap[b-mpgb6sawos] { display: flex; align-items: stretch; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; overflow: hidden; }
.fte-cliente-input-wrap input[b-mpgb6sawos] { flex: 1; padding: 0.375rem 0.5rem; border: none; outline: none; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); cursor: pointer; }
.fte-cliente-input-wrap input:focus[b-mpgb6sawos] { box-shadow: none; }
.fte-cliente-clear[b-mpgb6sawos], .fte-cliente-search[b-mpgb6sawos] { background: none; border: none; border-left: 1px solid var(--rg-border, #e2e8f0); padding: 0 0.5rem; cursor: pointer; color: var(--rg-text-muted, #94a3b8); transition: all 0.15s; display: flex; align-items: center; }
.fte-cliente-clear:hover[b-mpgb6sawos] { color: #ef4444; background: rgba(239,68,68,0.05); }
.fte-cliente-search:hover[b-mpgb6sawos] { color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.05); }

/* Cliente picker list */
.fte-client-list[b-mpgb6sawos] { max-height: calc(100vh - 320px); overflow-y: auto; }
.fte-client-row[b-mpgb6sawos] { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0.75rem; border-radius: 0.375rem; cursor: pointer; transition: background 0.12s; }
.fte-client-row:hover[b-mpgb6sawos] { background: var(--rg-bg-hover, #f8fafc); }
.fte-client-avatar[b-mpgb6sawos] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-subtle, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.1rem; flex-shrink: 0; }
.fte-client-info[b-mpgb6sawos] { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.fte-client-name[b-mpgb6sawos] { font-size: 0.82rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fte-client-id[b-mpgb6sawos] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }

/* Grilla de líneas */
.fte-grid-wrapper[b-mpgb6sawos] { overflow-x: auto; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; }
.fte-table[b-mpgb6sawos] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.fte-table thead[b-mpgb6sawos] { position: sticky; top: 0; z-index: 1; }
.fte-table th[b-mpgb6sawos] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.5rem 0.5rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.03em; }
.fte-table td[b-mpgb6sawos] { padding: 0.3rem 0.4rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.fte-table tbody tr:hover[b-mpgb6sawos] { background: var(--rg-bg-hover, #f8fafc); }
/* ← REGLA CRÍTICA: columnas numéricas alineadas a la derecha — mayor especificidad que th { text-align: left } */
.fte-table th.text-right[b-mpgb6sawos],
.fte-table td.text-right[b-mpgb6sawos] { text-align: right !important; }

.fte-cell-input[b-mpgb6sawos] { width: 100%; padding: 0.3rem 0.4rem; border: 1px solid transparent; border-radius: 0.25rem; font-size: 0.78rem; background: transparent; color: var(--rg-text-primary, #1e293b); outline: none; transition: all 0.12s; }
.fte-cell-input:focus[b-mpgb6sawos] { border-color: var(--rg-accent, #4f46e5); background: var(--rg-bg-input, #fff); box-shadow: 0 0 0 2px rgba(79,70,229,0.12); }
/* ITBIS sin seleccionar — borde rojo de alerta */
.fte-itbis-required[b-mpgb6sawos] { border-color: rgba(239,68,68,0.6) !important; background: rgba(239,68,68,0.04) !important; color: var(--rg-text-muted, #94a3b8) !important; }
[data-mode="dark"] .fte-itbis-required[b-mpgb6sawos] { border-color: rgba(239,68,68,0.5) !important; background: rgba(239,68,68,0.08) !important; }
.fte-cell-calc[b-mpgb6sawos] { font-family: 'Cascadia Code','Fira Code',monospace; color: var(--rg-text-secondary, #475569); white-space: nowrap; }
.fte-total-cell[b-mpgb6sawos] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.fte-row-num[b-mpgb6sawos] { color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; font-weight: 600; }

.fte-lineas-empty[b-mpgb6sawos] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.fte-lineas-empty i[b-mpgb6sawos] { font-size: 2rem; }
.fte-lineas-empty span[b-mpgb6sawos] { font-size: 0.8rem; }

/* Totales */
.fte-totales[b-mpgb6sawos] { display: flex; flex-direction: column; align-items: flex-end; gap: 0.25rem; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid var(--rg-border, #e2e8f0); }
.fte-total-row[b-mpgb6sawos] { display: flex; align-items: baseline; gap: 1rem; }
.fte-total-label[b-mpgb6sawos] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; min-width: 100px; text-align: right; }
.fte-total-value[b-mpgb6sawos] { font-size: 0.88rem; color: var(--rg-text-primary, #1e293b); min-width: 100px; text-align: right; }
.fte-total-final .fte-total-label[b-mpgb6sawos] { font-size: 0.82rem; color: var(--rg-accent, #4f46e5); }
.fte-total-final .fte-total-value[b-mpgb6sawos] { font-size: 1.05rem; font-weight: 800; color: var(--rg-accent, #4f46e5); }

/* Modal */
.modal-backdrop[b-mpgb6sawos] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-mpgb6sawos 0.15s ease-out; }
.modal-container[b-mpgb6sawos] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-mpgb6sawos] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-mpgb6sawos 0.2s ease-out; }
.modal-lg[b-mpgb6sawos] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-mpgb6sawos] { max-width: 420px; }
@keyframes fadeIn-b-mpgb6sawos { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-mpgb6sawos { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-mpgb6sawos] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-mpgb6sawos] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-mpgb6sawos] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-mpgb6sawos] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-mpgb6sawos] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-mpgb6sawos] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Modales anidados (post-save → envío) */
.modal-backdrop-nested[b-mpgb6sawos]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-mpgb6sawos] { z-index: 2001 !important; }

/* Panel post-grabado */
.ps-modal[b-mpgb6sawos] { max-width: 380px; }
.ps-recibo-info[b-mpgb6sawos] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem; }
.ps-label[b-mpgb6sawos] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.ps-value[b-mpgb6sawos] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.ps-cliente-info[b-mpgb6sawos] { display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--rg-text-secondary, #475569); margin-bottom: 1rem; }
.ps-acciones[b-mpgb6sawos] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-mpgb6sawos] { width: 100%; justify-content: center; }

/* Dark mode overrides */
[data-mode="dark"] .fte-card[b-mpgb6sawos] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .fte-cliente-input-wrap input[b-mpgb6sawos] { background: var(--rg-bg-input); color: var(--rg-text-primary); }
[data-mode="dark"] .fte-cell-input[b-mpgb6sawos] { color: var(--rg-text-primary); }
[data-mode="dark"] .fte-cell-input:focus[b-mpgb6sawos] { background: var(--rg-bg-input); }
[data-mode="dark"] .fte-table th[b-mpgb6sawos] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .fte-table tbody tr:hover[b-mpgb6sawos] { background: var(--rg-bg-hover); }
[data-mode="dark"] .modal-dialog[b-mpgb6sawos] { background: var(--rg-bg-card); }
[data-mode="dark"] .modal-header h2[b-mpgb6sawos] { color: var(--rg-text-primary); }
[data-mode="dark"] .ps-recibo-info[b-mpgb6sawos] { background: var(--rg-bg-subtle); border-color: var(--rg-border); }
[data-mode="dark"] .fte-client-row:hover[b-mpgb6sawos] { background: var(--rg-bg-hover); }
[data-mode="dark"] .fte-client-avatar[b-mpgb6sawos] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .crud-search-bar[b-mpgb6sawos] { background: var(--rg-bg-card); border-color: var(--rg-border); }
[data-mode="dark"] .crud-search-bar input[b-mpgb6sawos] { color: var(--rg-text-primary); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-mpgb6sawos] { padding: 0.75rem; }
    .crud-header[b-mpgb6sawos] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-mpgb6sawos] { display: none; }
    .form-row[b-mpgb6sawos] { flex-direction: column; }
    .modal-dialog[b-mpgb6sawos] { width: 98%; max-height: 95vh; }
    .modal-lg[b-mpgb6sawos] { width: 98vw; height: 95vh; }
    .fte-table th[b-mpgb6sawos], .fte-table td[b-mpgb6sawos] { font-size: 0.7rem; padding: 0.25rem; }
}

/* ── Modales anidados (envío sobre post-save) ─────────────── */
.modal-backdrop-nested[b-mpgb6sawos]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-mpgb6sawos] { z-index: 2001 !important; }

/* ── Panel post-grabado ───────────────────────────────────── */
.ps-modal[b-mpgb6sawos] { max-width: 380px; }
.ps-recibo-info[b-mpgb6sawos] {
    display: flex; align-items: baseline; gap: .6rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .5rem;
}
.ps-label[b-mpgb6sawos] {
    font-size: .7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .04em; color: var(--rg-text-muted);
}
.ps-value[b-mpgb6sawos] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-cliente-info[b-mpgb6sawos] {
    display: flex; align-items: center; gap: .4rem;
    font-size: .82rem; color: var(--rg-text-secondary);
    margin-bottom: 1rem;
}
.ps-acciones[b-mpgb6sawos] { display: flex; flex-direction: column; gap: .5rem; }
.ps-acciones .btn-crud[b-mpgb6sawos] { width: 100%; justify-content: center; }

.sf-tabs-main[b-mpgb6sawos] {
    display: flex; gap: 0; overflow-x: auto; scrollbar-width: thin;
    border-bottom: 2px solid var(--rg-border, #eef0f4);
    margin: 0 0 1rem;
}
.sf-tab-main[b-mpgb6sawos] {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .7rem .85rem;
    background: none; border: none;
    border-bottom: 2px solid transparent; margin-bottom: -2px;
    color: var(--rg-text-muted, #64748b);
    font-size: .78rem; font-weight: 500;
    cursor: pointer; white-space: nowrap;
    transition: all .2s ease;
}
.sf-tab-main:hover[b-mpgb6sawos] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.sf-tab-main.active[b-mpgb6sawos] {
    color: var(--rg-primary, #4f46e5);
    border-bottom-color: var(--rg-primary, #4f46e5);
    font-weight: 600;
}
.sf-tab-main i[b-mpgb6sawos] { font-size: .85rem; }
.sf-tab-text[b-mpgb6sawos] { display: inline; }

.crud-count[b-mpgb6sawos] { font-size: .7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; padding: 0 .5rem; }
.crud-search-btn[b-mpgb6sawos] {
    background: transparent; border: none; cursor: pointer;
    color: var(--rg-accent, #4f46e5); font-size: 1rem; padding: 0 .25rem;
}
.crud-search-btn:hover[b-mpgb6sawos] { color: var(--rg-primary, #4f46e5); }
.crud-grid-wrapper[b-mpgb6sawos] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem; overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: calc(100vh - 320px);
    margin: 0 0 1rem;
}
.crud-table[b-mpgb6sawos] { width: 100%; border-collapse: collapse; font-size: .78rem; }
.crud-table thead[b-mpgb6sawos] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-mpgb6sawos] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600; text-align: left;
    padding: .625rem .75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap; font-size: .72rem;
    text-transform: uppercase; letter-spacing: .03em;
}
.crud-table td[b-mpgb6sawos] {
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
}
.crud-table tbody tr:hover[b-mpgb6sawos] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-mpgb6sawos] { width: 96px; text-align: center; white-space: nowrap; }
.text-right[b-mpgb6sawos] { text-align: right !important; }
.text-center[b-mpgb6sawos] { text-align: center !important; }
.font-mono[b-mpgb6sawos] { font-family: var(--font-mono, ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmliquidacionaduanas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qiysldq6cz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qiysldq6cz 0.3s ease-out; }
@keyframes slideUp-b-qiysldq6cz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qiysldq6cz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qiysldq6cz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qiysldq6cz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qiysldq6cz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qiysldq6cz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qiysldq6cz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qiysldq6cz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qiysldq6cz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qiysldq6cz] { filter: brightness(1.1); }
.btn-outline[b-qiysldq6cz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qiysldq6cz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qiysldq6cz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qiysldq6cz] { filter: brightness(1.1); }
.btn-icon[b-qiysldq6cz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qiysldq6cz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qiysldq6cz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qiysldq6cz] { color: #ef4444; }
.btn-delete:hover[b-qiysldq6cz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qiysldq6cz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qiysldq6cz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qiysldq6cz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qiysldq6cz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qiysldq6cz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qiysldq6cz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qiysldq6cz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qiysldq6cz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qiysldq6cz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qiysldq6cz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qiysldq6cz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qiysldq6cz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qiysldq6cz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qiysldq6cz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qiysldq6cz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qiysldq6cz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qiysldq6cz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qiysldq6cz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qiysldq6cz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qiysldq6cz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qiysldq6cz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qiysldq6cz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qiysldq6cz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qiysldq6cz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qiysldq6cz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qiysldq6cz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qiysldq6cz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qiysldq6cz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qiysldq6cz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qiysldq6cz] { display: block; }
.hide-on-cards[b-qiysldq6cz] { display: none !important; }
.show-on-cards[b-qiysldq6cz] { display: grid; }
.hide-on-grid[b-qiysldq6cz] { display: none !important; }

/* Badges */
.badge[b-qiysldq6cz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qiysldq6cz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qiysldq6cz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qiysldq6cz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qiysldq6cz] { text-align: center; }
.text-muted[b-qiysldq6cz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qiysldq6cz], .crud-empty-state[b-qiysldq6cz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qiysldq6cz] { font-size: 2rem; }
.crud-spinner[b-qiysldq6cz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qiysldq6cz 0.6s linear infinite; }
.crud-spinner-sm[b-qiysldq6cz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qiysldq6cz 0.6s linear infinite; }
@keyframes spin-b-qiysldq6cz { to { transform: rotate(360deg); } }
.spin[b-qiysldq6cz] { animation: spin-b-qiysldq6cz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qiysldq6cz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qiysldq6cz 0.15s ease-out; }
.modal-container[b-qiysldq6cz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qiysldq6cz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qiysldq6cz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qiysldq6cz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qiysldq6cz] { max-width: 420px; }
@keyframes fadeIn-b-qiysldq6cz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qiysldq6cz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qiysldq6cz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qiysldq6cz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qiysldq6cz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qiysldq6cz] { color: #dc2626; }
.modal-close[b-qiysldq6cz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qiysldq6cz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qiysldq6cz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qiysldq6cz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qiysldq6cz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qiysldq6cz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qiysldq6cz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qiysldq6cz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qiysldq6cz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qiysldq6cz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qiysldq6cz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qiysldq6cz] { flex: 2; }
.form-group label[b-qiysldq6cz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qiysldq6cz], .form-group select[b-qiysldq6cz], .form-textarea[b-qiysldq6cz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qiysldq6cz], .form-group select:focus[b-qiysldq6cz], .form-textarea:focus[b-qiysldq6cz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qiysldq6cz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qiysldq6cz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qiysldq6cz] { flex: 1; display: flex; align-items: center; }
.form-check[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qiysldq6cz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qiysldq6cz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qiysldq6cz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qiysldq6cz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qiysldq6cz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qiysldq6cz] { font-size: 3rem; }
.photo-placeholder span[b-qiysldq6cz] { font-size: 0.78rem; }
.photo-actions[b-qiysldq6cz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qiysldq6cz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qiysldq6cz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qiysldq6cz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qiysldq6cz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qiysldq6cz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qiysldq6cz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qiysldq6cz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qiysldq6cz] { filter: brightness(1.15); transform: scale(1.05); }
[b-qiysldq6cz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qiysldq6cz] { padding: 0.75rem; }
    .crud-header[b-qiysldq6cz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qiysldq6cz] { font-size: 1.1rem; }
    .btn-text[b-qiysldq6cz] { display: none; }
    .form-row[b-qiysldq6cz] { flex-direction: column; }
    .form-row-4[b-qiysldq6cz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qiysldq6cz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qiysldq6cz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qiysldq6cz] { padding: 0.75rem; }
    .modal-tabs[b-qiysldq6cz] { overflow-x: auto; }
    .modal-tab[b-qiysldq6cz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qiysldq6cz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qiysldq6cz] { display: grid !important; }
    .crud-cards-wrapper[b-qiysldq6cz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qiysldq6cz] { grid-template-columns: 1fr; }
    .card-details[b-qiysldq6cz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qiysldq6cz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qiysldq6cz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qiysldq6cz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qiysldq6cz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmmantenimientoreportes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6uegrkassd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6uegrkassd 0.3s ease-out; }
@keyframes slideUp-b-6uegrkassd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6uegrkassd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6uegrkassd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6uegrkassd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6uegrkassd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6uegrkassd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6uegrkassd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6uegrkassd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6uegrkassd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6uegrkassd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6uegrkassd] { filter: brightness(1.1); }
.btn-outline[b-6uegrkassd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6uegrkassd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6uegrkassd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6uegrkassd] { filter: brightness(1.1); }
.btn-icon[b-6uegrkassd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6uegrkassd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6uegrkassd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6uegrkassd] { color: #ef4444; }
.btn-delete:hover[b-6uegrkassd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6uegrkassd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6uegrkassd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6uegrkassd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6uegrkassd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6uegrkassd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6uegrkassd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6uegrkassd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6uegrkassd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6uegrkassd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6uegrkassd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6uegrkassd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6uegrkassd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6uegrkassd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6uegrkassd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6uegrkassd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6uegrkassd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6uegrkassd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6uegrkassd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6uegrkassd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6uegrkassd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6uegrkassd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6uegrkassd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6uegrkassd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6uegrkassd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6uegrkassd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6uegrkassd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6uegrkassd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6uegrkassd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6uegrkassd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6uegrkassd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6uegrkassd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6uegrkassd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6uegrkassd] { display: block; }
.hide-on-cards[b-6uegrkassd] { display: none !important; }
.show-on-cards[b-6uegrkassd] { display: grid; }
.hide-on-grid[b-6uegrkassd] { display: none !important; }

/* Badges */
.badge[b-6uegrkassd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6uegrkassd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6uegrkassd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6uegrkassd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6uegrkassd] { text-align: center; }
.text-muted[b-6uegrkassd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6uegrkassd], .crud-empty-state[b-6uegrkassd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6uegrkassd] { font-size: 2rem; }
.crud-spinner[b-6uegrkassd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6uegrkassd 0.6s linear infinite; }
.crud-spinner-sm[b-6uegrkassd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6uegrkassd 0.6s linear infinite; }
@keyframes spin-b-6uegrkassd { to { transform: rotate(360deg); } }
.spin[b-6uegrkassd] { animation: spin-b-6uegrkassd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6uegrkassd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6uegrkassd 0.15s ease-out; }
.modal-container[b-6uegrkassd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6uegrkassd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6uegrkassd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6uegrkassd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6uegrkassd] { max-width: 420px; }
@keyframes fadeIn-b-6uegrkassd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6uegrkassd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6uegrkassd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6uegrkassd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6uegrkassd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6uegrkassd] { color: #dc2626; }
.modal-close[b-6uegrkassd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6uegrkassd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6uegrkassd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6uegrkassd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6uegrkassd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6uegrkassd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6uegrkassd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6uegrkassd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6uegrkassd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6uegrkassd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6uegrkassd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6uegrkassd] { flex: 2; }
.form-group label[b-6uegrkassd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6uegrkassd], .form-group select[b-6uegrkassd], .form-textarea[b-6uegrkassd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6uegrkassd], .form-group select:focus[b-6uegrkassd], .form-textarea:focus[b-6uegrkassd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6uegrkassd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6uegrkassd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6uegrkassd] { flex: 1; display: flex; align-items: center; }
.form-check[b-6uegrkassd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6uegrkassd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6uegrkassd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6uegrkassd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6uegrkassd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6uegrkassd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6uegrkassd] { font-size: 3rem; }
.photo-placeholder span[b-6uegrkassd] { font-size: 0.78rem; }
.photo-actions[b-6uegrkassd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6uegrkassd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6uegrkassd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6uegrkassd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6uegrkassd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6uegrkassd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6uegrkassd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6uegrkassd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6uegrkassd] { filter: brightness(1.15); transform: scale(1.05); }
[b-6uegrkassd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6uegrkassd] { padding: 0.75rem; }
    .crud-header[b-6uegrkassd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6uegrkassd] { font-size: 1.1rem; }
    .btn-text[b-6uegrkassd] { display: none; }
    .form-row[b-6uegrkassd] { flex-direction: column; }
    .form-row-4[b-6uegrkassd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6uegrkassd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6uegrkassd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6uegrkassd] { padding: 0.75rem; }
    .modal-tabs[b-6uegrkassd] { overflow-x: auto; }
    .modal-tab[b-6uegrkassd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6uegrkassd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6uegrkassd] { display: grid !important; }
    .crud-cards-wrapper[b-6uegrkassd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6uegrkassd] { grid-template-columns: 1fr; }
    .card-details[b-6uegrkassd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6uegrkassd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6uegrkassd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6uegrkassd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6uegrkassd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmmonedatasaopdeldia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1ue6zrj9no] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1ue6zrj9no 0.3s ease-out; }
@keyframes slideUp-b-1ue6zrj9no { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1ue6zrj9no] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1ue6zrj9no] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1ue6zrj9no] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1ue6zrj9no] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1ue6zrj9no] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1ue6zrj9no] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1ue6zrj9no] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1ue6zrj9no] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1ue6zrj9no] { filter: brightness(1.1); }
.btn-outline[b-1ue6zrj9no] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1ue6zrj9no] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1ue6zrj9no] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1ue6zrj9no] { filter: brightness(1.1); }
.btn-icon[b-1ue6zrj9no] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1ue6zrj9no] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1ue6zrj9no] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1ue6zrj9no] { color: #ef4444; }
.btn-delete:hover[b-1ue6zrj9no] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1ue6zrj9no] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1ue6zrj9no] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1ue6zrj9no] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1ue6zrj9no] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1ue6zrj9no] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1ue6zrj9no] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1ue6zrj9no] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1ue6zrj9no] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1ue6zrj9no] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1ue6zrj9no] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1ue6zrj9no] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1ue6zrj9no] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1ue6zrj9no] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1ue6zrj9no] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1ue6zrj9no] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1ue6zrj9no] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1ue6zrj9no] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1ue6zrj9no] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1ue6zrj9no] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1ue6zrj9no] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1ue6zrj9no] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1ue6zrj9no] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1ue6zrj9no] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1ue6zrj9no] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1ue6zrj9no] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1ue6zrj9no] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1ue6zrj9no] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1ue6zrj9no] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1ue6zrj9no] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1ue6zrj9no] { display: block; }
.hide-on-cards[b-1ue6zrj9no] { display: none !important; }
.show-on-cards[b-1ue6zrj9no] { display: grid; }
.hide-on-grid[b-1ue6zrj9no] { display: none !important; }

/* Badges */
.badge[b-1ue6zrj9no] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1ue6zrj9no] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1ue6zrj9no] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1ue6zrj9no] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1ue6zrj9no] { text-align: center; }
.text-muted[b-1ue6zrj9no] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1ue6zrj9no], .crud-empty-state[b-1ue6zrj9no] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1ue6zrj9no] { font-size: 2rem; }
.crud-spinner[b-1ue6zrj9no] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1ue6zrj9no 0.6s linear infinite; }
.crud-spinner-sm[b-1ue6zrj9no] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1ue6zrj9no 0.6s linear infinite; }
@keyframes spin-b-1ue6zrj9no { to { transform: rotate(360deg); } }
.spin[b-1ue6zrj9no] { animation: spin-b-1ue6zrj9no 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1ue6zrj9no] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1ue6zrj9no 0.15s ease-out; }
.modal-container[b-1ue6zrj9no] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1ue6zrj9no] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1ue6zrj9no 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1ue6zrj9no] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1ue6zrj9no] { max-width: 420px; }
@keyframes fadeIn-b-1ue6zrj9no { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1ue6zrj9no { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1ue6zrj9no] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1ue6zrj9no] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1ue6zrj9no] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1ue6zrj9no] { color: #dc2626; }
.modal-close[b-1ue6zrj9no] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1ue6zrj9no] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1ue6zrj9no] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1ue6zrj9no] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1ue6zrj9no] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1ue6zrj9no] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1ue6zrj9no] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1ue6zrj9no] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1ue6zrj9no] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1ue6zrj9no] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1ue6zrj9no] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1ue6zrj9no] { flex: 2; }
.form-group label[b-1ue6zrj9no] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1ue6zrj9no], .form-group select[b-1ue6zrj9no], .form-textarea[b-1ue6zrj9no] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1ue6zrj9no], .form-group select:focus[b-1ue6zrj9no], .form-textarea:focus[b-1ue6zrj9no] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1ue6zrj9no] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1ue6zrj9no] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1ue6zrj9no] { flex: 1; display: flex; align-items: center; }
.form-check[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1ue6zrj9no] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1ue6zrj9no] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1ue6zrj9no] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1ue6zrj9no] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1ue6zrj9no] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1ue6zrj9no] { font-size: 3rem; }
.photo-placeholder span[b-1ue6zrj9no] { font-size: 0.78rem; }
.photo-actions[b-1ue6zrj9no] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1ue6zrj9no] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1ue6zrj9no] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1ue6zrj9no] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1ue6zrj9no] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1ue6zrj9no] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1ue6zrj9no] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1ue6zrj9no] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1ue6zrj9no] { filter: brightness(1.15); transform: scale(1.05); }
[b-1ue6zrj9no] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1ue6zrj9no] { padding: 0.75rem; }
    .crud-header[b-1ue6zrj9no] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1ue6zrj9no] { font-size: 1.1rem; }
    .btn-text[b-1ue6zrj9no] { display: none; }
    .form-row[b-1ue6zrj9no] { flex-direction: column; }
    .form-row-4[b-1ue6zrj9no] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1ue6zrj9no] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1ue6zrj9no] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1ue6zrj9no] { padding: 0.75rem; }
    .modal-tabs[b-1ue6zrj9no] { overflow-x: auto; }
    .modal-tab[b-1ue6zrj9no] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1ue6zrj9no] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1ue6zrj9no] { display: grid !important; }
    .crud-cards-wrapper[b-1ue6zrj9no] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1ue6zrj9no] { grid-template-columns: 1fr; }
    .card-details[b-1ue6zrj9no] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1ue6zrj9no] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1ue6zrj9no] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1ue6zrj9no] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1ue6zrj9no] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmnominaplantillav2.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xtwrkp1gha] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xtwrkp1gha 0.3s ease-out; }
@keyframes slideUp-b-xtwrkp1gha { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xtwrkp1gha] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xtwrkp1gha] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xtwrkp1gha] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xtwrkp1gha] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xtwrkp1gha] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xtwrkp1gha] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xtwrkp1gha] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xtwrkp1gha] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xtwrkp1gha] { filter: brightness(1.1); }
.btn-outline[b-xtwrkp1gha] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xtwrkp1gha] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xtwrkp1gha] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xtwrkp1gha] { filter: brightness(1.1); }
.btn-icon[b-xtwrkp1gha] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xtwrkp1gha] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xtwrkp1gha] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xtwrkp1gha] { color: #ef4444; }
.btn-delete:hover[b-xtwrkp1gha] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xtwrkp1gha] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xtwrkp1gha] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xtwrkp1gha] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xtwrkp1gha] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xtwrkp1gha] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xtwrkp1gha] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xtwrkp1gha] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xtwrkp1gha] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xtwrkp1gha] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xtwrkp1gha] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xtwrkp1gha] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xtwrkp1gha] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xtwrkp1gha] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xtwrkp1gha] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xtwrkp1gha] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xtwrkp1gha] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xtwrkp1gha] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xtwrkp1gha] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xtwrkp1gha] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xtwrkp1gha] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xtwrkp1gha] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xtwrkp1gha] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xtwrkp1gha] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xtwrkp1gha] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xtwrkp1gha] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xtwrkp1gha] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xtwrkp1gha] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xtwrkp1gha] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xtwrkp1gha] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xtwrkp1gha] { display: block; }
.hide-on-cards[b-xtwrkp1gha] { display: none !important; }
.show-on-cards[b-xtwrkp1gha] { display: grid; }
.hide-on-grid[b-xtwrkp1gha] { display: none !important; }

/* Badges */
.badge[b-xtwrkp1gha] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xtwrkp1gha] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xtwrkp1gha] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xtwrkp1gha] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xtwrkp1gha] { text-align: center; }
.text-muted[b-xtwrkp1gha] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xtwrkp1gha], .crud-empty-state[b-xtwrkp1gha] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xtwrkp1gha] { font-size: 2rem; }
.crud-spinner[b-xtwrkp1gha] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xtwrkp1gha 0.6s linear infinite; }
.crud-spinner-sm[b-xtwrkp1gha] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xtwrkp1gha 0.6s linear infinite; }
@keyframes spin-b-xtwrkp1gha { to { transform: rotate(360deg); } }
.spin[b-xtwrkp1gha] { animation: spin-b-xtwrkp1gha 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xtwrkp1gha] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xtwrkp1gha 0.15s ease-out; }
.modal-container[b-xtwrkp1gha] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xtwrkp1gha] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xtwrkp1gha 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xtwrkp1gha] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xtwrkp1gha] { max-width: 420px; }
@keyframes fadeIn-b-xtwrkp1gha { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xtwrkp1gha { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xtwrkp1gha] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xtwrkp1gha] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xtwrkp1gha] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xtwrkp1gha] { color: #dc2626; }
.modal-close[b-xtwrkp1gha] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xtwrkp1gha] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xtwrkp1gha] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xtwrkp1gha] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xtwrkp1gha] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xtwrkp1gha] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xtwrkp1gha] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xtwrkp1gha] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xtwrkp1gha] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xtwrkp1gha] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xtwrkp1gha] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xtwrkp1gha] { flex: 2; }
.form-group label[b-xtwrkp1gha] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xtwrkp1gha], .form-group select[b-xtwrkp1gha], .form-textarea[b-xtwrkp1gha] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xtwrkp1gha], .form-group select:focus[b-xtwrkp1gha], .form-textarea:focus[b-xtwrkp1gha] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xtwrkp1gha] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xtwrkp1gha] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xtwrkp1gha] { flex: 1; display: flex; align-items: center; }
.form-check[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xtwrkp1gha] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xtwrkp1gha] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xtwrkp1gha] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xtwrkp1gha] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xtwrkp1gha] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xtwrkp1gha] { font-size: 3rem; }
.photo-placeholder span[b-xtwrkp1gha] { font-size: 0.78rem; }
.photo-actions[b-xtwrkp1gha] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xtwrkp1gha] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xtwrkp1gha] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xtwrkp1gha] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xtwrkp1gha] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xtwrkp1gha] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xtwrkp1gha] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xtwrkp1gha] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xtwrkp1gha] { filter: brightness(1.15); transform: scale(1.05); }
[b-xtwrkp1gha] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xtwrkp1gha] { padding: 0.75rem; }
    .crud-header[b-xtwrkp1gha] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xtwrkp1gha] { font-size: 1.1rem; }
    .btn-text[b-xtwrkp1gha] { display: none; }
    .form-row[b-xtwrkp1gha] { flex-direction: column; }
    .form-row-4[b-xtwrkp1gha] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xtwrkp1gha] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xtwrkp1gha] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xtwrkp1gha] { padding: 0.75rem; }
    .modal-tabs[b-xtwrkp1gha] { overflow-x: auto; }
    .modal-tab[b-xtwrkp1gha] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xtwrkp1gha] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xtwrkp1gha] { display: grid !important; }
    .crud-cards-wrapper[b-xtwrkp1gha] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xtwrkp1gha] { grid-template-columns: 1fr; }
    .card-details[b-xtwrkp1gha] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xtwrkp1gha] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xtwrkp1gha] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xtwrkp1gha] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xtwrkp1gha] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmoptreimpresiondocumentos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lzoxtv2m4i] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lzoxtv2m4i 0.3s ease-out; }
@keyframes slideUp-b-lzoxtv2m4i { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lzoxtv2m4i] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lzoxtv2m4i] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lzoxtv2m4i] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lzoxtv2m4i] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lzoxtv2m4i] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lzoxtv2m4i] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lzoxtv2m4i] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lzoxtv2m4i] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lzoxtv2m4i] { filter: brightness(1.1); }
.btn-outline[b-lzoxtv2m4i] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lzoxtv2m4i] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lzoxtv2m4i] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lzoxtv2m4i] { filter: brightness(1.1); }
.btn-icon[b-lzoxtv2m4i] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lzoxtv2m4i] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lzoxtv2m4i] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lzoxtv2m4i] { color: #ef4444; }
.btn-delete:hover[b-lzoxtv2m4i] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lzoxtv2m4i] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lzoxtv2m4i] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lzoxtv2m4i] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lzoxtv2m4i] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lzoxtv2m4i] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lzoxtv2m4i] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lzoxtv2m4i] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lzoxtv2m4i] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lzoxtv2m4i] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lzoxtv2m4i] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lzoxtv2m4i] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lzoxtv2m4i] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lzoxtv2m4i] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lzoxtv2m4i] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lzoxtv2m4i] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lzoxtv2m4i] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lzoxtv2m4i] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lzoxtv2m4i] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lzoxtv2m4i] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lzoxtv2m4i] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lzoxtv2m4i] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lzoxtv2m4i] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lzoxtv2m4i] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lzoxtv2m4i] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lzoxtv2m4i] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lzoxtv2m4i] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lzoxtv2m4i] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lzoxtv2m4i] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lzoxtv2m4i] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lzoxtv2m4i] { display: block; }
.hide-on-cards[b-lzoxtv2m4i] { display: none !important; }
.show-on-cards[b-lzoxtv2m4i] { display: grid; }
.hide-on-grid[b-lzoxtv2m4i] { display: none !important; }

/* Badges */
.badge[b-lzoxtv2m4i] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lzoxtv2m4i] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lzoxtv2m4i] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lzoxtv2m4i] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lzoxtv2m4i] { text-align: center; }
.text-muted[b-lzoxtv2m4i] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lzoxtv2m4i], .crud-empty-state[b-lzoxtv2m4i] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lzoxtv2m4i] { font-size: 2rem; }
.crud-spinner[b-lzoxtv2m4i] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lzoxtv2m4i 0.6s linear infinite; }
.crud-spinner-sm[b-lzoxtv2m4i] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lzoxtv2m4i 0.6s linear infinite; }
@keyframes spin-b-lzoxtv2m4i { to { transform: rotate(360deg); } }
.spin[b-lzoxtv2m4i] { animation: spin-b-lzoxtv2m4i 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lzoxtv2m4i] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lzoxtv2m4i 0.15s ease-out; }
.modal-container[b-lzoxtv2m4i] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lzoxtv2m4i] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lzoxtv2m4i 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lzoxtv2m4i] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lzoxtv2m4i] { max-width: 420px; }
@keyframes fadeIn-b-lzoxtv2m4i { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lzoxtv2m4i { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lzoxtv2m4i] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lzoxtv2m4i] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lzoxtv2m4i] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lzoxtv2m4i] { color: #dc2626; }
.modal-close[b-lzoxtv2m4i] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lzoxtv2m4i] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lzoxtv2m4i] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lzoxtv2m4i] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lzoxtv2m4i] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lzoxtv2m4i] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lzoxtv2m4i] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lzoxtv2m4i] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lzoxtv2m4i] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lzoxtv2m4i] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lzoxtv2m4i] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lzoxtv2m4i] { flex: 2; }
.form-group label[b-lzoxtv2m4i] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lzoxtv2m4i], .form-group select[b-lzoxtv2m4i], .form-textarea[b-lzoxtv2m4i] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lzoxtv2m4i], .form-group select:focus[b-lzoxtv2m4i], .form-textarea:focus[b-lzoxtv2m4i] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lzoxtv2m4i] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lzoxtv2m4i] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lzoxtv2m4i] { flex: 1; display: flex; align-items: center; }
.form-check[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lzoxtv2m4i] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lzoxtv2m4i] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lzoxtv2m4i] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lzoxtv2m4i] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lzoxtv2m4i] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lzoxtv2m4i] { font-size: 3rem; }
.photo-placeholder span[b-lzoxtv2m4i] { font-size: 0.78rem; }
.photo-actions[b-lzoxtv2m4i] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lzoxtv2m4i] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lzoxtv2m4i] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lzoxtv2m4i] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lzoxtv2m4i] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lzoxtv2m4i] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lzoxtv2m4i] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lzoxtv2m4i] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lzoxtv2m4i] { filter: brightness(1.15); transform: scale(1.05); }
[b-lzoxtv2m4i] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lzoxtv2m4i] { padding: 0.75rem; }
    .crud-header[b-lzoxtv2m4i] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lzoxtv2m4i] { font-size: 1.1rem; }
    .btn-text[b-lzoxtv2m4i] { display: none; }
    .form-row[b-lzoxtv2m4i] { flex-direction: column; }
    .form-row-4[b-lzoxtv2m4i] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lzoxtv2m4i] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lzoxtv2m4i] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lzoxtv2m4i] { padding: 0.75rem; }
    .modal-tabs[b-lzoxtv2m4i] { overflow-x: auto; }
    .modal-tab[b-lzoxtv2m4i] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lzoxtv2m4i] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lzoxtv2m4i] { display: grid !important; }
    .crud-cards-wrapper[b-lzoxtv2m4i] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lzoxtv2m4i] { grid-template-columns: 1fr; }
    .card-details[b-lzoxtv2m4i] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lzoxtv2m4i] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lzoxtv2m4i] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lzoxtv2m4i] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lzoxtv2m4i] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmpuntoventa.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-mtwbhtj4gd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-mtwbhtj4gd 0.3s ease-out; }
@keyframes slideUp-b-mtwbhtj4gd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-mtwbhtj4gd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-mtwbhtj4gd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-mtwbhtj4gd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-mtwbhtj4gd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-mtwbhtj4gd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-mtwbhtj4gd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-mtwbhtj4gd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-mtwbhtj4gd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-mtwbhtj4gd] { filter: brightness(1.1); }
.btn-outline[b-mtwbhtj4gd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-mtwbhtj4gd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-mtwbhtj4gd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-mtwbhtj4gd] { filter: brightness(1.1); }
.btn-icon[b-mtwbhtj4gd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-mtwbhtj4gd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-mtwbhtj4gd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-mtwbhtj4gd] { color: #ef4444; }
.btn-delete:hover[b-mtwbhtj4gd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-mtwbhtj4gd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-mtwbhtj4gd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-mtwbhtj4gd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-mtwbhtj4gd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-mtwbhtj4gd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-mtwbhtj4gd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-mtwbhtj4gd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-mtwbhtj4gd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-mtwbhtj4gd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-mtwbhtj4gd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-mtwbhtj4gd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-mtwbhtj4gd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-mtwbhtj4gd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-mtwbhtj4gd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-mtwbhtj4gd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-mtwbhtj4gd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-mtwbhtj4gd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-mtwbhtj4gd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-mtwbhtj4gd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-mtwbhtj4gd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-mtwbhtj4gd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-mtwbhtj4gd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-mtwbhtj4gd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-mtwbhtj4gd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-mtwbhtj4gd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-mtwbhtj4gd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-mtwbhtj4gd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-mtwbhtj4gd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-mtwbhtj4gd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-mtwbhtj4gd] { display: block; }
.hide-on-cards[b-mtwbhtj4gd] { display: none !important; }
.show-on-cards[b-mtwbhtj4gd] { display: grid; }
.hide-on-grid[b-mtwbhtj4gd] { display: none !important; }

/* Badges */
.badge[b-mtwbhtj4gd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-mtwbhtj4gd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-mtwbhtj4gd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-mtwbhtj4gd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-mtwbhtj4gd] { text-align: center; }
.text-muted[b-mtwbhtj4gd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-mtwbhtj4gd], .crud-empty-state[b-mtwbhtj4gd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-mtwbhtj4gd] { font-size: 2rem; }
.crud-spinner[b-mtwbhtj4gd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-mtwbhtj4gd 0.6s linear infinite; }
.crud-spinner-sm[b-mtwbhtj4gd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-mtwbhtj4gd 0.6s linear infinite; }
@keyframes spin-b-mtwbhtj4gd { to { transform: rotate(360deg); } }
.spin[b-mtwbhtj4gd] { animation: spin-b-mtwbhtj4gd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-mtwbhtj4gd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-mtwbhtj4gd 0.15s ease-out; }
.modal-container[b-mtwbhtj4gd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-mtwbhtj4gd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-mtwbhtj4gd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-mtwbhtj4gd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-mtwbhtj4gd] { max-width: 420px; }
@keyframes fadeIn-b-mtwbhtj4gd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-mtwbhtj4gd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-mtwbhtj4gd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-mtwbhtj4gd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-mtwbhtj4gd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-mtwbhtj4gd] { color: #dc2626; }
.modal-close[b-mtwbhtj4gd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-mtwbhtj4gd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-mtwbhtj4gd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-mtwbhtj4gd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-mtwbhtj4gd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-mtwbhtj4gd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-mtwbhtj4gd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-mtwbhtj4gd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-mtwbhtj4gd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-mtwbhtj4gd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-mtwbhtj4gd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-mtwbhtj4gd] { flex: 2; }
.form-group label[b-mtwbhtj4gd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-mtwbhtj4gd], .form-group select[b-mtwbhtj4gd], .form-textarea[b-mtwbhtj4gd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-mtwbhtj4gd], .form-group select:focus[b-mtwbhtj4gd], .form-textarea:focus[b-mtwbhtj4gd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-mtwbhtj4gd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-mtwbhtj4gd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-mtwbhtj4gd] { flex: 1; display: flex; align-items: center; }
.form-check[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-mtwbhtj4gd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-mtwbhtj4gd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-mtwbhtj4gd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-mtwbhtj4gd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-mtwbhtj4gd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-mtwbhtj4gd] { font-size: 3rem; }
.photo-placeholder span[b-mtwbhtj4gd] { font-size: 0.78rem; }
.photo-actions[b-mtwbhtj4gd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-mtwbhtj4gd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-mtwbhtj4gd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-mtwbhtj4gd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-mtwbhtj4gd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-mtwbhtj4gd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-mtwbhtj4gd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-mtwbhtj4gd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-mtwbhtj4gd] { filter: brightness(1.15); transform: scale(1.05); }
[b-mtwbhtj4gd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-mtwbhtj4gd] { padding: 0.75rem; }
    .crud-header[b-mtwbhtj4gd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-mtwbhtj4gd] { font-size: 1.1rem; }
    .btn-text[b-mtwbhtj4gd] { display: none; }
    .form-row[b-mtwbhtj4gd] { flex-direction: column; }
    .form-row-4[b-mtwbhtj4gd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-mtwbhtj4gd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-mtwbhtj4gd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-mtwbhtj4gd] { padding: 0.75rem; }
    .modal-tabs[b-mtwbhtj4gd] { overflow-x: auto; }
    .modal-tab[b-mtwbhtj4gd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-mtwbhtj4gd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-mtwbhtj4gd] { display: grid !important; }
    .crud-cards-wrapper[b-mtwbhtj4gd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-mtwbhtj4gd] { grid-template-columns: 1fr; }
    .card-details[b-mtwbhtj4gd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-mtwbhtj4gd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-mtwbhtj4gd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-mtwbhtj4gd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-mtwbhtj4gd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmrecargatarjetas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tcge709ua3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tcge709ua3 0.3s ease-out; }
@keyframes slideUp-b-tcge709ua3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tcge709ua3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tcge709ua3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tcge709ua3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tcge709ua3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tcge709ua3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tcge709ua3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tcge709ua3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tcge709ua3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tcge709ua3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tcge709ua3] { filter: brightness(1.1); }
.btn-outline[b-tcge709ua3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tcge709ua3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tcge709ua3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tcge709ua3] { filter: brightness(1.1); }
.btn-icon[b-tcge709ua3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tcge709ua3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tcge709ua3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tcge709ua3] { color: #ef4444; }
.btn-delete:hover[b-tcge709ua3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tcge709ua3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tcge709ua3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tcge709ua3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tcge709ua3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tcge709ua3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tcge709ua3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tcge709ua3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tcge709ua3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tcge709ua3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tcge709ua3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tcge709ua3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tcge709ua3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tcge709ua3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tcge709ua3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tcge709ua3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tcge709ua3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tcge709ua3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tcge709ua3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tcge709ua3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tcge709ua3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tcge709ua3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tcge709ua3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tcge709ua3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tcge709ua3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tcge709ua3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tcge709ua3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tcge709ua3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tcge709ua3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tcge709ua3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tcge709ua3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tcge709ua3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tcge709ua3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tcge709ua3] { display: block; }
.hide-on-cards[b-tcge709ua3] { display: none !important; }
.show-on-cards[b-tcge709ua3] { display: grid; }
.hide-on-grid[b-tcge709ua3] { display: none !important; }

/* Badges */
.badge[b-tcge709ua3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tcge709ua3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tcge709ua3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tcge709ua3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tcge709ua3] { text-align: center; }
.text-muted[b-tcge709ua3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tcge709ua3], .crud-empty-state[b-tcge709ua3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tcge709ua3] { font-size: 2rem; }
.crud-spinner[b-tcge709ua3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tcge709ua3 0.6s linear infinite; }
.crud-spinner-sm[b-tcge709ua3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tcge709ua3 0.6s linear infinite; }
@keyframes spin-b-tcge709ua3 { to { transform: rotate(360deg); } }
.spin[b-tcge709ua3] { animation: spin-b-tcge709ua3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tcge709ua3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tcge709ua3 0.15s ease-out; }
.modal-container[b-tcge709ua3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tcge709ua3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tcge709ua3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tcge709ua3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tcge709ua3] { max-width: 420px; }
@keyframes fadeIn-b-tcge709ua3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tcge709ua3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tcge709ua3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tcge709ua3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tcge709ua3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tcge709ua3] { color: #dc2626; }
.modal-close[b-tcge709ua3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tcge709ua3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tcge709ua3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tcge709ua3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tcge709ua3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tcge709ua3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tcge709ua3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tcge709ua3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tcge709ua3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tcge709ua3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tcge709ua3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tcge709ua3] { flex: 2; }
.form-group label[b-tcge709ua3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tcge709ua3], .form-group select[b-tcge709ua3], .form-textarea[b-tcge709ua3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tcge709ua3], .form-group select:focus[b-tcge709ua3], .form-textarea:focus[b-tcge709ua3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tcge709ua3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tcge709ua3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tcge709ua3] { flex: 1; display: flex; align-items: center; }
.form-check[b-tcge709ua3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tcge709ua3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tcge709ua3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tcge709ua3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tcge709ua3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tcge709ua3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tcge709ua3] { font-size: 3rem; }
.photo-placeholder span[b-tcge709ua3] { font-size: 0.78rem; }
.photo-actions[b-tcge709ua3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tcge709ua3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tcge709ua3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tcge709ua3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tcge709ua3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tcge709ua3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tcge709ua3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tcge709ua3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tcge709ua3] { filter: brightness(1.15); transform: scale(1.05); }
[b-tcge709ua3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tcge709ua3] { padding: 0.75rem; }
    .crud-header[b-tcge709ua3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tcge709ua3] { font-size: 1.1rem; }
    .btn-text[b-tcge709ua3] { display: none; }
    .form-row[b-tcge709ua3] { flex-direction: column; }
    .form-row-4[b-tcge709ua3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tcge709ua3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tcge709ua3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tcge709ua3] { padding: 0.75rem; }
    .modal-tabs[b-tcge709ua3] { overflow-x: auto; }
    .modal-tab[b-tcge709ua3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tcge709ua3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tcge709ua3] { display: grid !important; }
    .crud-cards-wrapper[b-tcge709ua3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tcge709ua3] { grid-template-columns: 1fr; }
    .card-details[b-tcge709ua3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tcge709ua3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tcge709ua3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tcge709ua3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tcge709ua3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmreporteimpresorafiscal.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-c1lpx34w1e] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c1lpx34w1e 0.3s ease-out; }
@keyframes slideUp-b-c1lpx34w1e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-c1lpx34w1e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c1lpx34w1e] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c1lpx34w1e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c1lpx34w1e] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c1lpx34w1e] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-c1lpx34w1e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c1lpx34w1e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c1lpx34w1e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c1lpx34w1e] { filter: brightness(1.1); }
.btn-outline[b-c1lpx34w1e] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c1lpx34w1e] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-c1lpx34w1e] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-c1lpx34w1e] { filter: brightness(1.1); }
.btn-icon[b-c1lpx34w1e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-c1lpx34w1e] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-c1lpx34w1e] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-c1lpx34w1e] { color: #ef4444; }
.btn-delete:hover[b-c1lpx34w1e] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-c1lpx34w1e] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c1lpx34w1e] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-c1lpx34w1e] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-c1lpx34w1e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-c1lpx34w1e] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-c1lpx34w1e] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-c1lpx34w1e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-c1lpx34w1e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-c1lpx34w1e] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-c1lpx34w1e] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c1lpx34w1e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c1lpx34w1e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-c1lpx34w1e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c1lpx34w1e] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-c1lpx34w1e] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-c1lpx34w1e] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-c1lpx34w1e] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-c1lpx34w1e] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-c1lpx34w1e] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-c1lpx34w1e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-c1lpx34w1e] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-c1lpx34w1e] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-c1lpx34w1e] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-c1lpx34w1e] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-c1lpx34w1e] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-c1lpx34w1e] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-c1lpx34w1e] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-c1lpx34w1e] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-c1lpx34w1e] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-c1lpx34w1e] { display: block; }
.hide-on-cards[b-c1lpx34w1e] { display: none !important; }
.show-on-cards[b-c1lpx34w1e] { display: grid; }
.hide-on-grid[b-c1lpx34w1e] { display: none !important; }

/* Badges */
.badge[b-c1lpx34w1e] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-c1lpx34w1e] { background: #ecfdf5; color: #065f46; }
.badge-no[b-c1lpx34w1e] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-c1lpx34w1e] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-c1lpx34w1e] { text-align: center; }
.text-muted[b-c1lpx34w1e] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-c1lpx34w1e], .crud-empty-state[b-c1lpx34w1e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c1lpx34w1e] { font-size: 2rem; }
.crud-spinner[b-c1lpx34w1e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-c1lpx34w1e 0.6s linear infinite; }
.crud-spinner-sm[b-c1lpx34w1e] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-c1lpx34w1e 0.6s linear infinite; }
@keyframes spin-b-c1lpx34w1e { to { transform: rotate(360deg); } }
.spin[b-c1lpx34w1e] { animation: spin-b-c1lpx34w1e 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-c1lpx34w1e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-c1lpx34w1e 0.15s ease-out; }
.modal-container[b-c1lpx34w1e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-c1lpx34w1e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-c1lpx34w1e 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-c1lpx34w1e] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-c1lpx34w1e] { max-width: 420px; }
@keyframes fadeIn-b-c1lpx34w1e { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-c1lpx34w1e { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-c1lpx34w1e] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-c1lpx34w1e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-c1lpx34w1e] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-c1lpx34w1e] { color: #dc2626; }
.modal-close[b-c1lpx34w1e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-c1lpx34w1e] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-c1lpx34w1e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-c1lpx34w1e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-c1lpx34w1e] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-c1lpx34w1e] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-c1lpx34w1e] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-c1lpx34w1e] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-c1lpx34w1e] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-c1lpx34w1e] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-c1lpx34w1e] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-c1lpx34w1e] { flex: 2; }
.form-group label[b-c1lpx34w1e] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-c1lpx34w1e], .form-group select[b-c1lpx34w1e], .form-textarea[b-c1lpx34w1e] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-c1lpx34w1e], .form-group select:focus[b-c1lpx34w1e], .form-textarea:focus[b-c1lpx34w1e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-c1lpx34w1e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-c1lpx34w1e] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-c1lpx34w1e] { flex: 1; display: flex; align-items: center; }
.form-check[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-c1lpx34w1e] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-c1lpx34w1e] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-c1lpx34w1e] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-c1lpx34w1e] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-c1lpx34w1e] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-c1lpx34w1e] { font-size: 3rem; }
.photo-placeholder span[b-c1lpx34w1e] { font-size: 0.78rem; }
.photo-actions[b-c1lpx34w1e] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-c1lpx34w1e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-c1lpx34w1e] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-c1lpx34w1e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-c1lpx34w1e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-c1lpx34w1e] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-c1lpx34w1e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-c1lpx34w1e] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-c1lpx34w1e] { filter: brightness(1.15); transform: scale(1.05); }
[b-c1lpx34w1e] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-c1lpx34w1e] { padding: 0.75rem; }
    .crud-header[b-c1lpx34w1e] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-c1lpx34w1e] { font-size: 1.1rem; }
    .btn-text[b-c1lpx34w1e] { display: none; }
    .form-row[b-c1lpx34w1e] { flex-direction: column; }
    .form-row-4[b-c1lpx34w1e] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-c1lpx34w1e] { width: 98%; max-height: 95vh; }
    .modal-lg[b-c1lpx34w1e] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-c1lpx34w1e] { padding: 0.75rem; }
    .modal-tabs[b-c1lpx34w1e] { overflow-x: auto; }
    .modal-tab[b-c1lpx34w1e] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-c1lpx34w1e] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-c1lpx34w1e] { display: grid !important; }
    .crud-cards-wrapper[b-c1lpx34w1e] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-c1lpx34w1e] { grid-template-columns: 1fr; }
    .card-details[b-c1lpx34w1e] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-c1lpx34w1e] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-c1lpx34w1e] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-c1lpx34w1e] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-c1lpx34w1e] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmrepuestofacturacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ig3f2yn8qb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ig3f2yn8qb 0.3s ease-out; }
@keyframes slideUp-b-ig3f2yn8qb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ig3f2yn8qb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ig3f2yn8qb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ig3f2yn8qb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ig3f2yn8qb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ig3f2yn8qb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ig3f2yn8qb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ig3f2yn8qb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ig3f2yn8qb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ig3f2yn8qb] { filter: brightness(1.1); }
.btn-outline[b-ig3f2yn8qb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ig3f2yn8qb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ig3f2yn8qb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ig3f2yn8qb] { filter: brightness(1.1); }
.btn-icon[b-ig3f2yn8qb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ig3f2yn8qb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ig3f2yn8qb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ig3f2yn8qb] { color: #ef4444; }
.btn-delete:hover[b-ig3f2yn8qb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ig3f2yn8qb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ig3f2yn8qb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ig3f2yn8qb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ig3f2yn8qb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ig3f2yn8qb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ig3f2yn8qb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ig3f2yn8qb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ig3f2yn8qb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ig3f2yn8qb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ig3f2yn8qb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ig3f2yn8qb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ig3f2yn8qb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ig3f2yn8qb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ig3f2yn8qb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ig3f2yn8qb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ig3f2yn8qb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ig3f2yn8qb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ig3f2yn8qb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ig3f2yn8qb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ig3f2yn8qb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ig3f2yn8qb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ig3f2yn8qb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ig3f2yn8qb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ig3f2yn8qb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ig3f2yn8qb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ig3f2yn8qb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ig3f2yn8qb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ig3f2yn8qb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ig3f2yn8qb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ig3f2yn8qb] { display: block; }
.hide-on-cards[b-ig3f2yn8qb] { display: none !important; }
.show-on-cards[b-ig3f2yn8qb] { display: grid; }
.hide-on-grid[b-ig3f2yn8qb] { display: none !important; }

/* Badges */
.badge[b-ig3f2yn8qb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ig3f2yn8qb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ig3f2yn8qb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ig3f2yn8qb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ig3f2yn8qb] { text-align: center; }
.text-muted[b-ig3f2yn8qb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ig3f2yn8qb], .crud-empty-state[b-ig3f2yn8qb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ig3f2yn8qb] { font-size: 2rem; }
.crud-spinner[b-ig3f2yn8qb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ig3f2yn8qb 0.6s linear infinite; }
.crud-spinner-sm[b-ig3f2yn8qb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ig3f2yn8qb 0.6s linear infinite; }
@keyframes spin-b-ig3f2yn8qb { to { transform: rotate(360deg); } }
.spin[b-ig3f2yn8qb] { animation: spin-b-ig3f2yn8qb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ig3f2yn8qb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ig3f2yn8qb 0.15s ease-out; }
.modal-container[b-ig3f2yn8qb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ig3f2yn8qb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ig3f2yn8qb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ig3f2yn8qb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ig3f2yn8qb] { max-width: 420px; }
@keyframes fadeIn-b-ig3f2yn8qb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ig3f2yn8qb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ig3f2yn8qb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ig3f2yn8qb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ig3f2yn8qb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ig3f2yn8qb] { color: #dc2626; }
.modal-close[b-ig3f2yn8qb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ig3f2yn8qb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ig3f2yn8qb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ig3f2yn8qb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ig3f2yn8qb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ig3f2yn8qb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ig3f2yn8qb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ig3f2yn8qb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ig3f2yn8qb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ig3f2yn8qb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ig3f2yn8qb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ig3f2yn8qb] { flex: 2; }
.form-group label[b-ig3f2yn8qb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ig3f2yn8qb], .form-group select[b-ig3f2yn8qb], .form-textarea[b-ig3f2yn8qb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ig3f2yn8qb], .form-group select:focus[b-ig3f2yn8qb], .form-textarea:focus[b-ig3f2yn8qb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ig3f2yn8qb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ig3f2yn8qb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ig3f2yn8qb] { flex: 1; display: flex; align-items: center; }
.form-check[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ig3f2yn8qb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ig3f2yn8qb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ig3f2yn8qb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ig3f2yn8qb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ig3f2yn8qb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ig3f2yn8qb] { font-size: 3rem; }
.photo-placeholder span[b-ig3f2yn8qb] { font-size: 0.78rem; }
.photo-actions[b-ig3f2yn8qb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ig3f2yn8qb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ig3f2yn8qb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ig3f2yn8qb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ig3f2yn8qb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ig3f2yn8qb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ig3f2yn8qb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ig3f2yn8qb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ig3f2yn8qb] { filter: brightness(1.15); transform: scale(1.05); }
[b-ig3f2yn8qb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ig3f2yn8qb] { padding: 0.75rem; }
    .crud-header[b-ig3f2yn8qb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ig3f2yn8qb] { font-size: 1.1rem; }
    .btn-text[b-ig3f2yn8qb] { display: none; }
    .form-row[b-ig3f2yn8qb] { flex-direction: column; }
    .form-row-4[b-ig3f2yn8qb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ig3f2yn8qb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ig3f2yn8qb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ig3f2yn8qb] { padding: 0.75rem; }
    .modal-tabs[b-ig3f2yn8qb] { overflow-x: auto; }
    .modal-tab[b-ig3f2yn8qb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ig3f2yn8qb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ig3f2yn8qb] { display: grid !important; }
    .crud-cards-wrapper[b-ig3f2yn8qb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ig3f2yn8qb] { grid-template-columns: 1fr; }
    .card-details[b-ig3f2yn8qb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ig3f2yn8qb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ig3f2yn8qb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ig3f2yn8qb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ig3f2yn8qb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmrepuestofacturacionmostrador.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-024lararmx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-024lararmx 0.3s ease-out; }
@keyframes slideUp-b-024lararmx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-024lararmx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-024lararmx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-024lararmx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-024lararmx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-024lararmx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-024lararmx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-024lararmx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-024lararmx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-024lararmx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-024lararmx] { filter: brightness(1.1); }
.btn-outline[b-024lararmx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-024lararmx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-024lararmx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-024lararmx] { filter: brightness(1.1); }
.btn-icon[b-024lararmx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-024lararmx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-024lararmx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-024lararmx] { color: #ef4444; }
.btn-delete:hover[b-024lararmx] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-024lararmx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-024lararmx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-024lararmx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-024lararmx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-024lararmx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-024lararmx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-024lararmx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-024lararmx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-024lararmx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-024lararmx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-024lararmx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-024lararmx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-024lararmx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-024lararmx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-024lararmx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-024lararmx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-024lararmx] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-024lararmx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-024lararmx] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-024lararmx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-024lararmx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-024lararmx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-024lararmx] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-024lararmx] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-024lararmx] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-024lararmx] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-024lararmx] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-024lararmx] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-024lararmx] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-024lararmx] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-024lararmx] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-024lararmx] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-024lararmx] { display: block; }
.hide-on-cards[b-024lararmx] { display: none !important; }
.show-on-cards[b-024lararmx] { display: grid; }
.hide-on-grid[b-024lararmx] { display: none !important; }

/* Badges */
.badge[b-024lararmx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-024lararmx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-024lararmx] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-024lararmx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-024lararmx] { text-align: center; }
.text-muted[b-024lararmx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-024lararmx], .crud-empty-state[b-024lararmx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-024lararmx] { font-size: 2rem; }
.crud-spinner[b-024lararmx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-024lararmx 0.6s linear infinite; }
.crud-spinner-sm[b-024lararmx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-024lararmx 0.6s linear infinite; }
@keyframes spin-b-024lararmx { to { transform: rotate(360deg); } }
.spin[b-024lararmx] { animation: spin-b-024lararmx 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-024lararmx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-024lararmx 0.15s ease-out; }
.modal-container[b-024lararmx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-024lararmx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-024lararmx 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-024lararmx] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-024lararmx] { max-width: 420px; }
@keyframes fadeIn-b-024lararmx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-024lararmx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-024lararmx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-024lararmx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-024lararmx] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-024lararmx] { color: #dc2626; }
.modal-close[b-024lararmx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-024lararmx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-024lararmx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-024lararmx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-024lararmx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-024lararmx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-024lararmx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-024lararmx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-024lararmx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-024lararmx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-024lararmx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-024lararmx] { flex: 2; }
.form-group label[b-024lararmx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-024lararmx], .form-group select[b-024lararmx], .form-textarea[b-024lararmx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-024lararmx], .form-group select:focus[b-024lararmx], .form-textarea:focus[b-024lararmx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-024lararmx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-024lararmx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-024lararmx] { flex: 1; display: flex; align-items: center; }
.form-check[b-024lararmx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-024lararmx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-024lararmx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-024lararmx] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-024lararmx] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-024lararmx] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-024lararmx] { font-size: 3rem; }
.photo-placeholder span[b-024lararmx] { font-size: 0.78rem; }
.photo-actions[b-024lararmx] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-024lararmx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-024lararmx] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-024lararmx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-024lararmx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-024lararmx] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-024lararmx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-024lararmx] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-024lararmx] { filter: brightness(1.15); transform: scale(1.05); }
[b-024lararmx] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-024lararmx] { padding: 0.75rem; }
    .crud-header[b-024lararmx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-024lararmx] { font-size: 1.1rem; }
    .btn-text[b-024lararmx] { display: none; }
    .form-row[b-024lararmx] { flex-direction: column; }
    .form-row-4[b-024lararmx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-024lararmx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-024lararmx] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-024lararmx] { padding: 0.75rem; }
    .modal-tabs[b-024lararmx] { overflow-x: auto; }
    .modal-tab[b-024lararmx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-024lararmx] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-024lararmx] { display: grid !important; }
    .crud-cards-wrapper[b-024lararmx] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-024lararmx] { grid-template-columns: 1fr; }
    .card-details[b-024lararmx] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-024lararmx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-024lararmx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-024lararmx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-024lararmx] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmuberingresokilometraje.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rq3ezq6qgc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rq3ezq6qgc 0.3s ease-out; }
@keyframes slideUp-b-rq3ezq6qgc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rq3ezq6qgc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rq3ezq6qgc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rq3ezq6qgc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rq3ezq6qgc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rq3ezq6qgc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rq3ezq6qgc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rq3ezq6qgc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rq3ezq6qgc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rq3ezq6qgc] { filter: brightness(1.1); }
.btn-outline[b-rq3ezq6qgc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rq3ezq6qgc] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rq3ezq6qgc] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rq3ezq6qgc] { filter: brightness(1.1); }
.btn-icon[b-rq3ezq6qgc] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rq3ezq6qgc] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rq3ezq6qgc] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rq3ezq6qgc] { color: #ef4444; }
.btn-delete:hover[b-rq3ezq6qgc] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rq3ezq6qgc] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rq3ezq6qgc] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rq3ezq6qgc] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rq3ezq6qgc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rq3ezq6qgc] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rq3ezq6qgc] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rq3ezq6qgc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rq3ezq6qgc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rq3ezq6qgc] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rq3ezq6qgc] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rq3ezq6qgc] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rq3ezq6qgc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rq3ezq6qgc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rq3ezq6qgc] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rq3ezq6qgc] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rq3ezq6qgc] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rq3ezq6qgc] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rq3ezq6qgc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rq3ezq6qgc] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rq3ezq6qgc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rq3ezq6qgc] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rq3ezq6qgc] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rq3ezq6qgc] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rq3ezq6qgc] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rq3ezq6qgc] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rq3ezq6qgc] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rq3ezq6qgc] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rq3ezq6qgc] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rq3ezq6qgc] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rq3ezq6qgc] { display: block; }
.hide-on-cards[b-rq3ezq6qgc] { display: none !important; }
.show-on-cards[b-rq3ezq6qgc] { display: grid; }
.hide-on-grid[b-rq3ezq6qgc] { display: none !important; }

/* Badges */
.badge[b-rq3ezq6qgc] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rq3ezq6qgc] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rq3ezq6qgc] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rq3ezq6qgc] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rq3ezq6qgc] { text-align: center; }
.text-muted[b-rq3ezq6qgc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rq3ezq6qgc], .crud-empty-state[b-rq3ezq6qgc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rq3ezq6qgc] { font-size: 2rem; }
.crud-spinner[b-rq3ezq6qgc] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rq3ezq6qgc 0.6s linear infinite; }
.crud-spinner-sm[b-rq3ezq6qgc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rq3ezq6qgc 0.6s linear infinite; }
@keyframes spin-b-rq3ezq6qgc { to { transform: rotate(360deg); } }
.spin[b-rq3ezq6qgc] { animation: spin-b-rq3ezq6qgc 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rq3ezq6qgc] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rq3ezq6qgc 0.15s ease-out; }
.modal-container[b-rq3ezq6qgc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rq3ezq6qgc] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rq3ezq6qgc 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rq3ezq6qgc] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rq3ezq6qgc] { max-width: 420px; }
@keyframes fadeIn-b-rq3ezq6qgc { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rq3ezq6qgc { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rq3ezq6qgc] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rq3ezq6qgc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rq3ezq6qgc] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rq3ezq6qgc] { color: #dc2626; }
.modal-close[b-rq3ezq6qgc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rq3ezq6qgc] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rq3ezq6qgc] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rq3ezq6qgc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rq3ezq6qgc] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rq3ezq6qgc] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rq3ezq6qgc] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rq3ezq6qgc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rq3ezq6qgc] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rq3ezq6qgc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rq3ezq6qgc] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rq3ezq6qgc] { flex: 2; }
.form-group label[b-rq3ezq6qgc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rq3ezq6qgc], .form-group select[b-rq3ezq6qgc], .form-textarea[b-rq3ezq6qgc] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rq3ezq6qgc], .form-group select:focus[b-rq3ezq6qgc], .form-textarea:focus[b-rq3ezq6qgc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rq3ezq6qgc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rq3ezq6qgc] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rq3ezq6qgc] { flex: 1; display: flex; align-items: center; }
.form-check[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rq3ezq6qgc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rq3ezq6qgc] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rq3ezq6qgc] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rq3ezq6qgc] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rq3ezq6qgc] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rq3ezq6qgc] { font-size: 3rem; }
.photo-placeholder span[b-rq3ezq6qgc] { font-size: 0.78rem; }
.photo-actions[b-rq3ezq6qgc] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rq3ezq6qgc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rq3ezq6qgc] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rq3ezq6qgc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rq3ezq6qgc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rq3ezq6qgc] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rq3ezq6qgc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rq3ezq6qgc] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rq3ezq6qgc] { filter: brightness(1.15); transform: scale(1.05); }
[b-rq3ezq6qgc] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rq3ezq6qgc] { padding: 0.75rem; }
    .crud-header[b-rq3ezq6qgc] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rq3ezq6qgc] { font-size: 1.1rem; }
    .btn-text[b-rq3ezq6qgc] { display: none; }
    .form-row[b-rq3ezq6qgc] { flex-direction: column; }
    .form-row-4[b-rq3ezq6qgc] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rq3ezq6qgc] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rq3ezq6qgc] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rq3ezq6qgc] { padding: 0.75rem; }
    .modal-tabs[b-rq3ezq6qgc] { overflow-x: auto; }
    .modal-tab[b-rq3ezq6qgc] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rq3ezq6qgc] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rq3ezq6qgc] { display: grid !important; }
    .crud-cards-wrapper[b-rq3ezq6qgc] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rq3ezq6qgc] { grid-template-columns: 1fr; }
    .card-details[b-rq3ezq6qgc] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rq3ezq6qgc] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rq3ezq6qgc] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rq3ezq6qgc] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rq3ezq6qgc] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmuberliberacionvehiculos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lc2qenyozt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lc2qenyozt 0.3s ease-out; }
@keyframes slideUp-b-lc2qenyozt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lc2qenyozt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lc2qenyozt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lc2qenyozt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lc2qenyozt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lc2qenyozt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lc2qenyozt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lc2qenyozt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lc2qenyozt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lc2qenyozt] { filter: brightness(1.1); }
.btn-outline[b-lc2qenyozt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lc2qenyozt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lc2qenyozt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lc2qenyozt] { filter: brightness(1.1); }
.btn-icon[b-lc2qenyozt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lc2qenyozt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lc2qenyozt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lc2qenyozt] { color: #ef4444; }
.btn-delete:hover[b-lc2qenyozt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lc2qenyozt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lc2qenyozt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lc2qenyozt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lc2qenyozt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lc2qenyozt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lc2qenyozt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lc2qenyozt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lc2qenyozt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lc2qenyozt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lc2qenyozt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lc2qenyozt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lc2qenyozt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lc2qenyozt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lc2qenyozt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lc2qenyozt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lc2qenyozt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lc2qenyozt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lc2qenyozt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lc2qenyozt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lc2qenyozt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lc2qenyozt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lc2qenyozt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lc2qenyozt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lc2qenyozt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lc2qenyozt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lc2qenyozt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lc2qenyozt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lc2qenyozt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lc2qenyozt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lc2qenyozt] { display: block; }
.hide-on-cards[b-lc2qenyozt] { display: none !important; }
.show-on-cards[b-lc2qenyozt] { display: grid; }
.hide-on-grid[b-lc2qenyozt] { display: none !important; }

/* Badges */
.badge[b-lc2qenyozt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lc2qenyozt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lc2qenyozt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lc2qenyozt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lc2qenyozt] { text-align: center; }
.text-muted[b-lc2qenyozt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lc2qenyozt], .crud-empty-state[b-lc2qenyozt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lc2qenyozt] { font-size: 2rem; }
.crud-spinner[b-lc2qenyozt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lc2qenyozt 0.6s linear infinite; }
.crud-spinner-sm[b-lc2qenyozt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lc2qenyozt 0.6s linear infinite; }
@keyframes spin-b-lc2qenyozt { to { transform: rotate(360deg); } }
.spin[b-lc2qenyozt] { animation: spin-b-lc2qenyozt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lc2qenyozt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lc2qenyozt 0.15s ease-out; }
.modal-container[b-lc2qenyozt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lc2qenyozt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lc2qenyozt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lc2qenyozt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lc2qenyozt] { max-width: 420px; }
@keyframes fadeIn-b-lc2qenyozt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lc2qenyozt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lc2qenyozt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lc2qenyozt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lc2qenyozt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lc2qenyozt] { color: #dc2626; }
.modal-close[b-lc2qenyozt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lc2qenyozt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lc2qenyozt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lc2qenyozt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lc2qenyozt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lc2qenyozt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lc2qenyozt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lc2qenyozt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lc2qenyozt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lc2qenyozt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lc2qenyozt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lc2qenyozt] { flex: 2; }
.form-group label[b-lc2qenyozt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lc2qenyozt], .form-group select[b-lc2qenyozt], .form-textarea[b-lc2qenyozt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lc2qenyozt], .form-group select:focus[b-lc2qenyozt], .form-textarea:focus[b-lc2qenyozt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lc2qenyozt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lc2qenyozt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lc2qenyozt] { flex: 1; display: flex; align-items: center; }
.form-check[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lc2qenyozt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lc2qenyozt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lc2qenyozt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lc2qenyozt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lc2qenyozt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lc2qenyozt] { font-size: 3rem; }
.photo-placeholder span[b-lc2qenyozt] { font-size: 0.78rem; }
.photo-actions[b-lc2qenyozt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lc2qenyozt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lc2qenyozt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lc2qenyozt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lc2qenyozt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lc2qenyozt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lc2qenyozt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lc2qenyozt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lc2qenyozt] { filter: brightness(1.15); transform: scale(1.05); }
[b-lc2qenyozt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lc2qenyozt] { padding: 0.75rem; }
    .crud-header[b-lc2qenyozt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lc2qenyozt] { font-size: 1.1rem; }
    .btn-text[b-lc2qenyozt] { display: none; }
    .form-row[b-lc2qenyozt] { flex-direction: column; }
    .form-row-4[b-lc2qenyozt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lc2qenyozt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lc2qenyozt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lc2qenyozt] { padding: 0.75rem; }
    .modal-tabs[b-lc2qenyozt] { overflow-x: auto; }
    .modal-tab[b-lc2qenyozt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lc2qenyozt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lc2qenyozt] { display: grid !important; }
    .crud-cards-wrapper[b-lc2qenyozt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lc2qenyozt] { grid-template-columns: 1fr; }
    .card-details[b-lc2qenyozt] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lc2qenyozt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lc2qenyozt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lc2qenyozt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lc2qenyozt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmuberliberacionvehiculosempresa.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-y3mlp6vqmu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-y3mlp6vqmu 0.3s ease-out; }
@keyframes slideUp-b-y3mlp6vqmu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-y3mlp6vqmu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-y3mlp6vqmu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-y3mlp6vqmu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-y3mlp6vqmu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-y3mlp6vqmu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-y3mlp6vqmu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-y3mlp6vqmu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-y3mlp6vqmu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-y3mlp6vqmu] { filter: brightness(1.1); }
.btn-outline[b-y3mlp6vqmu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-y3mlp6vqmu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-y3mlp6vqmu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-y3mlp6vqmu] { filter: brightness(1.1); }
.btn-icon[b-y3mlp6vqmu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-y3mlp6vqmu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-y3mlp6vqmu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-y3mlp6vqmu] { color: #ef4444; }
.btn-delete:hover[b-y3mlp6vqmu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-y3mlp6vqmu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-y3mlp6vqmu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-y3mlp6vqmu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-y3mlp6vqmu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-y3mlp6vqmu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-y3mlp6vqmu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-y3mlp6vqmu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-y3mlp6vqmu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-y3mlp6vqmu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-y3mlp6vqmu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-y3mlp6vqmu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-y3mlp6vqmu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-y3mlp6vqmu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-y3mlp6vqmu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-y3mlp6vqmu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-y3mlp6vqmu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-y3mlp6vqmu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-y3mlp6vqmu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-y3mlp6vqmu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-y3mlp6vqmu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-y3mlp6vqmu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-y3mlp6vqmu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-y3mlp6vqmu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-y3mlp6vqmu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-y3mlp6vqmu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-y3mlp6vqmu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-y3mlp6vqmu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-y3mlp6vqmu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-y3mlp6vqmu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-y3mlp6vqmu] { display: block; }
.hide-on-cards[b-y3mlp6vqmu] { display: none !important; }
.show-on-cards[b-y3mlp6vqmu] { display: grid; }
.hide-on-grid[b-y3mlp6vqmu] { display: none !important; }

/* Badges */
.badge[b-y3mlp6vqmu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-y3mlp6vqmu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-y3mlp6vqmu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-y3mlp6vqmu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-y3mlp6vqmu] { text-align: center; }
.text-muted[b-y3mlp6vqmu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-y3mlp6vqmu], .crud-empty-state[b-y3mlp6vqmu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-y3mlp6vqmu] { font-size: 2rem; }
.crud-spinner[b-y3mlp6vqmu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-y3mlp6vqmu 0.6s linear infinite; }
.crud-spinner-sm[b-y3mlp6vqmu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-y3mlp6vqmu 0.6s linear infinite; }
@keyframes spin-b-y3mlp6vqmu { to { transform: rotate(360deg); } }
.spin[b-y3mlp6vqmu] { animation: spin-b-y3mlp6vqmu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-y3mlp6vqmu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-y3mlp6vqmu 0.15s ease-out; }
.modal-container[b-y3mlp6vqmu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-y3mlp6vqmu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-y3mlp6vqmu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-y3mlp6vqmu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-y3mlp6vqmu] { max-width: 420px; }
@keyframes fadeIn-b-y3mlp6vqmu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-y3mlp6vqmu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-y3mlp6vqmu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-y3mlp6vqmu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-y3mlp6vqmu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-y3mlp6vqmu] { color: #dc2626; }
.modal-close[b-y3mlp6vqmu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-y3mlp6vqmu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-y3mlp6vqmu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-y3mlp6vqmu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-y3mlp6vqmu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-y3mlp6vqmu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-y3mlp6vqmu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-y3mlp6vqmu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-y3mlp6vqmu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-y3mlp6vqmu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-y3mlp6vqmu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-y3mlp6vqmu] { flex: 2; }
.form-group label[b-y3mlp6vqmu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-y3mlp6vqmu], .form-group select[b-y3mlp6vqmu], .form-textarea[b-y3mlp6vqmu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-y3mlp6vqmu], .form-group select:focus[b-y3mlp6vqmu], .form-textarea:focus[b-y3mlp6vqmu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-y3mlp6vqmu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-y3mlp6vqmu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-y3mlp6vqmu] { flex: 1; display: flex; align-items: center; }
.form-check[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-y3mlp6vqmu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-y3mlp6vqmu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-y3mlp6vqmu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-y3mlp6vqmu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-y3mlp6vqmu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-y3mlp6vqmu] { font-size: 3rem; }
.photo-placeholder span[b-y3mlp6vqmu] { font-size: 0.78rem; }
.photo-actions[b-y3mlp6vqmu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-y3mlp6vqmu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-y3mlp6vqmu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-y3mlp6vqmu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-y3mlp6vqmu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-y3mlp6vqmu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-y3mlp6vqmu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-y3mlp6vqmu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-y3mlp6vqmu] { filter: brightness(1.15); transform: scale(1.05); }
[b-y3mlp6vqmu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-y3mlp6vqmu] { padding: 0.75rem; }
    .crud-header[b-y3mlp6vqmu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-y3mlp6vqmu] { font-size: 1.1rem; }
    .btn-text[b-y3mlp6vqmu] { display: none; }
    .form-row[b-y3mlp6vqmu] { flex-direction: column; }
    .form-row-4[b-y3mlp6vqmu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-y3mlp6vqmu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-y3mlp6vqmu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-y3mlp6vqmu] { padding: 0.75rem; }
    .modal-tabs[b-y3mlp6vqmu] { overflow-x: auto; }
    .modal-tab[b-y3mlp6vqmu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-y3mlp6vqmu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-y3mlp6vqmu] { display: grid !important; }
    .crud-cards-wrapper[b-y3mlp6vqmu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-y3mlp6vqmu] { grid-template-columns: 1fr; }
    .card-details[b-y3mlp6vqmu] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-y3mlp6vqmu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-y3mlp6vqmu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-y3mlp6vqmu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-y3mlp6vqmu] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmubermarcavehiculosymodelo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8v6vdn7enp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8v6vdn7enp 0.3s ease-out; }
@keyframes slideUp-b-8v6vdn7enp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8v6vdn7enp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8v6vdn7enp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8v6vdn7enp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8v6vdn7enp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8v6vdn7enp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8v6vdn7enp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8v6vdn7enp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8v6vdn7enp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8v6vdn7enp] { filter: brightness(1.1); }
.btn-outline[b-8v6vdn7enp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8v6vdn7enp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8v6vdn7enp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8v6vdn7enp] { filter: brightness(1.1); }
.btn-icon[b-8v6vdn7enp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8v6vdn7enp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8v6vdn7enp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8v6vdn7enp] { color: #ef4444; }
.btn-delete:hover[b-8v6vdn7enp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8v6vdn7enp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8v6vdn7enp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8v6vdn7enp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8v6vdn7enp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8v6vdn7enp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8v6vdn7enp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8v6vdn7enp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8v6vdn7enp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8v6vdn7enp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8v6vdn7enp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8v6vdn7enp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8v6vdn7enp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8v6vdn7enp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8v6vdn7enp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8v6vdn7enp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8v6vdn7enp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8v6vdn7enp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8v6vdn7enp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8v6vdn7enp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8v6vdn7enp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8v6vdn7enp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8v6vdn7enp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8v6vdn7enp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8v6vdn7enp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8v6vdn7enp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8v6vdn7enp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8v6vdn7enp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8v6vdn7enp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8v6vdn7enp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8v6vdn7enp] { display: block; }
.hide-on-cards[b-8v6vdn7enp] { display: none !important; }
.show-on-cards[b-8v6vdn7enp] { display: grid; }
.hide-on-grid[b-8v6vdn7enp] { display: none !important; }

/* Badges */
.badge[b-8v6vdn7enp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8v6vdn7enp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8v6vdn7enp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8v6vdn7enp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8v6vdn7enp] { text-align: center; }
.text-muted[b-8v6vdn7enp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8v6vdn7enp], .crud-empty-state[b-8v6vdn7enp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8v6vdn7enp] { font-size: 2rem; }
.crud-spinner[b-8v6vdn7enp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8v6vdn7enp 0.6s linear infinite; }
.crud-spinner-sm[b-8v6vdn7enp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8v6vdn7enp 0.6s linear infinite; }
@keyframes spin-b-8v6vdn7enp { to { transform: rotate(360deg); } }
.spin[b-8v6vdn7enp] { animation: spin-b-8v6vdn7enp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8v6vdn7enp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8v6vdn7enp 0.15s ease-out; }
.modal-container[b-8v6vdn7enp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8v6vdn7enp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8v6vdn7enp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8v6vdn7enp] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8v6vdn7enp] { max-width: 420px; }
@keyframes fadeIn-b-8v6vdn7enp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8v6vdn7enp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8v6vdn7enp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8v6vdn7enp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8v6vdn7enp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8v6vdn7enp] { color: #dc2626; }
.modal-close[b-8v6vdn7enp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8v6vdn7enp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8v6vdn7enp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8v6vdn7enp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8v6vdn7enp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8v6vdn7enp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8v6vdn7enp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8v6vdn7enp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8v6vdn7enp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8v6vdn7enp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8v6vdn7enp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8v6vdn7enp] { flex: 2; }
.form-group label[b-8v6vdn7enp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8v6vdn7enp], .form-group select[b-8v6vdn7enp], .form-textarea[b-8v6vdn7enp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8v6vdn7enp], .form-group select:focus[b-8v6vdn7enp], .form-textarea:focus[b-8v6vdn7enp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8v6vdn7enp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8v6vdn7enp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8v6vdn7enp] { flex: 1; display: flex; align-items: center; }
.form-check[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8v6vdn7enp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8v6vdn7enp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8v6vdn7enp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8v6vdn7enp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8v6vdn7enp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8v6vdn7enp] { font-size: 3rem; }
.photo-placeholder span[b-8v6vdn7enp] { font-size: 0.78rem; }
.photo-actions[b-8v6vdn7enp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8v6vdn7enp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8v6vdn7enp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8v6vdn7enp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8v6vdn7enp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8v6vdn7enp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8v6vdn7enp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8v6vdn7enp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8v6vdn7enp] { filter: brightness(1.15); transform: scale(1.05); }
[b-8v6vdn7enp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8v6vdn7enp] { padding: 0.75rem; }
    .crud-header[b-8v6vdn7enp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8v6vdn7enp] { font-size: 1.1rem; }
    .btn-text[b-8v6vdn7enp] { display: none; }
    .form-row[b-8v6vdn7enp] { flex-direction: column; }
    .form-row-4[b-8v6vdn7enp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8v6vdn7enp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8v6vdn7enp] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8v6vdn7enp] { padding: 0.75rem; }
    .modal-tabs[b-8v6vdn7enp] { overflow-x: auto; }
    .modal-tab[b-8v6vdn7enp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8v6vdn7enp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8v6vdn7enp] { display: grid !important; }
    .crud-cards-wrapper[b-8v6vdn7enp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8v6vdn7enp] { grid-template-columns: 1fr; }
    .card-details[b-8v6vdn7enp] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8v6vdn7enp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8v6vdn7enp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8v6vdn7enp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8v6vdn7enp] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmuberplantillacobrogoogle.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-iph7ivse5w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-iph7ivse5w 0.3s ease-out; }
@keyframes slideUp-b-iph7ivse5w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-iph7ivse5w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-iph7ivse5w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-iph7ivse5w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-iph7ivse5w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-iph7ivse5w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-iph7ivse5w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-iph7ivse5w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-iph7ivse5w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-iph7ivse5w] { filter: brightness(1.1); }
.btn-outline[b-iph7ivse5w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-iph7ivse5w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-iph7ivse5w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-iph7ivse5w] { filter: brightness(1.1); }
.btn-icon[b-iph7ivse5w] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-iph7ivse5w] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-iph7ivse5w] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-iph7ivse5w] { color: #ef4444; }
.btn-delete:hover[b-iph7ivse5w] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-iph7ivse5w] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-iph7ivse5w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-iph7ivse5w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-iph7ivse5w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-iph7ivse5w] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-iph7ivse5w] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-iph7ivse5w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-iph7ivse5w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-iph7ivse5w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-iph7ivse5w] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-iph7ivse5w] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-iph7ivse5w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-iph7ivse5w] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-iph7ivse5w] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-iph7ivse5w] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-iph7ivse5w] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-iph7ivse5w] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-iph7ivse5w] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-iph7ivse5w] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-iph7ivse5w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-iph7ivse5w] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-iph7ivse5w] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-iph7ivse5w] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-iph7ivse5w] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-iph7ivse5w] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-iph7ivse5w] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-iph7ivse5w] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-iph7ivse5w] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-iph7ivse5w] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-iph7ivse5w] { display: block; }
.hide-on-cards[b-iph7ivse5w] { display: none !important; }
.show-on-cards[b-iph7ivse5w] { display: grid; }
.hide-on-grid[b-iph7ivse5w] { display: none !important; }

/* Badges */
.badge[b-iph7ivse5w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-iph7ivse5w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-iph7ivse5w] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-iph7ivse5w] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-iph7ivse5w] { text-align: center; }
.text-muted[b-iph7ivse5w] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-iph7ivse5w], .crud-empty-state[b-iph7ivse5w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-iph7ivse5w] { font-size: 2rem; }
.crud-spinner[b-iph7ivse5w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-iph7ivse5w 0.6s linear infinite; }
.crud-spinner-sm[b-iph7ivse5w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-iph7ivse5w 0.6s linear infinite; }
@keyframes spin-b-iph7ivse5w { to { transform: rotate(360deg); } }
.spin[b-iph7ivse5w] { animation: spin-b-iph7ivse5w 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-iph7ivse5w] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-iph7ivse5w 0.15s ease-out; }
.modal-container[b-iph7ivse5w] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-iph7ivse5w] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-iph7ivse5w 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-iph7ivse5w] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-iph7ivse5w] { max-width: 420px; }
@keyframes fadeIn-b-iph7ivse5w { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-iph7ivse5w { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-iph7ivse5w] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-iph7ivse5w] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-iph7ivse5w] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-iph7ivse5w] { color: #dc2626; }
.modal-close[b-iph7ivse5w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-iph7ivse5w] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-iph7ivse5w] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-iph7ivse5w] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-iph7ivse5w] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-iph7ivse5w] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-iph7ivse5w] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-iph7ivse5w] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-iph7ivse5w] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-iph7ivse5w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-iph7ivse5w] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-iph7ivse5w] { flex: 2; }
.form-group label[b-iph7ivse5w] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-iph7ivse5w], .form-group select[b-iph7ivse5w], .form-textarea[b-iph7ivse5w] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-iph7ivse5w], .form-group select:focus[b-iph7ivse5w], .form-textarea:focus[b-iph7ivse5w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-iph7ivse5w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-iph7ivse5w] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-iph7ivse5w] { flex: 1; display: flex; align-items: center; }
.form-check[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-iph7ivse5w] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-iph7ivse5w] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-iph7ivse5w] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-iph7ivse5w] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-iph7ivse5w] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-iph7ivse5w] { font-size: 3rem; }
.photo-placeholder span[b-iph7ivse5w] { font-size: 0.78rem; }
.photo-actions[b-iph7ivse5w] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-iph7ivse5w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-iph7ivse5w] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-iph7ivse5w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-iph7ivse5w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-iph7ivse5w] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-iph7ivse5w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-iph7ivse5w] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-iph7ivse5w] { filter: brightness(1.15); transform: scale(1.05); }
[b-iph7ivse5w] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-iph7ivse5w] { padding: 0.75rem; }
    .crud-header[b-iph7ivse5w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-iph7ivse5w] { font-size: 1.1rem; }
    .btn-text[b-iph7ivse5w] { display: none; }
    .form-row[b-iph7ivse5w] { flex-direction: column; }
    .form-row-4[b-iph7ivse5w] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-iph7ivse5w] { width: 98%; max-height: 95vh; }
    .modal-lg[b-iph7ivse5w] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-iph7ivse5w] { padding: 0.75rem; }
    .modal-tabs[b-iph7ivse5w] { overflow-x: auto; }
    .modal-tab[b-iph7ivse5w] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-iph7ivse5w] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-iph7ivse5w] { display: grid !important; }
    .crud-cards-wrapper[b-iph7ivse5w] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-iph7ivse5w] { grid-template-columns: 1fr; }
    .card-details[b-iph7ivse5w] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-iph7ivse5w] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-iph7ivse5w] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-iph7ivse5w] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-iph7ivse5w] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmuberretructuracuotas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6k3bnnw55g] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6k3bnnw55g 0.3s ease-out; }
@keyframes slideUp-b-6k3bnnw55g { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6k3bnnw55g] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6k3bnnw55g] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6k3bnnw55g] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6k3bnnw55g] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6k3bnnw55g] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6k3bnnw55g] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6k3bnnw55g] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6k3bnnw55g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6k3bnnw55g] { filter: brightness(1.1); }
.btn-outline[b-6k3bnnw55g] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6k3bnnw55g] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6k3bnnw55g] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6k3bnnw55g] { filter: brightness(1.1); }
.btn-icon[b-6k3bnnw55g] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6k3bnnw55g] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6k3bnnw55g] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6k3bnnw55g] { color: #ef4444; }
.btn-delete:hover[b-6k3bnnw55g] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6k3bnnw55g] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6k3bnnw55g] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6k3bnnw55g] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6k3bnnw55g] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6k3bnnw55g] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6k3bnnw55g] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6k3bnnw55g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6k3bnnw55g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6k3bnnw55g] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6k3bnnw55g] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6k3bnnw55g] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6k3bnnw55g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6k3bnnw55g] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6k3bnnw55g] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6k3bnnw55g] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6k3bnnw55g] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6k3bnnw55g] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6k3bnnw55g] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6k3bnnw55g] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6k3bnnw55g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6k3bnnw55g] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6k3bnnw55g] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6k3bnnw55g] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6k3bnnw55g] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6k3bnnw55g] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6k3bnnw55g] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6k3bnnw55g] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6k3bnnw55g] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6k3bnnw55g] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6k3bnnw55g] { display: block; }
.hide-on-cards[b-6k3bnnw55g] { display: none !important; }
.show-on-cards[b-6k3bnnw55g] { display: grid; }
.hide-on-grid[b-6k3bnnw55g] { display: none !important; }

/* Badges */
.badge[b-6k3bnnw55g] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6k3bnnw55g] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6k3bnnw55g] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6k3bnnw55g] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6k3bnnw55g] { text-align: center; }
.text-muted[b-6k3bnnw55g] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6k3bnnw55g], .crud-empty-state[b-6k3bnnw55g] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6k3bnnw55g] { font-size: 2rem; }
.crud-spinner[b-6k3bnnw55g] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6k3bnnw55g 0.6s linear infinite; }
.crud-spinner-sm[b-6k3bnnw55g] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6k3bnnw55g 0.6s linear infinite; }
@keyframes spin-b-6k3bnnw55g { to { transform: rotate(360deg); } }
.spin[b-6k3bnnw55g] { animation: spin-b-6k3bnnw55g 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6k3bnnw55g] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6k3bnnw55g 0.15s ease-out; }
.modal-container[b-6k3bnnw55g] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6k3bnnw55g] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6k3bnnw55g 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6k3bnnw55g] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6k3bnnw55g] { max-width: 420px; }
@keyframes fadeIn-b-6k3bnnw55g { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6k3bnnw55g { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6k3bnnw55g] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6k3bnnw55g] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6k3bnnw55g] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6k3bnnw55g] { color: #dc2626; }
.modal-close[b-6k3bnnw55g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6k3bnnw55g] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6k3bnnw55g] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6k3bnnw55g] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6k3bnnw55g] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6k3bnnw55g] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6k3bnnw55g] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6k3bnnw55g] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6k3bnnw55g] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6k3bnnw55g] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6k3bnnw55g] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6k3bnnw55g] { flex: 2; }
.form-group label[b-6k3bnnw55g] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6k3bnnw55g], .form-group select[b-6k3bnnw55g], .form-textarea[b-6k3bnnw55g] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6k3bnnw55g], .form-group select:focus[b-6k3bnnw55g], .form-textarea:focus[b-6k3bnnw55g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6k3bnnw55g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6k3bnnw55g] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6k3bnnw55g] { flex: 1; display: flex; align-items: center; }
.form-check[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6k3bnnw55g] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6k3bnnw55g] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6k3bnnw55g] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6k3bnnw55g] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6k3bnnw55g] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6k3bnnw55g] { font-size: 3rem; }
.photo-placeholder span[b-6k3bnnw55g] { font-size: 0.78rem; }
.photo-actions[b-6k3bnnw55g] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6k3bnnw55g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6k3bnnw55g] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6k3bnnw55g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6k3bnnw55g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6k3bnnw55g] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6k3bnnw55g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6k3bnnw55g] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6k3bnnw55g] { filter: brightness(1.15); transform: scale(1.05); }
[b-6k3bnnw55g] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6k3bnnw55g] { padding: 0.75rem; }
    .crud-header[b-6k3bnnw55g] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6k3bnnw55g] { font-size: 1.1rem; }
    .btn-text[b-6k3bnnw55g] { display: none; }
    .form-row[b-6k3bnnw55g] { flex-direction: column; }
    .form-row-4[b-6k3bnnw55g] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6k3bnnw55g] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6k3bnnw55g] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6k3bnnw55g] { padding: 0.75rem; }
    .modal-tabs[b-6k3bnnw55g] { overflow-x: auto; }
    .modal-tab[b-6k3bnnw55g] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6k3bnnw55g] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6k3bnnw55g] { display: grid !important; }
    .crud-cards-wrapper[b-6k3bnnw55g] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6k3bnnw55g] { grid-template-columns: 1fr; }
    .card-details[b-6k3bnnw55g] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6k3bnnw55g] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6k3bnnw55g] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6k3bnnw55g] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6k3bnnw55g] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmubervehiculos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-uomwecbcl5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-uomwecbcl5 0.3s ease-out; }
@keyframes slideUp-b-uomwecbcl5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-uomwecbcl5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-uomwecbcl5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-uomwecbcl5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-uomwecbcl5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-uomwecbcl5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-uomwecbcl5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-uomwecbcl5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-uomwecbcl5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-uomwecbcl5] { filter: brightness(1.1); }
.btn-outline[b-uomwecbcl5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-uomwecbcl5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-uomwecbcl5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-uomwecbcl5] { filter: brightness(1.1); }
.btn-icon[b-uomwecbcl5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-uomwecbcl5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-uomwecbcl5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-uomwecbcl5] { color: #ef4444; }
.btn-delete:hover[b-uomwecbcl5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-uomwecbcl5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-uomwecbcl5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-uomwecbcl5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-uomwecbcl5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-uomwecbcl5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-uomwecbcl5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-uomwecbcl5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-uomwecbcl5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-uomwecbcl5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-uomwecbcl5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-uomwecbcl5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-uomwecbcl5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-uomwecbcl5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-uomwecbcl5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-uomwecbcl5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-uomwecbcl5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-uomwecbcl5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-uomwecbcl5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-uomwecbcl5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-uomwecbcl5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-uomwecbcl5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-uomwecbcl5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-uomwecbcl5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-uomwecbcl5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-uomwecbcl5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-uomwecbcl5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-uomwecbcl5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-uomwecbcl5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-uomwecbcl5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-uomwecbcl5] { display: block; }
.hide-on-cards[b-uomwecbcl5] { display: none !important; }
.show-on-cards[b-uomwecbcl5] { display: grid; }
.hide-on-grid[b-uomwecbcl5] { display: none !important; }

/* Badges */
.badge[b-uomwecbcl5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-uomwecbcl5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-uomwecbcl5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-uomwecbcl5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-uomwecbcl5] { text-align: center; }
.text-muted[b-uomwecbcl5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-uomwecbcl5], .crud-empty-state[b-uomwecbcl5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-uomwecbcl5] { font-size: 2rem; }
.crud-spinner[b-uomwecbcl5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-uomwecbcl5 0.6s linear infinite; }
.crud-spinner-sm[b-uomwecbcl5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-uomwecbcl5 0.6s linear infinite; }
@keyframes spin-b-uomwecbcl5 { to { transform: rotate(360deg); } }
.spin[b-uomwecbcl5] { animation: spin-b-uomwecbcl5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-uomwecbcl5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-uomwecbcl5 0.15s ease-out; }
.modal-container[b-uomwecbcl5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-uomwecbcl5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-uomwecbcl5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-uomwecbcl5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-uomwecbcl5] { max-width: 420px; }
@keyframes fadeIn-b-uomwecbcl5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-uomwecbcl5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-uomwecbcl5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-uomwecbcl5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-uomwecbcl5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-uomwecbcl5] { color: #dc2626; }
.modal-close[b-uomwecbcl5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-uomwecbcl5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-uomwecbcl5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-uomwecbcl5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-uomwecbcl5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-uomwecbcl5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-uomwecbcl5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-uomwecbcl5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-uomwecbcl5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-uomwecbcl5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-uomwecbcl5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-uomwecbcl5] { flex: 2; }
.form-group label[b-uomwecbcl5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-uomwecbcl5], .form-group select[b-uomwecbcl5], .form-textarea[b-uomwecbcl5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-uomwecbcl5], .form-group select:focus[b-uomwecbcl5], .form-textarea:focus[b-uomwecbcl5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-uomwecbcl5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-uomwecbcl5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-uomwecbcl5] { flex: 1; display: flex; align-items: center; }
.form-check[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-uomwecbcl5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-uomwecbcl5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-uomwecbcl5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-uomwecbcl5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-uomwecbcl5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-uomwecbcl5] { font-size: 3rem; }
.photo-placeholder span[b-uomwecbcl5] { font-size: 0.78rem; }
.photo-actions[b-uomwecbcl5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-uomwecbcl5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-uomwecbcl5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-uomwecbcl5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-uomwecbcl5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-uomwecbcl5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-uomwecbcl5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-uomwecbcl5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-uomwecbcl5] { filter: brightness(1.15); transform: scale(1.05); }
[b-uomwecbcl5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-uomwecbcl5] { padding: 0.75rem; }
    .crud-header[b-uomwecbcl5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-uomwecbcl5] { font-size: 1.1rem; }
    .btn-text[b-uomwecbcl5] { display: none; }
    .form-row[b-uomwecbcl5] { flex-direction: column; }
    .form-row-4[b-uomwecbcl5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-uomwecbcl5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-uomwecbcl5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-uomwecbcl5] { padding: 0.75rem; }
    .modal-tabs[b-uomwecbcl5] { overflow-x: auto; }
    .modal-tab[b-uomwecbcl5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-uomwecbcl5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-uomwecbcl5] { display: grid !important; }
    .crud-cards-wrapper[b-uomwecbcl5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-uomwecbcl5] { grid-template-columns: 1fr; }
    .card-details[b-uomwecbcl5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-uomwecbcl5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-uomwecbcl5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-uomwecbcl5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-uomwecbcl5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmubervehiculosasignados.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zu0qw1rmix] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zu0qw1rmix 0.3s ease-out; }
@keyframes slideUp-b-zu0qw1rmix { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zu0qw1rmix] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zu0qw1rmix] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zu0qw1rmix] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zu0qw1rmix] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zu0qw1rmix] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zu0qw1rmix] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zu0qw1rmix] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zu0qw1rmix] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zu0qw1rmix] { filter: brightness(1.1); }
.btn-outline[b-zu0qw1rmix] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zu0qw1rmix] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zu0qw1rmix] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zu0qw1rmix] { filter: brightness(1.1); }
.btn-icon[b-zu0qw1rmix] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zu0qw1rmix] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zu0qw1rmix] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zu0qw1rmix] { color: #ef4444; }
.btn-delete:hover[b-zu0qw1rmix] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zu0qw1rmix] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zu0qw1rmix] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zu0qw1rmix] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zu0qw1rmix] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zu0qw1rmix] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zu0qw1rmix] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zu0qw1rmix] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zu0qw1rmix] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zu0qw1rmix] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zu0qw1rmix] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zu0qw1rmix] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zu0qw1rmix] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zu0qw1rmix] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zu0qw1rmix] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zu0qw1rmix] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zu0qw1rmix] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zu0qw1rmix] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zu0qw1rmix] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zu0qw1rmix] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zu0qw1rmix] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zu0qw1rmix] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zu0qw1rmix] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zu0qw1rmix] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zu0qw1rmix] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zu0qw1rmix] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zu0qw1rmix] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zu0qw1rmix] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zu0qw1rmix] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zu0qw1rmix] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zu0qw1rmix] { display: block; }
.hide-on-cards[b-zu0qw1rmix] { display: none !important; }
.show-on-cards[b-zu0qw1rmix] { display: grid; }
.hide-on-grid[b-zu0qw1rmix] { display: none !important; }

/* Badges */
.badge[b-zu0qw1rmix] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zu0qw1rmix] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zu0qw1rmix] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zu0qw1rmix] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zu0qw1rmix] { text-align: center; }
.text-muted[b-zu0qw1rmix] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zu0qw1rmix], .crud-empty-state[b-zu0qw1rmix] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zu0qw1rmix] { font-size: 2rem; }
.crud-spinner[b-zu0qw1rmix] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zu0qw1rmix 0.6s linear infinite; }
.crud-spinner-sm[b-zu0qw1rmix] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zu0qw1rmix 0.6s linear infinite; }
@keyframes spin-b-zu0qw1rmix { to { transform: rotate(360deg); } }
.spin[b-zu0qw1rmix] { animation: spin-b-zu0qw1rmix 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zu0qw1rmix] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zu0qw1rmix 0.15s ease-out; }
.modal-container[b-zu0qw1rmix] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zu0qw1rmix] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zu0qw1rmix 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zu0qw1rmix] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zu0qw1rmix] { max-width: 420px; }
@keyframes fadeIn-b-zu0qw1rmix { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zu0qw1rmix { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zu0qw1rmix] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zu0qw1rmix] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zu0qw1rmix] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zu0qw1rmix] { color: #dc2626; }
.modal-close[b-zu0qw1rmix] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zu0qw1rmix] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zu0qw1rmix] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zu0qw1rmix] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zu0qw1rmix] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zu0qw1rmix] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zu0qw1rmix] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zu0qw1rmix] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zu0qw1rmix] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zu0qw1rmix] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zu0qw1rmix] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zu0qw1rmix] { flex: 2; }
.form-group label[b-zu0qw1rmix] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zu0qw1rmix], .form-group select[b-zu0qw1rmix], .form-textarea[b-zu0qw1rmix] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zu0qw1rmix], .form-group select:focus[b-zu0qw1rmix], .form-textarea:focus[b-zu0qw1rmix] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zu0qw1rmix] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zu0qw1rmix] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zu0qw1rmix] { flex: 1; display: flex; align-items: center; }
.form-check[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zu0qw1rmix] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zu0qw1rmix] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zu0qw1rmix] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zu0qw1rmix] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zu0qw1rmix] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zu0qw1rmix] { font-size: 3rem; }
.photo-placeholder span[b-zu0qw1rmix] { font-size: 0.78rem; }
.photo-actions[b-zu0qw1rmix] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zu0qw1rmix] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zu0qw1rmix] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zu0qw1rmix] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zu0qw1rmix] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zu0qw1rmix] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zu0qw1rmix] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zu0qw1rmix] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zu0qw1rmix] { filter: brightness(1.15); transform: scale(1.05); }
[b-zu0qw1rmix] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zu0qw1rmix] { padding: 0.75rem; }
    .crud-header[b-zu0qw1rmix] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zu0qw1rmix] { font-size: 1.1rem; }
    .btn-text[b-zu0qw1rmix] { display: none; }
    .form-row[b-zu0qw1rmix] { flex-direction: column; }
    .form-row-4[b-zu0qw1rmix] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zu0qw1rmix] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zu0qw1rmix] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zu0qw1rmix] { padding: 0.75rem; }
    .modal-tabs[b-zu0qw1rmix] { overflow-x: auto; }
    .modal-tab[b-zu0qw1rmix] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zu0qw1rmix] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zu0qw1rmix] { display: grid !important; }
    .crud-cards-wrapper[b-zu0qw1rmix] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zu0qw1rmix] { grid-template-columns: 1fr; }
    .card-details[b-zu0qw1rmix] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zu0qw1rmix] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zu0qw1rmix] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zu0qw1rmix] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zu0qw1rmix] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmubervehiculosmantenimiento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0ybkr857m9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0ybkr857m9 0.3s ease-out; }
@keyframes slideUp-b-0ybkr857m9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0ybkr857m9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0ybkr857m9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0ybkr857m9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0ybkr857m9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0ybkr857m9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0ybkr857m9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0ybkr857m9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0ybkr857m9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0ybkr857m9] { filter: brightness(1.1); }
.btn-outline[b-0ybkr857m9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0ybkr857m9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0ybkr857m9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0ybkr857m9] { filter: brightness(1.1); }
.btn-icon[b-0ybkr857m9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0ybkr857m9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0ybkr857m9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0ybkr857m9] { color: #ef4444; }
.btn-delete:hover[b-0ybkr857m9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0ybkr857m9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0ybkr857m9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0ybkr857m9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0ybkr857m9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0ybkr857m9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0ybkr857m9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0ybkr857m9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0ybkr857m9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0ybkr857m9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0ybkr857m9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0ybkr857m9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0ybkr857m9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0ybkr857m9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0ybkr857m9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0ybkr857m9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0ybkr857m9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0ybkr857m9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0ybkr857m9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0ybkr857m9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0ybkr857m9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0ybkr857m9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0ybkr857m9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0ybkr857m9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0ybkr857m9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0ybkr857m9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0ybkr857m9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0ybkr857m9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0ybkr857m9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0ybkr857m9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0ybkr857m9] { display: block; }
.hide-on-cards[b-0ybkr857m9] { display: none !important; }
.show-on-cards[b-0ybkr857m9] { display: grid; }
.hide-on-grid[b-0ybkr857m9] { display: none !important; }

/* Badges */
.badge[b-0ybkr857m9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0ybkr857m9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0ybkr857m9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0ybkr857m9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0ybkr857m9] { text-align: center; }
.text-muted[b-0ybkr857m9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0ybkr857m9], .crud-empty-state[b-0ybkr857m9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0ybkr857m9] { font-size: 2rem; }
.crud-spinner[b-0ybkr857m9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0ybkr857m9 0.6s linear infinite; }
.crud-spinner-sm[b-0ybkr857m9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0ybkr857m9 0.6s linear infinite; }
@keyframes spin-b-0ybkr857m9 { to { transform: rotate(360deg); } }
.spin[b-0ybkr857m9] { animation: spin-b-0ybkr857m9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0ybkr857m9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0ybkr857m9 0.15s ease-out; }
.modal-container[b-0ybkr857m9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0ybkr857m9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0ybkr857m9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0ybkr857m9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0ybkr857m9] { max-width: 420px; }
@keyframes fadeIn-b-0ybkr857m9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0ybkr857m9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0ybkr857m9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0ybkr857m9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0ybkr857m9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0ybkr857m9] { color: #dc2626; }
.modal-close[b-0ybkr857m9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0ybkr857m9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0ybkr857m9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0ybkr857m9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0ybkr857m9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0ybkr857m9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0ybkr857m9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0ybkr857m9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0ybkr857m9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0ybkr857m9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0ybkr857m9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0ybkr857m9] { flex: 2; }
.form-group label[b-0ybkr857m9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0ybkr857m9], .form-group select[b-0ybkr857m9], .form-textarea[b-0ybkr857m9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0ybkr857m9], .form-group select:focus[b-0ybkr857m9], .form-textarea:focus[b-0ybkr857m9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0ybkr857m9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0ybkr857m9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0ybkr857m9] { flex: 1; display: flex; align-items: center; }
.form-check[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0ybkr857m9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0ybkr857m9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0ybkr857m9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0ybkr857m9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0ybkr857m9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0ybkr857m9] { font-size: 3rem; }
.photo-placeholder span[b-0ybkr857m9] { font-size: 0.78rem; }
.photo-actions[b-0ybkr857m9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0ybkr857m9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0ybkr857m9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0ybkr857m9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0ybkr857m9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0ybkr857m9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0ybkr857m9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0ybkr857m9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0ybkr857m9] { filter: brightness(1.15); transform: scale(1.05); }
[b-0ybkr857m9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0ybkr857m9] { padding: 0.75rem; }
    .crud-header[b-0ybkr857m9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0ybkr857m9] { font-size: 1.1rem; }
    .btn-text[b-0ybkr857m9] { display: none; }
    .form-row[b-0ybkr857m9] { flex-direction: column; }
    .form-row-4[b-0ybkr857m9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0ybkr857m9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0ybkr857m9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0ybkr857m9] { padding: 0.75rem; }
    .modal-tabs[b-0ybkr857m9] { overflow-x: auto; }
    .modal-tab[b-0ybkr857m9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0ybkr857m9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0ybkr857m9] { display: grid !important; }
    .crud-cards-wrapper[b-0ybkr857m9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0ybkr857m9] { grid-template-columns: 1fr; }
    .card-details[b-0ybkr857m9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0ybkr857m9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0ybkr857m9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0ybkr857m9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0ybkr857m9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Facturacion/Frmurimatfacturacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7ufk67z50y] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7ufk67z50y 0.3s ease-out; }
@keyframes slideUp-b-7ufk67z50y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7ufk67z50y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7ufk67z50y] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7ufk67z50y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7ufk67z50y] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7ufk67z50y] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7ufk67z50y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7ufk67z50y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7ufk67z50y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7ufk67z50y] { filter: brightness(1.1); }
.btn-outline[b-7ufk67z50y] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7ufk67z50y] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7ufk67z50y] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7ufk67z50y] { filter: brightness(1.1); }
.btn-icon[b-7ufk67z50y] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7ufk67z50y] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7ufk67z50y] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7ufk67z50y] { color: #ef4444; }
.btn-delete:hover[b-7ufk67z50y] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7ufk67z50y] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7ufk67z50y] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7ufk67z50y] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7ufk67z50y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7ufk67z50y] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7ufk67z50y] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7ufk67z50y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7ufk67z50y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7ufk67z50y] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7ufk67z50y] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7ufk67z50y] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7ufk67z50y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7ufk67z50y] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7ufk67z50y] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7ufk67z50y] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7ufk67z50y] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7ufk67z50y] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7ufk67z50y] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7ufk67z50y] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7ufk67z50y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7ufk67z50y] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7ufk67z50y] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7ufk67z50y] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7ufk67z50y] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7ufk67z50y] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7ufk67z50y] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7ufk67z50y] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7ufk67z50y] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7ufk67z50y] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7ufk67z50y] { display: block; }
.hide-on-cards[b-7ufk67z50y] { display: none !important; }
.show-on-cards[b-7ufk67z50y] { display: grid; }
.hide-on-grid[b-7ufk67z50y] { display: none !important; }

/* Badges */
.badge[b-7ufk67z50y] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7ufk67z50y] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7ufk67z50y] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7ufk67z50y] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7ufk67z50y] { text-align: center; }
.text-muted[b-7ufk67z50y] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7ufk67z50y], .crud-empty-state[b-7ufk67z50y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7ufk67z50y] { font-size: 2rem; }
.crud-spinner[b-7ufk67z50y] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7ufk67z50y 0.6s linear infinite; }
.crud-spinner-sm[b-7ufk67z50y] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7ufk67z50y 0.6s linear infinite; }
@keyframes spin-b-7ufk67z50y { to { transform: rotate(360deg); } }
.spin[b-7ufk67z50y] { animation: spin-b-7ufk67z50y 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7ufk67z50y] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7ufk67z50y 0.15s ease-out; }
.modal-container[b-7ufk67z50y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7ufk67z50y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7ufk67z50y 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7ufk67z50y] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7ufk67z50y] { max-width: 420px; }
@keyframes fadeIn-b-7ufk67z50y { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7ufk67z50y { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7ufk67z50y] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7ufk67z50y] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7ufk67z50y] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7ufk67z50y] { color: #dc2626; }
.modal-close[b-7ufk67z50y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7ufk67z50y] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7ufk67z50y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7ufk67z50y] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7ufk67z50y] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7ufk67z50y] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7ufk67z50y] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7ufk67z50y] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7ufk67z50y] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7ufk67z50y] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7ufk67z50y] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7ufk67z50y] { flex: 2; }
.form-group label[b-7ufk67z50y] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7ufk67z50y], .form-group select[b-7ufk67z50y], .form-textarea[b-7ufk67z50y] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7ufk67z50y], .form-group select:focus[b-7ufk67z50y], .form-textarea:focus[b-7ufk67z50y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7ufk67z50y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7ufk67z50y] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7ufk67z50y] { flex: 1; display: flex; align-items: center; }
.form-check[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7ufk67z50y] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7ufk67z50y] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7ufk67z50y] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7ufk67z50y] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7ufk67z50y] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7ufk67z50y] { font-size: 3rem; }
.photo-placeholder span[b-7ufk67z50y] { font-size: 0.78rem; }
.photo-actions[b-7ufk67z50y] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7ufk67z50y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7ufk67z50y] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7ufk67z50y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7ufk67z50y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7ufk67z50y] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7ufk67z50y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7ufk67z50y] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7ufk67z50y] { filter: brightness(1.15); transform: scale(1.05); }
[b-7ufk67z50y] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7ufk67z50y] { padding: 0.75rem; }
    .crud-header[b-7ufk67z50y] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7ufk67z50y] { font-size: 1.1rem; }
    .btn-text[b-7ufk67z50y] { display: none; }
    .form-row[b-7ufk67z50y] { flex-direction: column; }
    .form-row-4[b-7ufk67z50y] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7ufk67z50y] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7ufk67z50y] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7ufk67z50y] { padding: 0.75rem; }
    .modal-tabs[b-7ufk67z50y] { overflow-x: auto; }
    .modal-tab[b-7ufk67z50y] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7ufk67z50y] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7ufk67z50y] { display: grid !important; }
    .crud-cards-wrapper[b-7ufk67z50y] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7ufk67z50y] { grid-template-columns: 1fr; }
    .card-details[b-7ufk67z50y] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7ufk67z50y] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7ufk67z50y] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7ufk67z50y] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7ufk67z50y] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_ars.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-esbrlro3wv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-esbrlro3wv 0.3s ease-out; }
@keyframes slideUp-b-esbrlro3wv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-esbrlro3wv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-esbrlro3wv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-esbrlro3wv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-esbrlro3wv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-esbrlro3wv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-esbrlro3wv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-esbrlro3wv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-esbrlro3wv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-esbrlro3wv] { filter: brightness(1.1); }
.btn-outline[b-esbrlro3wv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-esbrlro3wv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-esbrlro3wv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-esbrlro3wv] { filter: brightness(1.1); }
.btn-icon[b-esbrlro3wv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-esbrlro3wv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-esbrlro3wv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-esbrlro3wv] { color: #ef4444; }
.btn-delete:hover[b-esbrlro3wv] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-esbrlro3wv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-esbrlro3wv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-esbrlro3wv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-esbrlro3wv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-esbrlro3wv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-esbrlro3wv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-esbrlro3wv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-esbrlro3wv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-esbrlro3wv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-esbrlro3wv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-esbrlro3wv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-esbrlro3wv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-esbrlro3wv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-esbrlro3wv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-esbrlro3wv] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-esbrlro3wv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-esbrlro3wv] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-esbrlro3wv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-esbrlro3wv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-esbrlro3wv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-esbrlro3wv] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-esbrlro3wv] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-esbrlro3wv] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-esbrlro3wv] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-esbrlro3wv] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-esbrlro3wv] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-esbrlro3wv] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-esbrlro3wv] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-esbrlro3wv] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-esbrlro3wv] { display: block; }
.hide-on-cards[b-esbrlro3wv] { display: none !important; }
.show-on-cards[b-esbrlro3wv] { display: grid; }
.hide-on-grid[b-esbrlro3wv] { display: none !important; }

/* Badges */
.badge[b-esbrlro3wv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-esbrlro3wv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-esbrlro3wv] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-esbrlro3wv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-esbrlro3wv] { text-align: center; }
.text-muted[b-esbrlro3wv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-esbrlro3wv], .crud-empty-state[b-esbrlro3wv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-esbrlro3wv] { font-size: 2rem; }
.crud-spinner[b-esbrlro3wv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-esbrlro3wv 0.6s linear infinite; }
.crud-spinner-sm[b-esbrlro3wv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-esbrlro3wv 0.6s linear infinite; }
@keyframes spin-b-esbrlro3wv { to { transform: rotate(360deg); } }
.spin[b-esbrlro3wv] { animation: spin-b-esbrlro3wv 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-esbrlro3wv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-esbrlro3wv 0.15s ease-out; }
.modal-container[b-esbrlro3wv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-esbrlro3wv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-esbrlro3wv 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-esbrlro3wv] { max-width: 820px; }
.modal-sm[b-esbrlro3wv] { max-width: 420px; }
@keyframes fadeIn-b-esbrlro3wv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-esbrlro3wv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-esbrlro3wv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-esbrlro3wv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-esbrlro3wv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-esbrlro3wv] { color: #dc2626; }
.modal-close[b-esbrlro3wv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-esbrlro3wv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-esbrlro3wv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-esbrlro3wv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-esbrlro3wv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-esbrlro3wv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-esbrlro3wv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-esbrlro3wv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-esbrlro3wv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-esbrlro3wv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-esbrlro3wv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-esbrlro3wv] { flex: 2; }
.form-group label[b-esbrlro3wv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-esbrlro3wv], .form-group select[b-esbrlro3wv], .form-textarea[b-esbrlro3wv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-esbrlro3wv], .form-group select:focus[b-esbrlro3wv], .form-textarea:focus[b-esbrlro3wv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-esbrlro3wv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-esbrlro3wv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-esbrlro3wv] { flex: 1; display: flex; align-items: center; }
.form-check[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-esbrlro3wv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-esbrlro3wv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-esbrlro3wv] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-esbrlro3wv] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-esbrlro3wv] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-esbrlro3wv] { font-size: 3rem; }
.photo-placeholder span[b-esbrlro3wv] { font-size: 0.78rem; }
.photo-actions[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-esbrlro3wv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-esbrlro3wv] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-esbrlro3wv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-esbrlro3wv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-esbrlro3wv] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-esbrlro3wv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-esbrlro3wv] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-esbrlro3wv] { filter: brightness(1.15); transform: scale(1.05); }
[b-esbrlro3wv] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-esbrlro3wv] { padding: 0.75rem; }
    .crud-header[b-esbrlro3wv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-esbrlro3wv] { font-size: 1.1rem; }
    .btn-text[b-esbrlro3wv] { display: none; }
    .form-row[b-esbrlro3wv] { flex-direction: column; }
    .form-row-4[b-esbrlro3wv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-esbrlro3wv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-esbrlro3wv] { max-width: 820px; }
    .modal-body[b-esbrlro3wv] { padding: 0.75rem; }
    .modal-tabs[b-esbrlro3wv] { overflow-x: auto; }
    .modal-tab[b-esbrlro3wv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-esbrlro3wv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-esbrlro3wv] { display: grid !important; }
    .crud-cards-wrapper[b-esbrlro3wv] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-esbrlro3wv] { grid-template-columns: 1fr; }
    .card-details[b-esbrlro3wv] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-esbrlro3wv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-esbrlro3wv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-esbrlro3wv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-esbrlro3wv] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-esbrlro3wv] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-esbrlro3wv] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-esbrlro3wv] { flex: 1.6; }
.far-switch[b-esbrlro3wv] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-esbrlro3wv] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-esbrlro3wv] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-esbrlro3wv] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-esbrlro3wv] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-esbrlro3wv] { border-bottom: none; }
.help-section p[b-esbrlro3wv] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-esbrlro3wv], .help-section ol[b-esbrlro3wv] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-esbrlro3wv] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-esbrlro3wv] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-esbrlro3wv] { color: var(--rg-accent,#2563eb); }
.help-example[b-esbrlro3wv] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-esbrlro3wv] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-esbrlro3wv] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-esbrlro3wv] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-esbrlro3wv] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-esbrlro3wv] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-esbrlro3wv] { background: rgba(37,99,235,0.12); }
.help-steps[b-esbrlro3wv] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-esbrlro3wv] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-esbrlro3wv] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-esbrlro3wv] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-esbrlro3wv] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-esbrlro3wv] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-esbrlro3wv] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-esbrlro3wv] { background: rgba(255,255,255,0.04); }
.help-badge[b-esbrlro3wv] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-esbrlro3wv] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-esbrlro3wv] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-esbrlro3wv] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-esbrlro3wv] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-esbrlro3wv] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-esbrlro3wv] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-esbrlro3wv] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-esbrlro3wv] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_ars_planes.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-wjb3w59ull] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wjb3w59ull 0.3s ease-out; }
@keyframes slideUp-b-wjb3w59ull { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wjb3w59ull] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wjb3w59ull] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wjb3w59ull] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wjb3w59ull] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wjb3w59ull] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wjb3w59ull] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wjb3w59ull] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wjb3w59ull] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wjb3w59ull] { filter: brightness(1.1); }
.btn-outline[b-wjb3w59ull] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wjb3w59ull] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wjb3w59ull] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wjb3w59ull] { filter: brightness(1.1); }
.btn-icon[b-wjb3w59ull] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wjb3w59ull] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wjb3w59ull] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wjb3w59ull] { color: #ef4444; }
.btn-delete:hover[b-wjb3w59ull] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-wjb3w59ull] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wjb3w59ull] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wjb3w59ull] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wjb3w59ull] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wjb3w59ull] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wjb3w59ull] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-wjb3w59ull] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wjb3w59ull] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-wjb3w59ull] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wjb3w59ull] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wjb3w59ull] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wjb3w59ull] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wjb3w59ull] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wjb3w59ull] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wjb3w59ull] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-wjb3w59ull] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-wjb3w59ull] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-wjb3w59ull] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-wjb3w59ull] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-wjb3w59ull] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-wjb3w59ull] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-wjb3w59ull] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-wjb3w59ull] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-wjb3w59ull] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-wjb3w59ull] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-wjb3w59ull] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-wjb3w59ull] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-wjb3w59ull] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-wjb3w59ull] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-wjb3w59ull] { display: block; }
.hide-on-cards[b-wjb3w59ull] { display: none !important; }
.show-on-cards[b-wjb3w59ull] { display: grid; }
.hide-on-grid[b-wjb3w59ull] { display: none !important; }

/* Badges */
.badge[b-wjb3w59ull] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wjb3w59ull] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wjb3w59ull] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-wjb3w59ull] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wjb3w59ull] { text-align: center; }
.text-muted[b-wjb3w59ull] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wjb3w59ull], .crud-empty-state[b-wjb3w59ull] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wjb3w59ull] { font-size: 2rem; }
.crud-spinner[b-wjb3w59ull] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wjb3w59ull 0.6s linear infinite; }
.crud-spinner-sm[b-wjb3w59ull] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wjb3w59ull 0.6s linear infinite; }
@keyframes spin-b-wjb3w59ull { to { transform: rotate(360deg); } }
.spin[b-wjb3w59ull] { animation: spin-b-wjb3w59ull 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-wjb3w59ull] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wjb3w59ull 0.15s ease-out; }
.modal-container[b-wjb3w59ull] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wjb3w59ull] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wjb3w59ull 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-wjb3w59ull] { max-width: 820px; }
.modal-sm[b-wjb3w59ull] { max-width: 420px; }
@keyframes fadeIn-b-wjb3w59ull { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wjb3w59ull { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wjb3w59ull] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wjb3w59ull] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-wjb3w59ull] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-wjb3w59ull] { color: #dc2626; }
.modal-close[b-wjb3w59ull] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wjb3w59ull] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wjb3w59ull] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wjb3w59ull] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wjb3w59ull] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-wjb3w59ull] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wjb3w59ull] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wjb3w59ull] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wjb3w59ull] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wjb3w59ull] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wjb3w59ull] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wjb3w59ull] { flex: 2; }
.form-group label[b-wjb3w59ull] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wjb3w59ull], .form-group select[b-wjb3w59ull], .form-textarea[b-wjb3w59ull] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wjb3w59ull], .form-group select:focus[b-wjb3w59ull], .form-textarea:focus[b-wjb3w59ull] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wjb3w59ull] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wjb3w59ull] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wjb3w59ull] { flex: 1; display: flex; align-items: center; }
.form-check[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wjb3w59ull] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-wjb3w59ull] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-wjb3w59ull] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-wjb3w59ull] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-wjb3w59ull] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-wjb3w59ull] { font-size: 3rem; }
.photo-placeholder span[b-wjb3w59ull] { font-size: 0.78rem; }
.photo-actions[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-wjb3w59ull] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-wjb3w59ull] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-wjb3w59ull] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-wjb3w59ull] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-wjb3w59ull] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-wjb3w59ull] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-wjb3w59ull] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-wjb3w59ull] { filter: brightness(1.15); transform: scale(1.05); }
[b-wjb3w59ull] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wjb3w59ull] { padding: 0.75rem; }
    .crud-header[b-wjb3w59ull] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wjb3w59ull] { font-size: 1.1rem; }
    .btn-text[b-wjb3w59ull] { display: none; }
    .form-row[b-wjb3w59ull] { flex-direction: column; }
    .form-row-4[b-wjb3w59ull] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wjb3w59ull] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wjb3w59ull] { max-width: 820px; }
    .modal-body[b-wjb3w59ull] { padding: 0.75rem; }
    .modal-tabs[b-wjb3w59ull] { overflow-x: auto; }
    .modal-tab[b-wjb3w59ull] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-wjb3w59ull] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-wjb3w59ull] { display: grid !important; }
    .crud-cards-wrapper[b-wjb3w59ull] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-wjb3w59ull] { grid-template-columns: 1fr; }
    .card-details[b-wjb3w59ull] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-wjb3w59ull] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wjb3w59ull] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wjb3w59ull] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wjb3w59ull] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-wjb3w59ull] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-wjb3w59ull] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-wjb3w59ull] { flex: 1.6; }
.far-switch[b-wjb3w59ull] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-wjb3w59ull] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-wjb3w59ull] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-wjb3w59ull] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-wjb3w59ull] { color:#93c5fd; }
.far-cold[b-wjb3w59ull] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-wjb3w59ull] { color:#7dd3fc !important; }
.badge-warn[b-wjb3w59ull] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-wjb3w59ull] { color:#fcd34d; }
.badge-func[b-wjb3w59ull] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-wjb3w59ull] { color:#a5b4fc; }
.far-row-venc td[b-wjb3w59ull] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-wjb3w59ull] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-wjb3w59ull] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-wjb3w59ull], .pc-addbar select[b-wjb3w59ull] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-wjb3w59ull] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-wjb3w59ull] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-wjb3w59ull] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-wjb3w59ull] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-wjb3w59ull] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-wjb3w59ull] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-wjb3w59ull] { border-bottom: none; }
.help-section p[b-wjb3w59ull] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-wjb3w59ull], .help-section ol[b-wjb3w59ull] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-wjb3w59ull] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-wjb3w59ull] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-wjb3w59ull] { color: var(--rg-accent,#2563eb); }
.help-example[b-wjb3w59ull] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-wjb3w59ull] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-wjb3w59ull] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-wjb3w59ull] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-wjb3w59ull] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-wjb3w59ull] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-wjb3w59ull] { background: rgba(37,99,235,0.12); }
.help-steps[b-wjb3w59ull] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-wjb3w59ull] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-wjb3w59ull] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-wjb3w59ull] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-wjb3w59ull] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-wjb3w59ull] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-wjb3w59ull] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-wjb3w59ull] { background: rgba(255,255,255,0.04); }
.help-badge[b-wjb3w59ull] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-wjb3w59ull] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-wjb3w59ull] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-wjb3w59ull] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-wjb3w59ull] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-wjb3w59ull] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-wjb3w59ull] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-wjb3w59ull] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-wjb3w59ull] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_categorias.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4pj0gfkabs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4pj0gfkabs 0.3s ease-out; }
@keyframes slideUp-b-4pj0gfkabs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4pj0gfkabs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4pj0gfkabs] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4pj0gfkabs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4pj0gfkabs] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4pj0gfkabs] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4pj0gfkabs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4pj0gfkabs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4pj0gfkabs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4pj0gfkabs] { filter: brightness(1.1); }
.btn-outline[b-4pj0gfkabs] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4pj0gfkabs] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4pj0gfkabs] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4pj0gfkabs] { filter: brightness(1.1); }
.btn-icon[b-4pj0gfkabs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4pj0gfkabs] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4pj0gfkabs] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4pj0gfkabs] { color: #ef4444; }
.btn-delete:hover[b-4pj0gfkabs] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4pj0gfkabs] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4pj0gfkabs] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4pj0gfkabs] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4pj0gfkabs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4pj0gfkabs] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4pj0gfkabs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4pj0gfkabs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4pj0gfkabs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4pj0gfkabs] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4pj0gfkabs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4pj0gfkabs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4pj0gfkabs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4pj0gfkabs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4pj0gfkabs] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4pj0gfkabs] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4pj0gfkabs] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4pj0gfkabs] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4pj0gfkabs] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4pj0gfkabs] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4pj0gfkabs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4pj0gfkabs] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4pj0gfkabs] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4pj0gfkabs] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4pj0gfkabs] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4pj0gfkabs] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4pj0gfkabs] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4pj0gfkabs] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4pj0gfkabs] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4pj0gfkabs] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4pj0gfkabs] { display: block; }
.hide-on-cards[b-4pj0gfkabs] { display: none !important; }
.show-on-cards[b-4pj0gfkabs] { display: grid; }
.hide-on-grid[b-4pj0gfkabs] { display: none !important; }

/* Badges */
.badge[b-4pj0gfkabs] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4pj0gfkabs] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4pj0gfkabs] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4pj0gfkabs] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4pj0gfkabs] { text-align: center; }
.text-muted[b-4pj0gfkabs] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4pj0gfkabs], .crud-empty-state[b-4pj0gfkabs] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4pj0gfkabs] { font-size: 2rem; }
.crud-spinner[b-4pj0gfkabs] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4pj0gfkabs 0.6s linear infinite; }
.crud-spinner-sm[b-4pj0gfkabs] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4pj0gfkabs 0.6s linear infinite; }
@keyframes spin-b-4pj0gfkabs { to { transform: rotate(360deg); } }
.spin[b-4pj0gfkabs] { animation: spin-b-4pj0gfkabs 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4pj0gfkabs] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4pj0gfkabs 0.15s ease-out; }
.modal-container[b-4pj0gfkabs] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4pj0gfkabs] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4pj0gfkabs 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-4pj0gfkabs] { max-width: 820px; }
.modal-sm[b-4pj0gfkabs] { max-width: 420px; }
@keyframes fadeIn-b-4pj0gfkabs { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4pj0gfkabs { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4pj0gfkabs] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4pj0gfkabs] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4pj0gfkabs] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4pj0gfkabs] { color: #dc2626; }
.modal-close[b-4pj0gfkabs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4pj0gfkabs] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4pj0gfkabs] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4pj0gfkabs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4pj0gfkabs] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4pj0gfkabs] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4pj0gfkabs] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4pj0gfkabs] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4pj0gfkabs] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4pj0gfkabs] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4pj0gfkabs] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4pj0gfkabs] { flex: 2; }
.form-group label[b-4pj0gfkabs] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4pj0gfkabs], .form-group select[b-4pj0gfkabs], .form-textarea[b-4pj0gfkabs] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4pj0gfkabs], .form-group select:focus[b-4pj0gfkabs], .form-textarea:focus[b-4pj0gfkabs] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4pj0gfkabs] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4pj0gfkabs] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4pj0gfkabs] { flex: 1; display: flex; align-items: center; }
.form-check[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4pj0gfkabs] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4pj0gfkabs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4pj0gfkabs] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4pj0gfkabs] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4pj0gfkabs] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4pj0gfkabs] { font-size: 3rem; }
.photo-placeholder span[b-4pj0gfkabs] { font-size: 0.78rem; }
.photo-actions[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4pj0gfkabs] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-4pj0gfkabs] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4pj0gfkabs] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4pj0gfkabs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4pj0gfkabs] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4pj0gfkabs] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4pj0gfkabs] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4pj0gfkabs] { filter: brightness(1.15); transform: scale(1.05); }
[b-4pj0gfkabs] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4pj0gfkabs] { padding: 0.75rem; }
    .crud-header[b-4pj0gfkabs] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4pj0gfkabs] { font-size: 1.1rem; }
    .btn-text[b-4pj0gfkabs] { display: none; }
    .form-row[b-4pj0gfkabs] { flex-direction: column; }
    .form-row-4[b-4pj0gfkabs] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4pj0gfkabs] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4pj0gfkabs] { max-width: 820px; }
    .modal-body[b-4pj0gfkabs] { padding: 0.75rem; }
    .modal-tabs[b-4pj0gfkabs] { overflow-x: auto; }
    .modal-tab[b-4pj0gfkabs] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4pj0gfkabs] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4pj0gfkabs] { display: grid !important; }
    .crud-cards-wrapper[b-4pj0gfkabs] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4pj0gfkabs] { grid-template-columns: 1fr; }
    .card-details[b-4pj0gfkabs] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-4pj0gfkabs] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4pj0gfkabs] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4pj0gfkabs] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4pj0gfkabs] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-4pj0gfkabs] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-4pj0gfkabs] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-4pj0gfkabs] { flex: 1.6; }
.far-switch[b-4pj0gfkabs] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-4pj0gfkabs] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-4pj0gfkabs] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-4pj0gfkabs] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-4pj0gfkabs] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-4pj0gfkabs] { border-bottom: none; }
.help-section p[b-4pj0gfkabs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-4pj0gfkabs], .help-section ol[b-4pj0gfkabs] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-4pj0gfkabs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-4pj0gfkabs] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-4pj0gfkabs] { color: var(--rg-accent,#2563eb); }
.help-example[b-4pj0gfkabs] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-4pj0gfkabs] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-4pj0gfkabs] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-4pj0gfkabs] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-4pj0gfkabs] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-4pj0gfkabs] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-4pj0gfkabs] { background: rgba(37,99,235,0.12); }
.help-steps[b-4pj0gfkabs] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-4pj0gfkabs] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-4pj0gfkabs] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-4pj0gfkabs] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-4pj0gfkabs] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-4pj0gfkabs] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-4pj0gfkabs] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-4pj0gfkabs] { background: rgba(255,255,255,0.04); }
.help-badge[b-4pj0gfkabs] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-4pj0gfkabs] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-4pj0gfkabs] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-4pj0gfkabs] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-4pj0gfkabs] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-4pj0gfkabs] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-4pj0gfkabs] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-4pj0gfkabs] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-4pj0gfkabs] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_cliente_perfil.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lt92y5apc2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lt92y5apc2 0.3s ease-out; }
@keyframes slideUp-b-lt92y5apc2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lt92y5apc2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lt92y5apc2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lt92y5apc2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lt92y5apc2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lt92y5apc2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lt92y5apc2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lt92y5apc2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lt92y5apc2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lt92y5apc2] { filter: brightness(1.1); }
.btn-outline[b-lt92y5apc2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lt92y5apc2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lt92y5apc2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lt92y5apc2] { filter: brightness(1.1); }
.btn-icon[b-lt92y5apc2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lt92y5apc2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lt92y5apc2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lt92y5apc2] { color: #ef4444; }
.btn-delete:hover[b-lt92y5apc2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lt92y5apc2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lt92y5apc2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lt92y5apc2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lt92y5apc2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lt92y5apc2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lt92y5apc2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lt92y5apc2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lt92y5apc2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lt92y5apc2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lt92y5apc2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lt92y5apc2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lt92y5apc2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lt92y5apc2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lt92y5apc2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lt92y5apc2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lt92y5apc2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lt92y5apc2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lt92y5apc2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lt92y5apc2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lt92y5apc2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lt92y5apc2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lt92y5apc2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lt92y5apc2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lt92y5apc2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lt92y5apc2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lt92y5apc2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lt92y5apc2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lt92y5apc2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lt92y5apc2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lt92y5apc2] { display: block; }
.hide-on-cards[b-lt92y5apc2] { display: none !important; }
.show-on-cards[b-lt92y5apc2] { display: grid; }
.hide-on-grid[b-lt92y5apc2] { display: none !important; }

/* Badges */
.badge[b-lt92y5apc2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lt92y5apc2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lt92y5apc2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lt92y5apc2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lt92y5apc2] { text-align: center; }
.text-muted[b-lt92y5apc2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lt92y5apc2], .crud-empty-state[b-lt92y5apc2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lt92y5apc2] { font-size: 2rem; }
.crud-spinner[b-lt92y5apc2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lt92y5apc2 0.6s linear infinite; }
.crud-spinner-sm[b-lt92y5apc2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lt92y5apc2 0.6s linear infinite; }
@keyframes spin-b-lt92y5apc2 { to { transform: rotate(360deg); } }
.spin[b-lt92y5apc2] { animation: spin-b-lt92y5apc2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lt92y5apc2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lt92y5apc2 0.15s ease-out; }
.modal-container[b-lt92y5apc2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lt92y5apc2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lt92y5apc2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-lt92y5apc2] { max-width: 820px; }
.modal-sm[b-lt92y5apc2] { max-width: 420px; }
@keyframes fadeIn-b-lt92y5apc2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lt92y5apc2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lt92y5apc2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lt92y5apc2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lt92y5apc2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lt92y5apc2] { color: #dc2626; }
.modal-close[b-lt92y5apc2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lt92y5apc2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lt92y5apc2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lt92y5apc2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lt92y5apc2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lt92y5apc2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lt92y5apc2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lt92y5apc2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lt92y5apc2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lt92y5apc2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lt92y5apc2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lt92y5apc2] { flex: 2; }
.form-group label[b-lt92y5apc2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lt92y5apc2], .form-group select[b-lt92y5apc2], .form-textarea[b-lt92y5apc2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lt92y5apc2], .form-group select:focus[b-lt92y5apc2], .form-textarea:focus[b-lt92y5apc2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lt92y5apc2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lt92y5apc2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lt92y5apc2] { flex: 1; display: flex; align-items: center; }
.form-check[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lt92y5apc2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lt92y5apc2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lt92y5apc2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lt92y5apc2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lt92y5apc2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lt92y5apc2] { font-size: 3rem; }
.photo-placeholder span[b-lt92y5apc2] { font-size: 0.78rem; }
.photo-actions[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lt92y5apc2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-lt92y5apc2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lt92y5apc2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lt92y5apc2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lt92y5apc2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lt92y5apc2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lt92y5apc2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lt92y5apc2] { filter: brightness(1.15); transform: scale(1.05); }
[b-lt92y5apc2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lt92y5apc2] { padding: 0.75rem; }
    .crud-header[b-lt92y5apc2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lt92y5apc2] { font-size: 1.1rem; }
    .btn-text[b-lt92y5apc2] { display: none; }
    .form-row[b-lt92y5apc2] { flex-direction: column; }
    .form-row-4[b-lt92y5apc2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lt92y5apc2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lt92y5apc2] { max-width: 820px; }
    .modal-body[b-lt92y5apc2] { padding: 0.75rem; }
    .modal-tabs[b-lt92y5apc2] { overflow-x: auto; }
    .modal-tab[b-lt92y5apc2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lt92y5apc2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lt92y5apc2] { display: grid !important; }
    .crud-cards-wrapper[b-lt92y5apc2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lt92y5apc2] { grid-template-columns: 1fr; }
    .card-details[b-lt92y5apc2] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-lt92y5apc2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lt92y5apc2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lt92y5apc2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lt92y5apc2] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-lt92y5apc2] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-lt92y5apc2] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-lt92y5apc2] { flex: 1.6; }
.far-switch[b-lt92y5apc2] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-lt92y5apc2] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Perfil Clínico ── */
.pc-cliente-bar[b-lt92y5apc2] { display: flex; flex-direction: column; gap: 0.3rem; max-width: 560px; margin-bottom: 1rem; }
.pc-cliente-bar > label[b-lt92y5apc2] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); }
.pc-cliente-head[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.7rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.7rem 0.9rem; margin-bottom: 0.9rem; }
.pc-cliente-head i[b-lt92y5apc2] { font-size: 1.8rem; color: var(--rg-primary); }
.pc-cliente-head strong[b-lt92y5apc2] { display: block; color: var(--rg-text-primary); }
.pc-cliente-id[b-lt92y5apc2] { font-size: 0.75rem; color: var(--rg-text-muted); }
.pc-tabs[b-lt92y5apc2] { display: flex; gap: 0.25rem; flex-wrap: wrap; border-bottom: 2px solid var(--rg-border); margin-bottom: 1rem; }
.pc-tab[b-lt92y5apc2] { display: inline-flex; align-items: center; gap: 0.4rem; background: transparent; border: none; border-bottom: 2px solid transparent; cursor: pointer; color: var(--rg-text-secondary); font-size: 0.84rem; font-weight: 600; padding: 0.55rem 0.85rem; margin-bottom: -2px; }
.pc-tab:hover[b-lt92y5apc2] { color: var(--rg-text-primary); }
.pc-tab.active[b-lt92y5apc2] { color: var(--rg-primary); border-bottom-color: var(--rg-primary); }
[data-mode="dark"] .pc-tab.active[b-lt92y5apc2] { color: #93c5fd; border-bottom-color: #93c5fd; }
.pc-panel[b-lt92y5apc2] { }
.pc-addbar[b-lt92y5apc2] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.55rem; padding: 0.6rem; margin-bottom: 0.85rem; }
.pc-addbar input[b-lt92y5apc2], .pc-addbar select[b-lt92y5apc2] { flex: 1; min-width: 130px; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.4rem 0.55rem; font-size: 0.84rem; }
.pc-actions[b-lt92y5apc2] { margin-top: 0.85rem; display: flex; justify-content: flex-end; }
.pc-empty[b-lt92y5apc2] { color: var(--rg-text-muted); font-size: 0.85rem; text-align: center; padding: 1rem; }
.pc-notas[b-lt92y5apc2] { display: flex; flex-direction: column; gap: 0.6rem; }
.pc-nota[b-lt92y5apc2] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-left: 4px solid var(--rg-primary); border-radius: 0.5rem; padding: 0.6rem 0.8rem; }
.pc-nota-head[b-lt92y5apc2] { display: flex; justify-content: space-between; font-size: 0.74rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.3rem; }
.pc-nota-meta[b-lt92y5apc2] { font-weight: 500; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; }
.pc-nota-text[b-lt92y5apc2] { font-size: 0.88rem; color: var(--rg-text-primary); white-space: pre-wrap; }
.badge-warn[b-lt92y5apc2] { background: rgba(217,119,6,0.14); color: #92400e; }
[data-mode="dark"] .badge-warn[b-lt92y5apc2] { color: #fcd34d; }
.far-switch[b-lt92y5apc2] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-lt92y5apc2] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }
.form-grow[b-lt92y5apc2] { flex: 1.6; }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-lt92y5apc2] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-lt92y5apc2] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-lt92y5apc2] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-lt92y5apc2] { border-bottom: none; }
.help-section p[b-lt92y5apc2] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-lt92y5apc2], .help-section ol[b-lt92y5apc2] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-lt92y5apc2] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-lt92y5apc2] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-lt92y5apc2] { color: var(--rg-accent,#2563eb); }
.help-example[b-lt92y5apc2] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-lt92y5apc2] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-lt92y5apc2] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-lt92y5apc2] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-lt92y5apc2] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-lt92y5apc2] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-lt92y5apc2] { background: rgba(37,99,235,0.12); }
.help-steps[b-lt92y5apc2] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-lt92y5apc2] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-lt92y5apc2] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-lt92y5apc2] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-lt92y5apc2] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-lt92y5apc2] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-lt92y5apc2] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-lt92y5apc2] { background: rgba(255,255,255,0.04); }
.help-badge[b-lt92y5apc2] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-lt92y5apc2] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-lt92y5apc2] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-lt92y5apc2] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-lt92y5apc2] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-lt92y5apc2] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-lt92y5apc2] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-lt92y5apc2] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-lt92y5apc2] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_cobertura_producto.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-s9od3otbyt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-s9od3otbyt 0.3s ease-out; }
@keyframes slideUp-b-s9od3otbyt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-s9od3otbyt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-s9od3otbyt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-s9od3otbyt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-s9od3otbyt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-s9od3otbyt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-s9od3otbyt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-s9od3otbyt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-s9od3otbyt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-s9od3otbyt] { filter: brightness(1.1); }
.btn-outline[b-s9od3otbyt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-s9od3otbyt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-s9od3otbyt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-s9od3otbyt] { filter: brightness(1.1); }
.btn-icon[b-s9od3otbyt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-s9od3otbyt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-s9od3otbyt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-s9od3otbyt] { color: #ef4444; }
.btn-delete:hover[b-s9od3otbyt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-s9od3otbyt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-s9od3otbyt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-s9od3otbyt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-s9od3otbyt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-s9od3otbyt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-s9od3otbyt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-s9od3otbyt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-s9od3otbyt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-s9od3otbyt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-s9od3otbyt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-s9od3otbyt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-s9od3otbyt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-s9od3otbyt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-s9od3otbyt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-s9od3otbyt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-s9od3otbyt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-s9od3otbyt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-s9od3otbyt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-s9od3otbyt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-s9od3otbyt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-s9od3otbyt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-s9od3otbyt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-s9od3otbyt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-s9od3otbyt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-s9od3otbyt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-s9od3otbyt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-s9od3otbyt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-s9od3otbyt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-s9od3otbyt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-s9od3otbyt] { display: block; }
.hide-on-cards[b-s9od3otbyt] { display: none !important; }
.show-on-cards[b-s9od3otbyt] { display: grid; }
.hide-on-grid[b-s9od3otbyt] { display: none !important; }

/* Badges */
.badge[b-s9od3otbyt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-s9od3otbyt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-s9od3otbyt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-s9od3otbyt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-s9od3otbyt] { text-align: center; }
.text-muted[b-s9od3otbyt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-s9od3otbyt], .crud-empty-state[b-s9od3otbyt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-s9od3otbyt] { font-size: 2rem; }
.crud-spinner[b-s9od3otbyt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-s9od3otbyt 0.6s linear infinite; }
.crud-spinner-sm[b-s9od3otbyt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-s9od3otbyt 0.6s linear infinite; }
@keyframes spin-b-s9od3otbyt { to { transform: rotate(360deg); } }
.spin[b-s9od3otbyt] { animation: spin-b-s9od3otbyt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-s9od3otbyt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-s9od3otbyt 0.15s ease-out; }
.modal-container[b-s9od3otbyt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-s9od3otbyt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-s9od3otbyt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-s9od3otbyt] { max-width: 820px; }
.modal-sm[b-s9od3otbyt] { max-width: 420px; }
@keyframes fadeIn-b-s9od3otbyt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-s9od3otbyt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-s9od3otbyt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-s9od3otbyt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-s9od3otbyt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-s9od3otbyt] { color: #dc2626; }
.modal-close[b-s9od3otbyt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-s9od3otbyt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-s9od3otbyt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-s9od3otbyt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-s9od3otbyt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-s9od3otbyt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-s9od3otbyt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-s9od3otbyt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-s9od3otbyt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-s9od3otbyt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-s9od3otbyt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-s9od3otbyt] { flex: 2; }
.form-group label[b-s9od3otbyt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-s9od3otbyt], .form-group select[b-s9od3otbyt], .form-textarea[b-s9od3otbyt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-s9od3otbyt], .form-group select:focus[b-s9od3otbyt], .form-textarea:focus[b-s9od3otbyt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-s9od3otbyt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-s9od3otbyt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-s9od3otbyt] { flex: 1; display: flex; align-items: center; }
.form-check[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-s9od3otbyt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-s9od3otbyt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-s9od3otbyt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-s9od3otbyt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-s9od3otbyt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-s9od3otbyt] { font-size: 3rem; }
.photo-placeholder span[b-s9od3otbyt] { font-size: 0.78rem; }
.photo-actions[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-s9od3otbyt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-s9od3otbyt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-s9od3otbyt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-s9od3otbyt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-s9od3otbyt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-s9od3otbyt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-s9od3otbyt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-s9od3otbyt] { filter: brightness(1.15); transform: scale(1.05); }
[b-s9od3otbyt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-s9od3otbyt] { padding: 0.75rem; }
    .crud-header[b-s9od3otbyt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-s9od3otbyt] { font-size: 1.1rem; }
    .btn-text[b-s9od3otbyt] { display: none; }
    .form-row[b-s9od3otbyt] { flex-direction: column; }
    .form-row-4[b-s9od3otbyt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-s9od3otbyt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-s9od3otbyt] { max-width: 820px; }
    .modal-body[b-s9od3otbyt] { padding: 0.75rem; }
    .modal-tabs[b-s9od3otbyt] { overflow-x: auto; }
    .modal-tab[b-s9od3otbyt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-s9od3otbyt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-s9od3otbyt] { display: grid !important; }
    .crud-cards-wrapper[b-s9od3otbyt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-s9od3otbyt] { grid-template-columns: 1fr; }
    .card-details[b-s9od3otbyt] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-s9od3otbyt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-s9od3otbyt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-s9od3otbyt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-s9od3otbyt] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-s9od3otbyt] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-s9od3otbyt] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-s9od3otbyt] { flex: 1.6; }
.far-switch[b-s9od3otbyt] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-s9od3otbyt] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-s9od3otbyt] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-s9od3otbyt] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-s9od3otbyt] { color:#93c5fd; }
.far-cold[b-s9od3otbyt] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-s9od3otbyt] { color:#7dd3fc !important; }
.badge-warn[b-s9od3otbyt] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-s9od3otbyt] { color:#fcd34d; }
.badge-func[b-s9od3otbyt] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-s9od3otbyt] { color:#a5b4fc; }
.far-row-venc td[b-s9od3otbyt] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-s9od3otbyt] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-s9od3otbyt] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-s9od3otbyt], .pc-addbar select[b-s9od3otbyt] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-s9od3otbyt] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-s9od3otbyt] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-s9od3otbyt] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-s9od3otbyt] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-s9od3otbyt] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-s9od3otbyt] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-s9od3otbyt] { border-bottom: none; }
.help-section p[b-s9od3otbyt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-s9od3otbyt], .help-section ol[b-s9od3otbyt] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-s9od3otbyt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-s9od3otbyt] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-s9od3otbyt] { color: var(--rg-accent,#2563eb); }
.help-example[b-s9od3otbyt] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-s9od3otbyt] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-s9od3otbyt] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-s9od3otbyt] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-s9od3otbyt] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-s9od3otbyt] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-s9od3otbyt] { background: rgba(37,99,235,0.12); }
.help-steps[b-s9od3otbyt] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-s9od3otbyt] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-s9od3otbyt] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-s9od3otbyt] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-s9od3otbyt] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-s9od3otbyt] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-s9od3otbyt] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-s9od3otbyt] { background: rgba(255,255,255,0.04); }
.help-badge[b-s9od3otbyt] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-s9od3otbyt] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-s9od3otbyt] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-s9od3otbyt] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-s9od3otbyt] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-s9od3otbyt] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-s9od3otbyt] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-s9od3otbyt] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-s9od3otbyt] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_laboratorios.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-876f9epwnw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-876f9epwnw 0.3s ease-out; }
@keyframes slideUp-b-876f9epwnw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-876f9epwnw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-876f9epwnw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-876f9epwnw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-876f9epwnw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-876f9epwnw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-876f9epwnw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-876f9epwnw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-876f9epwnw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-876f9epwnw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-876f9epwnw] { filter: brightness(1.1); }
.btn-outline[b-876f9epwnw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-876f9epwnw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-876f9epwnw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-876f9epwnw] { filter: brightness(1.1); }
.btn-icon[b-876f9epwnw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-876f9epwnw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-876f9epwnw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-876f9epwnw] { color: #ef4444; }
.btn-delete:hover[b-876f9epwnw] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-876f9epwnw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-876f9epwnw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-876f9epwnw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-876f9epwnw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-876f9epwnw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-876f9epwnw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-876f9epwnw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-876f9epwnw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-876f9epwnw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-876f9epwnw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-876f9epwnw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-876f9epwnw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-876f9epwnw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-876f9epwnw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-876f9epwnw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-876f9epwnw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-876f9epwnw] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-876f9epwnw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-876f9epwnw] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-876f9epwnw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-876f9epwnw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-876f9epwnw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-876f9epwnw] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-876f9epwnw] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-876f9epwnw] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-876f9epwnw] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-876f9epwnw] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-876f9epwnw] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-876f9epwnw] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-876f9epwnw] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-876f9epwnw] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-876f9epwnw] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-876f9epwnw] { display: block; }
.hide-on-cards[b-876f9epwnw] { display: none !important; }
.show-on-cards[b-876f9epwnw] { display: grid; }
.hide-on-grid[b-876f9epwnw] { display: none !important; }

/* Badges */
.badge[b-876f9epwnw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-876f9epwnw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-876f9epwnw] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-876f9epwnw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-876f9epwnw] { text-align: center; }
.text-muted[b-876f9epwnw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-876f9epwnw], .crud-empty-state[b-876f9epwnw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-876f9epwnw] { font-size: 2rem; }
.crud-spinner[b-876f9epwnw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-876f9epwnw 0.6s linear infinite; }
.crud-spinner-sm[b-876f9epwnw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-876f9epwnw 0.6s linear infinite; }
@keyframes spin-b-876f9epwnw { to { transform: rotate(360deg); } }
.spin[b-876f9epwnw] { animation: spin-b-876f9epwnw 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-876f9epwnw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-876f9epwnw 0.15s ease-out; }
.modal-container[b-876f9epwnw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-876f9epwnw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-876f9epwnw 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-876f9epwnw] { max-width: 820px; }
.modal-sm[b-876f9epwnw] { max-width: 420px; }
@keyframes fadeIn-b-876f9epwnw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-876f9epwnw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-876f9epwnw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-876f9epwnw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-876f9epwnw] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-876f9epwnw] { color: #dc2626; }
.modal-close[b-876f9epwnw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-876f9epwnw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-876f9epwnw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-876f9epwnw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-876f9epwnw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-876f9epwnw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-876f9epwnw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-876f9epwnw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-876f9epwnw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-876f9epwnw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-876f9epwnw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-876f9epwnw] { flex: 2; }
.form-group label[b-876f9epwnw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-876f9epwnw], .form-group select[b-876f9epwnw], .form-textarea[b-876f9epwnw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-876f9epwnw], .form-group select:focus[b-876f9epwnw], .form-textarea:focus[b-876f9epwnw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-876f9epwnw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-876f9epwnw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-876f9epwnw] { flex: 1; display: flex; align-items: center; }
.form-check[b-876f9epwnw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-876f9epwnw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-876f9epwnw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-876f9epwnw] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-876f9epwnw] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-876f9epwnw] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-876f9epwnw] { font-size: 3rem; }
.photo-placeholder span[b-876f9epwnw] { font-size: 0.78rem; }
.photo-actions[b-876f9epwnw] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-876f9epwnw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-876f9epwnw] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-876f9epwnw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-876f9epwnw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-876f9epwnw] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-876f9epwnw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-876f9epwnw] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-876f9epwnw] { filter: brightness(1.15); transform: scale(1.05); }
[b-876f9epwnw] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-876f9epwnw] { padding: 0.75rem; }
    .crud-header[b-876f9epwnw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-876f9epwnw] { font-size: 1.1rem; }
    .btn-text[b-876f9epwnw] { display: none; }
    .form-row[b-876f9epwnw] { flex-direction: column; }
    .form-row-4[b-876f9epwnw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-876f9epwnw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-876f9epwnw] { max-width: 820px; }
    .modal-body[b-876f9epwnw] { padding: 0.75rem; }
    .modal-tabs[b-876f9epwnw] { overflow-x: auto; }
    .modal-tab[b-876f9epwnw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-876f9epwnw] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-876f9epwnw] { display: grid !important; }
    .crud-cards-wrapper[b-876f9epwnw] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-876f9epwnw] { grid-template-columns: 1fr; }
    .card-details[b-876f9epwnw] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-876f9epwnw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-876f9epwnw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-876f9epwnw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-876f9epwnw] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-876f9epwnw] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-876f9epwnw] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-876f9epwnw] { flex: 1.6; }
.far-switch[b-876f9epwnw] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-876f9epwnw] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-876f9epwnw] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-876f9epwnw] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-876f9epwnw] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-876f9epwnw] { border-bottom: none; }
.help-section p[b-876f9epwnw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-876f9epwnw], .help-section ol[b-876f9epwnw] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-876f9epwnw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-876f9epwnw] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-876f9epwnw] { color: var(--rg-accent,#2563eb); }
.help-example[b-876f9epwnw] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-876f9epwnw] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-876f9epwnw] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-876f9epwnw] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-876f9epwnw] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-876f9epwnw] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-876f9epwnw] { background: rgba(37,99,235,0.12); }
.help-steps[b-876f9epwnw] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-876f9epwnw] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-876f9epwnw] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-876f9epwnw] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-876f9epwnw] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-876f9epwnw] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-876f9epwnw] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-876f9epwnw] { background: rgba(255,255,255,0.04); }
.help-badge[b-876f9epwnw] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-876f9epwnw] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-876f9epwnw] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-876f9epwnw] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-876f9epwnw] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-876f9epwnw] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-876f9epwnw] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-876f9epwnw] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-876f9epwnw] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_medicos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-wrvahacxu3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-wrvahacxu3 0.3s ease-out; }
@keyframes slideUp-b-wrvahacxu3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-wrvahacxu3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-wrvahacxu3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-wrvahacxu3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-wrvahacxu3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-wrvahacxu3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-wrvahacxu3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-wrvahacxu3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-wrvahacxu3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-wrvahacxu3] { filter: brightness(1.1); }
.btn-outline[b-wrvahacxu3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-wrvahacxu3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-wrvahacxu3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-wrvahacxu3] { filter: brightness(1.1); }
.btn-icon[b-wrvahacxu3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-wrvahacxu3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-wrvahacxu3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-wrvahacxu3] { color: #ef4444; }
.btn-delete:hover[b-wrvahacxu3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-wrvahacxu3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-wrvahacxu3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-wrvahacxu3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-wrvahacxu3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-wrvahacxu3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-wrvahacxu3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-wrvahacxu3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-wrvahacxu3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-wrvahacxu3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-wrvahacxu3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-wrvahacxu3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-wrvahacxu3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-wrvahacxu3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-wrvahacxu3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-wrvahacxu3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-wrvahacxu3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-wrvahacxu3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-wrvahacxu3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-wrvahacxu3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-wrvahacxu3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-wrvahacxu3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-wrvahacxu3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-wrvahacxu3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-wrvahacxu3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-wrvahacxu3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-wrvahacxu3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-wrvahacxu3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-wrvahacxu3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-wrvahacxu3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-wrvahacxu3] { display: block; }
.hide-on-cards[b-wrvahacxu3] { display: none !important; }
.show-on-cards[b-wrvahacxu3] { display: grid; }
.hide-on-grid[b-wrvahacxu3] { display: none !important; }

/* Badges */
.badge[b-wrvahacxu3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-wrvahacxu3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-wrvahacxu3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-wrvahacxu3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-wrvahacxu3] { text-align: center; }
.text-muted[b-wrvahacxu3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-wrvahacxu3], .crud-empty-state[b-wrvahacxu3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-wrvahacxu3] { font-size: 2rem; }
.crud-spinner[b-wrvahacxu3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-wrvahacxu3 0.6s linear infinite; }
.crud-spinner-sm[b-wrvahacxu3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-wrvahacxu3 0.6s linear infinite; }
@keyframes spin-b-wrvahacxu3 { to { transform: rotate(360deg); } }
.spin[b-wrvahacxu3] { animation: spin-b-wrvahacxu3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-wrvahacxu3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-wrvahacxu3 0.15s ease-out; }
.modal-container[b-wrvahacxu3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-wrvahacxu3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-wrvahacxu3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-wrvahacxu3] { max-width: 820px; }
.modal-sm[b-wrvahacxu3] { max-width: 420px; }
@keyframes fadeIn-b-wrvahacxu3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-wrvahacxu3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-wrvahacxu3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-wrvahacxu3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-wrvahacxu3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-wrvahacxu3] { color: #dc2626; }
.modal-close[b-wrvahacxu3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-wrvahacxu3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-wrvahacxu3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-wrvahacxu3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-wrvahacxu3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-wrvahacxu3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-wrvahacxu3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-wrvahacxu3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-wrvahacxu3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-wrvahacxu3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-wrvahacxu3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-wrvahacxu3] { flex: 2; }
.form-group label[b-wrvahacxu3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-wrvahacxu3], .form-group select[b-wrvahacxu3], .form-textarea[b-wrvahacxu3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-wrvahacxu3], .form-group select:focus[b-wrvahacxu3], .form-textarea:focus[b-wrvahacxu3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-wrvahacxu3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-wrvahacxu3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-wrvahacxu3] { flex: 1; display: flex; align-items: center; }
.form-check[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-wrvahacxu3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-wrvahacxu3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-wrvahacxu3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-wrvahacxu3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-wrvahacxu3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-wrvahacxu3] { font-size: 3rem; }
.photo-placeholder span[b-wrvahacxu3] { font-size: 0.78rem; }
.photo-actions[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-wrvahacxu3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-wrvahacxu3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-wrvahacxu3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-wrvahacxu3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-wrvahacxu3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-wrvahacxu3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-wrvahacxu3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-wrvahacxu3] { filter: brightness(1.15); transform: scale(1.05); }
[b-wrvahacxu3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-wrvahacxu3] { padding: 0.75rem; }
    .crud-header[b-wrvahacxu3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-wrvahacxu3] { font-size: 1.1rem; }
    .btn-text[b-wrvahacxu3] { display: none; }
    .form-row[b-wrvahacxu3] { flex-direction: column; }
    .form-row-4[b-wrvahacxu3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-wrvahacxu3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-wrvahacxu3] { max-width: 820px; }
    .modal-body[b-wrvahacxu3] { padding: 0.75rem; }
    .modal-tabs[b-wrvahacxu3] { overflow-x: auto; }
    .modal-tab[b-wrvahacxu3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-wrvahacxu3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-wrvahacxu3] { display: grid !important; }
    .crud-cards-wrapper[b-wrvahacxu3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-wrvahacxu3] { grid-template-columns: 1fr; }
    .card-details[b-wrvahacxu3] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-wrvahacxu3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-wrvahacxu3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-wrvahacxu3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-wrvahacxu3] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-wrvahacxu3] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-wrvahacxu3] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-wrvahacxu3] { flex: 1.6; }
.far-switch[b-wrvahacxu3] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-wrvahacxu3] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-wrvahacxu3] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-wrvahacxu3] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-wrvahacxu3] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-wrvahacxu3] { border-bottom: none; }
.help-section p[b-wrvahacxu3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-wrvahacxu3], .help-section ol[b-wrvahacxu3] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-wrvahacxu3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-wrvahacxu3] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-wrvahacxu3] { color: var(--rg-accent,#2563eb); }
.help-example[b-wrvahacxu3] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-wrvahacxu3] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-wrvahacxu3] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-wrvahacxu3] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-wrvahacxu3] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-wrvahacxu3] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-wrvahacxu3] { background: rgba(37,99,235,0.12); }
.help-steps[b-wrvahacxu3] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-wrvahacxu3] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-wrvahacxu3] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-wrvahacxu3] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-wrvahacxu3] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-wrvahacxu3] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-wrvahacxu3] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-wrvahacxu3] { background: rgba(255,255,255,0.04); }
.help-badge[b-wrvahacxu3] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-wrvahacxu3] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-wrvahacxu3] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-wrvahacxu3] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-wrvahacxu3] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-wrvahacxu3] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-wrvahacxu3] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-wrvahacxu3] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-wrvahacxu3] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_mensajeros.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lzuy5dnqpb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lzuy5dnqpb 0.3s ease-out; }
@keyframes slideUp-b-lzuy5dnqpb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lzuy5dnqpb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lzuy5dnqpb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lzuy5dnqpb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lzuy5dnqpb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lzuy5dnqpb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lzuy5dnqpb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lzuy5dnqpb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lzuy5dnqpb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lzuy5dnqpb] { filter: brightness(1.1); }
.btn-outline[b-lzuy5dnqpb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lzuy5dnqpb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lzuy5dnqpb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lzuy5dnqpb] { filter: brightness(1.1); }
.btn-icon[b-lzuy5dnqpb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lzuy5dnqpb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lzuy5dnqpb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lzuy5dnqpb] { color: #ef4444; }
.btn-delete:hover[b-lzuy5dnqpb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lzuy5dnqpb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lzuy5dnqpb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lzuy5dnqpb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lzuy5dnqpb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lzuy5dnqpb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lzuy5dnqpb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lzuy5dnqpb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lzuy5dnqpb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lzuy5dnqpb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lzuy5dnqpb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lzuy5dnqpb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lzuy5dnqpb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lzuy5dnqpb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lzuy5dnqpb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lzuy5dnqpb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lzuy5dnqpb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lzuy5dnqpb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lzuy5dnqpb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lzuy5dnqpb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lzuy5dnqpb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lzuy5dnqpb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lzuy5dnqpb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lzuy5dnqpb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lzuy5dnqpb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lzuy5dnqpb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lzuy5dnqpb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lzuy5dnqpb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lzuy5dnqpb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lzuy5dnqpb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lzuy5dnqpb] { display: block; }
.hide-on-cards[b-lzuy5dnqpb] { display: none !important; }
.show-on-cards[b-lzuy5dnqpb] { display: grid; }
.hide-on-grid[b-lzuy5dnqpb] { display: none !important; }

/* Badges */
.badge[b-lzuy5dnqpb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lzuy5dnqpb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lzuy5dnqpb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lzuy5dnqpb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lzuy5dnqpb] { text-align: center; }
.text-muted[b-lzuy5dnqpb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lzuy5dnqpb], .crud-empty-state[b-lzuy5dnqpb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lzuy5dnqpb] { font-size: 2rem; }
.crud-spinner[b-lzuy5dnqpb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lzuy5dnqpb 0.6s linear infinite; }
.crud-spinner-sm[b-lzuy5dnqpb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lzuy5dnqpb 0.6s linear infinite; }
@keyframes spin-b-lzuy5dnqpb { to { transform: rotate(360deg); } }
.spin[b-lzuy5dnqpb] { animation: spin-b-lzuy5dnqpb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lzuy5dnqpb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lzuy5dnqpb 0.15s ease-out; }
.modal-container[b-lzuy5dnqpb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lzuy5dnqpb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lzuy5dnqpb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-lzuy5dnqpb] { max-width: 820px; }
.modal-sm[b-lzuy5dnqpb] { max-width: 420px; }
@keyframes fadeIn-b-lzuy5dnqpb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lzuy5dnqpb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lzuy5dnqpb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lzuy5dnqpb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lzuy5dnqpb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lzuy5dnqpb] { color: #dc2626; }
.modal-close[b-lzuy5dnqpb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lzuy5dnqpb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lzuy5dnqpb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lzuy5dnqpb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lzuy5dnqpb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lzuy5dnqpb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lzuy5dnqpb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lzuy5dnqpb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lzuy5dnqpb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lzuy5dnqpb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lzuy5dnqpb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lzuy5dnqpb] { flex: 2; }
.form-group label[b-lzuy5dnqpb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lzuy5dnqpb], .form-group select[b-lzuy5dnqpb], .form-textarea[b-lzuy5dnqpb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lzuy5dnqpb], .form-group select:focus[b-lzuy5dnqpb], .form-textarea:focus[b-lzuy5dnqpb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lzuy5dnqpb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lzuy5dnqpb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lzuy5dnqpb] { flex: 1; display: flex; align-items: center; }
.form-check[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lzuy5dnqpb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lzuy5dnqpb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lzuy5dnqpb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lzuy5dnqpb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lzuy5dnqpb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lzuy5dnqpb] { font-size: 3rem; }
.photo-placeholder span[b-lzuy5dnqpb] { font-size: 0.78rem; }
.photo-actions[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lzuy5dnqpb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-lzuy5dnqpb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lzuy5dnqpb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lzuy5dnqpb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lzuy5dnqpb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lzuy5dnqpb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lzuy5dnqpb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lzuy5dnqpb] { filter: brightness(1.15); transform: scale(1.05); }
[b-lzuy5dnqpb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lzuy5dnqpb] { padding: 0.75rem; }
    .crud-header[b-lzuy5dnqpb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lzuy5dnqpb] { font-size: 1.1rem; }
    .btn-text[b-lzuy5dnqpb] { display: none; }
    .form-row[b-lzuy5dnqpb] { flex-direction: column; }
    .form-row-4[b-lzuy5dnqpb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lzuy5dnqpb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lzuy5dnqpb] { max-width: 820px; }
    .modal-body[b-lzuy5dnqpb] { padding: 0.75rem; }
    .modal-tabs[b-lzuy5dnqpb] { overflow-x: auto; }
    .modal-tab[b-lzuy5dnqpb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lzuy5dnqpb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lzuy5dnqpb] { display: grid !important; }
    .crud-cards-wrapper[b-lzuy5dnqpb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lzuy5dnqpb] { grid-template-columns: 1fr; }
    .card-details[b-lzuy5dnqpb] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-lzuy5dnqpb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lzuy5dnqpb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lzuy5dnqpb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lzuy5dnqpb] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-lzuy5dnqpb] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-lzuy5dnqpb] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-lzuy5dnqpb] { flex: 1.6; }
.far-switch[b-lzuy5dnqpb] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-lzuy5dnqpb] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-lzuy5dnqpb] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-lzuy5dnqpb] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-lzuy5dnqpb] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-lzuy5dnqpb] { border-bottom: none; }
.help-section p[b-lzuy5dnqpb] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-lzuy5dnqpb], .help-section ol[b-lzuy5dnqpb] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-lzuy5dnqpb] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-lzuy5dnqpb] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-lzuy5dnqpb] { color: var(--rg-accent,#2563eb); }
.help-example[b-lzuy5dnqpb] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-lzuy5dnqpb] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-lzuy5dnqpb] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-lzuy5dnqpb] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-lzuy5dnqpb] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-lzuy5dnqpb] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-lzuy5dnqpb] { background: rgba(37,99,235,0.12); }
.help-steps[b-lzuy5dnqpb] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-lzuy5dnqpb] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-lzuy5dnqpb] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-lzuy5dnqpb] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-lzuy5dnqpb] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-lzuy5dnqpb] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-lzuy5dnqpb] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-lzuy5dnqpb] { background: rgba(255,255,255,0.04); }
.help-badge[b-lzuy5dnqpb] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-lzuy5dnqpb] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-lzuy5dnqpb] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-lzuy5dnqpb] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-lzuy5dnqpb] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-lzuy5dnqpb] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-lzuy5dnqpb] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-lzuy5dnqpb] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-lzuy5dnqpb] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_principios.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3wfy8o8gt5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3wfy8o8gt5 0.3s ease-out; }
@keyframes slideUp-b-3wfy8o8gt5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3wfy8o8gt5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3wfy8o8gt5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3wfy8o8gt5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3wfy8o8gt5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3wfy8o8gt5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3wfy8o8gt5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3wfy8o8gt5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3wfy8o8gt5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3wfy8o8gt5] { filter: brightness(1.1); }
.btn-outline[b-3wfy8o8gt5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3wfy8o8gt5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3wfy8o8gt5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3wfy8o8gt5] { filter: brightness(1.1); }
.btn-icon[b-3wfy8o8gt5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3wfy8o8gt5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3wfy8o8gt5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3wfy8o8gt5] { color: #ef4444; }
.btn-delete:hover[b-3wfy8o8gt5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3wfy8o8gt5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3wfy8o8gt5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3wfy8o8gt5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3wfy8o8gt5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3wfy8o8gt5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3wfy8o8gt5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3wfy8o8gt5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3wfy8o8gt5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3wfy8o8gt5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3wfy8o8gt5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3wfy8o8gt5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3wfy8o8gt5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3wfy8o8gt5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3wfy8o8gt5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3wfy8o8gt5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3wfy8o8gt5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3wfy8o8gt5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3wfy8o8gt5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3wfy8o8gt5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3wfy8o8gt5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3wfy8o8gt5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3wfy8o8gt5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3wfy8o8gt5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3wfy8o8gt5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3wfy8o8gt5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3wfy8o8gt5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3wfy8o8gt5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3wfy8o8gt5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3wfy8o8gt5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3wfy8o8gt5] { display: block; }
.hide-on-cards[b-3wfy8o8gt5] { display: none !important; }
.show-on-cards[b-3wfy8o8gt5] { display: grid; }
.hide-on-grid[b-3wfy8o8gt5] { display: none !important; }

/* Badges */
.badge[b-3wfy8o8gt5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3wfy8o8gt5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3wfy8o8gt5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3wfy8o8gt5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3wfy8o8gt5] { text-align: center; }
.text-muted[b-3wfy8o8gt5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3wfy8o8gt5], .crud-empty-state[b-3wfy8o8gt5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3wfy8o8gt5] { font-size: 2rem; }
.crud-spinner[b-3wfy8o8gt5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3wfy8o8gt5 0.6s linear infinite; }
.crud-spinner-sm[b-3wfy8o8gt5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3wfy8o8gt5 0.6s linear infinite; }
@keyframes spin-b-3wfy8o8gt5 { to { transform: rotate(360deg); } }
.spin[b-3wfy8o8gt5] { animation: spin-b-3wfy8o8gt5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3wfy8o8gt5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3wfy8o8gt5 0.15s ease-out; }
.modal-container[b-3wfy8o8gt5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3wfy8o8gt5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3wfy8o8gt5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-3wfy8o8gt5] { max-width: 820px; }
.modal-sm[b-3wfy8o8gt5] { max-width: 420px; }
@keyframes fadeIn-b-3wfy8o8gt5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3wfy8o8gt5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3wfy8o8gt5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3wfy8o8gt5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3wfy8o8gt5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3wfy8o8gt5] { color: #dc2626; }
.modal-close[b-3wfy8o8gt5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3wfy8o8gt5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3wfy8o8gt5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3wfy8o8gt5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3wfy8o8gt5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3wfy8o8gt5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3wfy8o8gt5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3wfy8o8gt5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3wfy8o8gt5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3wfy8o8gt5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3wfy8o8gt5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3wfy8o8gt5] { flex: 2; }
.form-group label[b-3wfy8o8gt5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3wfy8o8gt5], .form-group select[b-3wfy8o8gt5], .form-textarea[b-3wfy8o8gt5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3wfy8o8gt5], .form-group select:focus[b-3wfy8o8gt5], .form-textarea:focus[b-3wfy8o8gt5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3wfy8o8gt5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3wfy8o8gt5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3wfy8o8gt5] { flex: 1; display: flex; align-items: center; }
.form-check[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3wfy8o8gt5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3wfy8o8gt5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3wfy8o8gt5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3wfy8o8gt5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3wfy8o8gt5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3wfy8o8gt5] { font-size: 3rem; }
.photo-placeholder span[b-3wfy8o8gt5] { font-size: 0.78rem; }
.photo-actions[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3wfy8o8gt5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-3wfy8o8gt5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3wfy8o8gt5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3wfy8o8gt5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3wfy8o8gt5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3wfy8o8gt5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3wfy8o8gt5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3wfy8o8gt5] { filter: brightness(1.15); transform: scale(1.05); }
[b-3wfy8o8gt5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3wfy8o8gt5] { padding: 0.75rem; }
    .crud-header[b-3wfy8o8gt5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3wfy8o8gt5] { font-size: 1.1rem; }
    .btn-text[b-3wfy8o8gt5] { display: none; }
    .form-row[b-3wfy8o8gt5] { flex-direction: column; }
    .form-row-4[b-3wfy8o8gt5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3wfy8o8gt5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3wfy8o8gt5] { max-width: 820px; }
    .modal-body[b-3wfy8o8gt5] { padding: 0.75rem; }
    .modal-tabs[b-3wfy8o8gt5] { overflow-x: auto; }
    .modal-tab[b-3wfy8o8gt5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3wfy8o8gt5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3wfy8o8gt5] { display: grid !important; }
    .crud-cards-wrapper[b-3wfy8o8gt5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3wfy8o8gt5] { grid-template-columns: 1fr; }
    .card-details[b-3wfy8o8gt5] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-3wfy8o8gt5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3wfy8o8gt5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3wfy8o8gt5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3wfy8o8gt5] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-3wfy8o8gt5] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-3wfy8o8gt5] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-3wfy8o8gt5] { flex: 1.6; }
.far-switch[b-3wfy8o8gt5] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-3wfy8o8gt5] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-3wfy8o8gt5] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-3wfy8o8gt5] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-3wfy8o8gt5] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-3wfy8o8gt5] { border-bottom: none; }
.help-section p[b-3wfy8o8gt5] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-3wfy8o8gt5], .help-section ol[b-3wfy8o8gt5] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-3wfy8o8gt5] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-3wfy8o8gt5] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-3wfy8o8gt5] { color: var(--rg-accent,#2563eb); }
.help-example[b-3wfy8o8gt5] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-3wfy8o8gt5] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-3wfy8o8gt5] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-3wfy8o8gt5] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-3wfy8o8gt5] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-3wfy8o8gt5] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-3wfy8o8gt5] { background: rgba(37,99,235,0.12); }
.help-steps[b-3wfy8o8gt5] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-3wfy8o8gt5] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-3wfy8o8gt5] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-3wfy8o8gt5] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-3wfy8o8gt5] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-3wfy8o8gt5] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-3wfy8o8gt5] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-3wfy8o8gt5] { background: rgba(255,255,255,0.04); }
.help-badge[b-3wfy8o8gt5] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-3wfy8o8gt5] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-3wfy8o8gt5] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-3wfy8o8gt5] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-3wfy8o8gt5] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-3wfy8o8gt5] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-3wfy8o8gt5] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-3wfy8o8gt5] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-3wfy8o8gt5] { color: #fca5a5; }

/* ── Filtro controlados/OTC ── */
.pa-filtros[b-3wfy8o8gt5] { display:flex; gap:.4rem; flex-wrap:wrap; margin:.2rem 0 .8rem; }
.pa-chip[b-3wfy8o8gt5] { display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; padding:.35rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:1rem; cursor:pointer; transition:all .12s; }
.pa-chip:hover[b-3wfy8o8gt5] { background:var(--rg-bg-hover,#f1f5f9); }
.pa-chip.on[b-3wfy8o8gt5] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_productos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hpy2qpt8j1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hpy2qpt8j1 0.3s ease-out; }
@keyframes slideUp-b-hpy2qpt8j1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hpy2qpt8j1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hpy2qpt8j1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hpy2qpt8j1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hpy2qpt8j1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hpy2qpt8j1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hpy2qpt8j1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hpy2qpt8j1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hpy2qpt8j1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hpy2qpt8j1] { filter: brightness(1.1); }
.btn-outline[b-hpy2qpt8j1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hpy2qpt8j1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hpy2qpt8j1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hpy2qpt8j1] { filter: brightness(1.1); }
.btn-icon[b-hpy2qpt8j1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hpy2qpt8j1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hpy2qpt8j1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hpy2qpt8j1] { color: #ef4444; }
.btn-delete:hover[b-hpy2qpt8j1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hpy2qpt8j1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hpy2qpt8j1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hpy2qpt8j1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hpy2qpt8j1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hpy2qpt8j1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hpy2qpt8j1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hpy2qpt8j1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hpy2qpt8j1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hpy2qpt8j1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hpy2qpt8j1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hpy2qpt8j1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hpy2qpt8j1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hpy2qpt8j1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hpy2qpt8j1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hpy2qpt8j1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hpy2qpt8j1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hpy2qpt8j1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hpy2qpt8j1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hpy2qpt8j1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hpy2qpt8j1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hpy2qpt8j1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hpy2qpt8j1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hpy2qpt8j1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hpy2qpt8j1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hpy2qpt8j1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hpy2qpt8j1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hpy2qpt8j1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hpy2qpt8j1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hpy2qpt8j1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hpy2qpt8j1] { display: block; }
.hide-on-cards[b-hpy2qpt8j1] { display: none !important; }
.show-on-cards[b-hpy2qpt8j1] { display: grid; }
.hide-on-grid[b-hpy2qpt8j1] { display: none !important; }

/* Badges */
.badge[b-hpy2qpt8j1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hpy2qpt8j1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hpy2qpt8j1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hpy2qpt8j1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hpy2qpt8j1] { text-align: center; }
.text-muted[b-hpy2qpt8j1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hpy2qpt8j1], .crud-empty-state[b-hpy2qpt8j1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hpy2qpt8j1] { font-size: 2rem; }
.crud-spinner[b-hpy2qpt8j1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hpy2qpt8j1 0.6s linear infinite; }
.crud-spinner-sm[b-hpy2qpt8j1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hpy2qpt8j1 0.6s linear infinite; }
@keyframes spin-b-hpy2qpt8j1 { to { transform: rotate(360deg); } }
.spin[b-hpy2qpt8j1] { animation: spin-b-hpy2qpt8j1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hpy2qpt8j1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hpy2qpt8j1 0.15s ease-out; }
.modal-container[b-hpy2qpt8j1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hpy2qpt8j1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hpy2qpt8j1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-hpy2qpt8j1] { max-width: 820px; }
.modal-sm[b-hpy2qpt8j1] { max-width: 420px; }
@keyframes fadeIn-b-hpy2qpt8j1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hpy2qpt8j1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hpy2qpt8j1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hpy2qpt8j1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hpy2qpt8j1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hpy2qpt8j1] { color: #dc2626; }
.modal-close[b-hpy2qpt8j1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hpy2qpt8j1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hpy2qpt8j1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hpy2qpt8j1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hpy2qpt8j1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hpy2qpt8j1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hpy2qpt8j1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hpy2qpt8j1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hpy2qpt8j1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hpy2qpt8j1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hpy2qpt8j1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hpy2qpt8j1] { flex: 2; }
.form-group label[b-hpy2qpt8j1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hpy2qpt8j1], .form-group select[b-hpy2qpt8j1], .form-textarea[b-hpy2qpt8j1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hpy2qpt8j1], .form-group select:focus[b-hpy2qpt8j1], .form-textarea:focus[b-hpy2qpt8j1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hpy2qpt8j1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hpy2qpt8j1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hpy2qpt8j1] { flex: 1; display: flex; align-items: center; }
.form-check[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hpy2qpt8j1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hpy2qpt8j1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hpy2qpt8j1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hpy2qpt8j1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hpy2qpt8j1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hpy2qpt8j1] { font-size: 3rem; }
.photo-placeholder span[b-hpy2qpt8j1] { font-size: 0.78rem; }
.photo-actions[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hpy2qpt8j1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-hpy2qpt8j1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hpy2qpt8j1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hpy2qpt8j1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hpy2qpt8j1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hpy2qpt8j1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hpy2qpt8j1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hpy2qpt8j1] { filter: brightness(1.15); transform: scale(1.05); }
[b-hpy2qpt8j1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hpy2qpt8j1] { padding: 0.75rem; }
    .crud-header[b-hpy2qpt8j1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hpy2qpt8j1] { font-size: 1.1rem; }
    .btn-text[b-hpy2qpt8j1] { display: none; }
    .form-row[b-hpy2qpt8j1] { flex-direction: column; }
    .form-row-4[b-hpy2qpt8j1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hpy2qpt8j1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hpy2qpt8j1] { max-width: 820px; }
    .modal-body[b-hpy2qpt8j1] { padding: 0.75rem; }
    .modal-tabs[b-hpy2qpt8j1] { overflow-x: auto; }
    .modal-tab[b-hpy2qpt8j1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hpy2qpt8j1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hpy2qpt8j1] { display: grid !important; }
    .crud-cards-wrapper[b-hpy2qpt8j1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hpy2qpt8j1] { grid-template-columns: 1fr; }
    .card-details[b-hpy2qpt8j1] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-hpy2qpt8j1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hpy2qpt8j1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hpy2qpt8j1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hpy2qpt8j1] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-hpy2qpt8j1] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-hpy2qpt8j1] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-hpy2qpt8j1] { flex: 1.6; }
.far-switch[b-hpy2qpt8j1] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-hpy2qpt8j1] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Productos ── */
.far-section-title[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-primary); text-transform: uppercase; letter-spacing: 0.03em; margin: 1rem 0 0.5rem; padding-bottom: 0.3rem; border-bottom: 1px solid var(--rg-border); }
.far-section-title:first-child[b-hpy2qpt8j1] { margin-top: 0; }
[data-mode="dark"] .far-section-title[b-hpy2qpt8j1] { color: #93c5fd; }
.far-cold[b-hpy2qpt8j1] { background: rgba(56,189,248,0.16) !important; color: #0284c7 !important; }
[data-mode="dark"] .far-cold[b-hpy2qpt8j1] { color: #7dd3fc !important; }
.badge-ctrl[b-hpy2qpt8j1] { background: rgba(234,88,12,0.14); color: #c2410c; border: 1px solid rgba(234,88,12,0.3); padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
[data-mode="dark"] .badge-ctrl[b-hpy2qpt8j1] { color: #fdba74; }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-hpy2qpt8j1] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-hpy2qpt8j1] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-hpy2qpt8j1] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-hpy2qpt8j1] { border-bottom: none; }
.help-section p[b-hpy2qpt8j1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-hpy2qpt8j1], .help-section ol[b-hpy2qpt8j1] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-hpy2qpt8j1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-hpy2qpt8j1] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-hpy2qpt8j1] { color: var(--rg-accent,#2563eb); }
.help-example[b-hpy2qpt8j1] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-hpy2qpt8j1] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-hpy2qpt8j1] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-hpy2qpt8j1] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-hpy2qpt8j1] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-hpy2qpt8j1] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-hpy2qpt8j1] { background: rgba(37,99,235,0.12); }
.help-steps[b-hpy2qpt8j1] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-hpy2qpt8j1] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-hpy2qpt8j1] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-hpy2qpt8j1] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-hpy2qpt8j1] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-hpy2qpt8j1] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-hpy2qpt8j1] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-hpy2qpt8j1] { background: rgba(255,255,255,0.04); }
.help-badge[b-hpy2qpt8j1] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-hpy2qpt8j1] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-hpy2qpt8j1] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-hpy2qpt8j1] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-hpy2qpt8j1] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-hpy2qpt8j1] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-hpy2qpt8j1] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-hpy2qpt8j1] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-hpy2qpt8j1] { color: #fca5a5; }

/* ── Imágenes del producto ── */
.far-img-grid[b-hpy2qpt8j1] { display:flex; gap:1rem; flex-wrap:wrap; margin-top:.5rem; }
.far-img-slot[b-hpy2qpt8j1] { flex:1; min-width:200px; border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.6rem; background:var(--rg-bg-subtle,#f8fafc); display:flex; flex-direction:column; gap:.5rem; }
.far-img-cap[b-hpy2qpt8j1] { font-size:.78rem; font-weight:700; color:var(--rg-text-secondary,#475569); }
.far-img-preview[b-hpy2qpt8j1] { width:100%; height:160px; object-fit:contain; background:#fff; border-radius:.4rem; border:1px solid var(--rg-border,#e2e8f0); }
[data-mode="dark"] .far-img-preview[b-hpy2qpt8j1] { background:#0b1220; }
.far-img-empty[b-hpy2qpt8j1] { width:100%; height:160px; display:flex; align-items:center; justify-content:center; color:var(--rg-text-muted,#94a3b8); font-size:2.4rem; background:var(--rg-bg-input,#fff); border:1px dashed var(--rg-border,#e2e8f0); border-radius:.4rem; }
.far-img-actions[b-hpy2qpt8j1] { display:flex; align-items:center; gap:.4rem; }
.far-img-actions .btn-crud[b-hpy2qpt8j1] { cursor:pointer; }
.far-img-actions .disabled[b-hpy2qpt8j1] { opacity:.6; pointer-events:none; }
.far-img-hint[b-hpy2qpt8j1] { display:flex; align-items:center; gap:.4rem; font-size:.78rem; color:var(--rg-text-muted,#94a3b8); margin-top:.5rem; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Catalogos/Frmfar_proveedores.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-gqozzraeoz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-gqozzraeoz 0.3s ease-out; }
@keyframes slideUp-b-gqozzraeoz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-gqozzraeoz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-gqozzraeoz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-gqozzraeoz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-gqozzraeoz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-gqozzraeoz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-gqozzraeoz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-gqozzraeoz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-gqozzraeoz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gqozzraeoz] { filter: brightness(1.1); }
.btn-outline[b-gqozzraeoz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-gqozzraeoz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-gqozzraeoz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gqozzraeoz] { filter: brightness(1.1); }
.btn-icon[b-gqozzraeoz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-gqozzraeoz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gqozzraeoz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gqozzraeoz] { color: #ef4444; }
.btn-delete:hover[b-gqozzraeoz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-gqozzraeoz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-gqozzraeoz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gqozzraeoz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gqozzraeoz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-gqozzraeoz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gqozzraeoz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-gqozzraeoz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-gqozzraeoz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-gqozzraeoz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-gqozzraeoz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-gqozzraeoz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gqozzraeoz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-gqozzraeoz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-gqozzraeoz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-gqozzraeoz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-gqozzraeoz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-gqozzraeoz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-gqozzraeoz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-gqozzraeoz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-gqozzraeoz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-gqozzraeoz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-gqozzraeoz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-gqozzraeoz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-gqozzraeoz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-gqozzraeoz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-gqozzraeoz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-gqozzraeoz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-gqozzraeoz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-gqozzraeoz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-gqozzraeoz] { display: block; }
.hide-on-cards[b-gqozzraeoz] { display: none !important; }
.show-on-cards[b-gqozzraeoz] { display: grid; }
.hide-on-grid[b-gqozzraeoz] { display: none !important; }

/* Badges */
.badge[b-gqozzraeoz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-gqozzraeoz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gqozzraeoz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-gqozzraeoz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-gqozzraeoz] { text-align: center; }
.text-muted[b-gqozzraeoz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-gqozzraeoz], .crud-empty-state[b-gqozzraeoz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-gqozzraeoz] { font-size: 2rem; }
.crud-spinner[b-gqozzraeoz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-gqozzraeoz 0.6s linear infinite; }
.crud-spinner-sm[b-gqozzraeoz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-gqozzraeoz 0.6s linear infinite; }
@keyframes spin-b-gqozzraeoz { to { transform: rotate(360deg); } }
.spin[b-gqozzraeoz] { animation: spin-b-gqozzraeoz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-gqozzraeoz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-gqozzraeoz 0.15s ease-out; }
.modal-container[b-gqozzraeoz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-gqozzraeoz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-gqozzraeoz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-gqozzraeoz] { max-width: 820px; }
.modal-sm[b-gqozzraeoz] { max-width: 420px; }
@keyframes fadeIn-b-gqozzraeoz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gqozzraeoz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-gqozzraeoz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-gqozzraeoz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-gqozzraeoz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-gqozzraeoz] { color: #dc2626; }
.modal-close[b-gqozzraeoz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-gqozzraeoz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-gqozzraeoz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-gqozzraeoz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-gqozzraeoz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-gqozzraeoz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-gqozzraeoz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-gqozzraeoz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-gqozzraeoz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-gqozzraeoz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-gqozzraeoz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-gqozzraeoz] { flex: 2; }
.form-group label[b-gqozzraeoz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-gqozzraeoz], .form-group select[b-gqozzraeoz], .form-textarea[b-gqozzraeoz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-gqozzraeoz], .form-group select:focus[b-gqozzraeoz], .form-textarea:focus[b-gqozzraeoz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-gqozzraeoz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-gqozzraeoz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-gqozzraeoz] { flex: 1; display: flex; align-items: center; }
.form-check[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-gqozzraeoz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-gqozzraeoz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-gqozzraeoz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-gqozzraeoz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-gqozzraeoz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-gqozzraeoz] { font-size: 3rem; }
.photo-placeholder span[b-gqozzraeoz] { font-size: 0.78rem; }
.photo-actions[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-gqozzraeoz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-gqozzraeoz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-gqozzraeoz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-gqozzraeoz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-gqozzraeoz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-gqozzraeoz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-gqozzraeoz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-gqozzraeoz] { filter: brightness(1.15); transform: scale(1.05); }
[b-gqozzraeoz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-gqozzraeoz] { padding: 0.75rem; }
    .crud-header[b-gqozzraeoz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gqozzraeoz] { font-size: 1.1rem; }
    .btn-text[b-gqozzraeoz] { display: none; }
    .form-row[b-gqozzraeoz] { flex-direction: column; }
    .form-row-4[b-gqozzraeoz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-gqozzraeoz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-gqozzraeoz] { max-width: 820px; }
    .modal-body[b-gqozzraeoz] { padding: 0.75rem; }
    .modal-tabs[b-gqozzraeoz] { overflow-x: auto; }
    .modal-tab[b-gqozzraeoz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-gqozzraeoz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-gqozzraeoz] { display: grid !important; }
    .crud-cards-wrapper[b-gqozzraeoz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-gqozzraeoz] { grid-template-columns: 1fr; }
    .card-details[b-gqozzraeoz] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-gqozzraeoz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-gqozzraeoz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-gqozzraeoz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-gqozzraeoz] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-gqozzraeoz] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-gqozzraeoz] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-gqozzraeoz] { flex: 1.6; }
.far-switch[b-gqozzraeoz] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-gqozzraeoz] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-gqozzraeoz] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-gqozzraeoz] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-gqozzraeoz] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-gqozzraeoz] { border-bottom: none; }
.help-section p[b-gqozzraeoz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-gqozzraeoz], .help-section ol[b-gqozzraeoz] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-gqozzraeoz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-gqozzraeoz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-gqozzraeoz] { color: var(--rg-accent,#2563eb); }
.help-example[b-gqozzraeoz] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-gqozzraeoz] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-gqozzraeoz] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-gqozzraeoz] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-gqozzraeoz] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-gqozzraeoz] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-gqozzraeoz] { background: rgba(37,99,235,0.12); }
.help-steps[b-gqozzraeoz] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-gqozzraeoz] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-gqozzraeoz] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-gqozzraeoz] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-gqozzraeoz] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-gqozzraeoz] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-gqozzraeoz] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-gqozzraeoz] { background: rgba(255,255,255,0.04); }
.help-badge[b-gqozzraeoz] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-gqozzraeoz] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-gqozzraeoz] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-gqozzraeoz] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-gqozzraeoz] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-gqozzraeoz] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-gqozzraeoz] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-gqozzraeoz] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-gqozzraeoz] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Delivery/Frmfar_delivery.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

/* ── Delivery ── */
.dl-ctx[b-rqv4949p89] { display:flex; gap:.75rem; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; margin-bottom:.8rem; }
.dl-tabs[b-rqv4949p89] { display:flex; gap:.3rem; }
.dl-tab[b-rqv4949p89] { display:inline-flex; align-items:center; gap:.35rem; padding:.5rem .8rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.dl-tab.active[b-rqv4949p89] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }
.dl-hint[b-rqv4949p89] { display:flex; gap:.4rem; align-items:flex-start; font-size:.76rem; color:var(--rg-text-secondary,#475569); background:rgba(37,99,235,0.07); border-left:3px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.45rem .6rem; margin:.5rem 0; }
[data-mode="dark"] .dl-hint[b-rqv4949p89] { background:rgba(37,99,235,0.12); }
.dl-evid-head[b-rqv4949p89] { display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-top:.7rem; padding-top:.5rem; border-top:1px solid var(--rg-border,#e2e8f0); }
.dl-evid-head i[b-rqv4949p89] { color:var(--rg-accent,#2563eb); }
.dl-evid-actions[b-rqv4949p89] { display:flex; gap:.3rem; }
.dl-evid-empty[b-rqv4949p89] { font-size:.74rem; color:var(--rg-text-muted,#94a3b8); padding:.4rem 0; }

.crud-container[b-rqv4949p89] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rqv4949p89 0.3s ease-out; }
@keyframes slideUp-b-rqv4949p89 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rqv4949p89] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rqv4949p89] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rqv4949p89] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rqv4949p89] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rqv4949p89] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rqv4949p89] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rqv4949p89] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rqv4949p89] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rqv4949p89] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rqv4949p89] { filter: brightness(1.1); }
.btn-outline[b-rqv4949p89] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rqv4949p89] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rqv4949p89] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rqv4949p89] { filter: brightness(1.1); }
.btn-icon[b-rqv4949p89] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rqv4949p89] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rqv4949p89] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rqv4949p89] { color: #ef4444; }
.btn-delete:hover[b-rqv4949p89] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rqv4949p89] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rqv4949p89] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rqv4949p89] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rqv4949p89] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rqv4949p89] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rqv4949p89] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rqv4949p89] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rqv4949p89] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rqv4949p89] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rqv4949p89] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rqv4949p89] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rqv4949p89] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rqv4949p89] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rqv4949p89] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rqv4949p89] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rqv4949p89] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rqv4949p89] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rqv4949p89] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rqv4949p89] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rqv4949p89] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rqv4949p89] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rqv4949p89] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rqv4949p89] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rqv4949p89] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rqv4949p89] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rqv4949p89] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rqv4949p89] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rqv4949p89] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rqv4949p89] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rqv4949p89] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rqv4949p89] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rqv4949p89] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rqv4949p89] { display: block; }
.hide-on-cards[b-rqv4949p89] { display: none !important; }
.show-on-cards[b-rqv4949p89] { display: grid; }
.hide-on-grid[b-rqv4949p89] { display: none !important; }

/* Badges */
.badge[b-rqv4949p89] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rqv4949p89] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rqv4949p89] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rqv4949p89] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rqv4949p89] { text-align: center; }
.text-muted[b-rqv4949p89] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rqv4949p89], .crud-empty-state[b-rqv4949p89] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rqv4949p89] { font-size: 2rem; }
.crud-spinner[b-rqv4949p89] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rqv4949p89 0.6s linear infinite; }
.crud-spinner-sm[b-rqv4949p89] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rqv4949p89 0.6s linear infinite; }
@keyframes spin-b-rqv4949p89 { to { transform: rotate(360deg); } }
.spin[b-rqv4949p89] { animation: spin-b-rqv4949p89 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rqv4949p89] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rqv4949p89 0.15s ease-out; }
.modal-container[b-rqv4949p89] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rqv4949p89] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rqv4949p89 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-rqv4949p89] { max-width: 820px; }
.modal-sm[b-rqv4949p89] { max-width: 420px; }
@keyframes fadeIn-b-rqv4949p89 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rqv4949p89 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rqv4949p89] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rqv4949p89] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rqv4949p89] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rqv4949p89] { color: #dc2626; }
.modal-close[b-rqv4949p89] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rqv4949p89] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rqv4949p89] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rqv4949p89] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rqv4949p89] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rqv4949p89] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rqv4949p89] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rqv4949p89] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rqv4949p89] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rqv4949p89] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rqv4949p89] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rqv4949p89] { flex: 2; }
.form-group label[b-rqv4949p89] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rqv4949p89], .form-group select[b-rqv4949p89], .form-textarea[b-rqv4949p89] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rqv4949p89], .form-group select:focus[b-rqv4949p89], .form-textarea:focus[b-rqv4949p89] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rqv4949p89] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rqv4949p89] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rqv4949p89] { flex: 1; display: flex; align-items: center; }
.form-check[b-rqv4949p89] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rqv4949p89] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rqv4949p89] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rqv4949p89] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rqv4949p89] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rqv4949p89] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rqv4949p89] { font-size: 3rem; }
.photo-placeholder span[b-rqv4949p89] { font-size: 0.78rem; }
.photo-actions[b-rqv4949p89] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rqv4949p89] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-rqv4949p89] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rqv4949p89] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rqv4949p89] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rqv4949p89] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rqv4949p89] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rqv4949p89] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rqv4949p89] { filter: brightness(1.15); transform: scale(1.05); }
[b-rqv4949p89] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rqv4949p89] { padding: 0.75rem; }
    .crud-header[b-rqv4949p89] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rqv4949p89] { font-size: 1.1rem; }
    .btn-text[b-rqv4949p89] { display: none; }
    .form-row[b-rqv4949p89] { flex-direction: column; }
    .form-row-4[b-rqv4949p89] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rqv4949p89] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rqv4949p89] { max-width: 820px; }
    .modal-body[b-rqv4949p89] { padding: 0.75rem; }
    .modal-tabs[b-rqv4949p89] { overflow-x: auto; }
    .modal-tab[b-rqv4949p89] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rqv4949p89] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rqv4949p89] { display: grid !important; }
    .crud-cards-wrapper[b-rqv4949p89] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rqv4949p89] { grid-template-columns: 1fr; }
    .card-details[b-rqv4949p89] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-rqv4949p89] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rqv4949p89] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rqv4949p89] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rqv4949p89] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-rqv4949p89] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-rqv4949p89] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-rqv4949p89] { flex: 1.6; }
.far-switch[b-rqv4949p89] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-rqv4949p89] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-rqv4949p89] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-rqv4949p89] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-rqv4949p89] { color:#93c5fd; }
.far-cold[b-rqv4949p89] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-rqv4949p89] { color:#7dd3fc !important; }
.badge-warn[b-rqv4949p89] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-rqv4949p89] { color:#fcd34d; }
.badge-func[b-rqv4949p89] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-rqv4949p89] { color:#a5b4fc; }
.far-row-venc td[b-rqv4949p89] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-rqv4949p89] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-rqv4949p89] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-rqv4949p89], .pc-addbar select[b-rqv4949p89] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-rqv4949p89] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-rqv4949p89] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-rqv4949p89] { background:rgba(37,99,235,0.12); }

/* ── Perfil Contable por Documento ── */
.far-input[b-rqv4949p89] { padding:.4rem .55rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; font-size:.82rem; color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-input,#fff); outline:none; width:100%; transition:border-color .15s; }
.far-input:focus[b-rqv4949p89] { border-color:var(--rg-accent,#4f46e5); box-shadow:0 0 0 2px rgba(79,70,229,.15); }
.far-input:disabled[b-rqv4949p89] { background:var(--rg-bg-subtle,#f8fafc); color:var(--rg-text-muted,#94a3b8); }
.far-input-sm[b-rqv4949p89] { padding:.3rem .4rem; font-size:.78rem; }

.far-tot[b-rqv4949p89] { display:inline-flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.5rem; padding:0 .45rem; border-radius:1rem; background:rgba(13,148,136,.14); color:#0d9488; font-weight:700; font-size:.74rem; }
[data-mode="dark"] .far-tot[b-rqv4949p89] { background:rgba(13,148,136,.22); color:#5eead4; }

.btn-sm[b-rqv4949p89] { padding:.32rem .6rem; font-size:.74rem; }

/* selectores de movimiento DEB/CRE */
.mov-deb[b-rqv4949p89] { color:#1d4ed8; font-weight:700; }
.mov-cre[b-rqv4949p89] { color:#b45309; font-weight:700; }
[data-mode="dark"] .mov-deb[b-rqv4949p89] { color:#93c5fd; }
[data-mode="dark"] .mov-cre[b-rqv4949p89] { color:#fcd34d; }

.pc-section-head[b-rqv4949p89] { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin:1.1rem 0 .35rem; }
.pc-section-head .far-section-title[b-rqv4949p89] { margin:0; border:none; padding:0; }

.pc-balance-hint[b-rqv4949p89] { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pc-balance-hint i[b-rqv4949p89] { margin-right:.2rem; }
.pc-hint-note[b-rqv4949p89] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); flex:1; min-width:200px; }

.pc-empty[b-rqv4949p89] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.8rem; border:1px dashed var(--rg-border,#e2e8f0); border-radius:.5rem; }

.pc-lineas td[b-rqv4949p89] { vertical-align:top; }
.pc-cuenta-nom[b-rqv4949p89] { display:flex; align-items:center; gap:.3rem; margin-top:.2rem; font-size:.72rem; color:#0d9488; }
[data-mode="dark"] .pc-cuenta-nom[b-rqv4949p89] { color:#5eead4; }
.pc-cuenta-nom i[b-rqv4949p89] { font-size:.8rem; }

/* ── Contenido del modal de ayuda ── */
.help-icon-header[b-rqv4949p89] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-rqv4949p89] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-rqv4949p89] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-rqv4949p89] { border-bottom:none; }
.help-section p[b-rqv4949p89] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.4rem; }
.help-section ul[b-rqv4949p89] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-rqv4949p89] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.2rem; }
.help-section-title[b-rqv4949p89] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-rqv4949p89] { color:var(--rg-accent,#2563eb); }

/* ── POS ── */
.pos-context[b-rqv4949p89] { display:flex; gap:.75rem; flex-wrap:wrap; align-items:flex-end; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; margin-bottom:.8rem; }
.pos-ctx-field[b-rqv4949p89] { display:flex; flex-direction:column; gap:.2rem; min-width:160px; }
.pos-ctx-field > label[b-rqv4949p89] { font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted,#94a3b8); }
.pos-ctx-grow[b-rqv4949p89] { flex:1; min-width:240px; }
.pos-cliente-ok[b-rqv4949p89] { font-size:.74rem; color:#0d9488; margin-top:.15rem; display:inline-flex; align-items:center; gap:.3rem; }
[data-mode="dark"] .pos-cliente-ok[b-rqv4949p89] { color:#5eead4; }
.pos-modo[b-rqv4949p89] { display:flex; gap:.3rem; }
.pos-modo-btn[b-rqv4949p89] { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.pos-modo-btn.active[b-rqv4949p89] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }

.pos-grid[b-rqv4949p89] { display:grid; grid-template-columns: 1fr 1fr; gap:.8rem; }
@media (max-width: 900px) { .pos-grid[b-rqv4949p89] { grid-template-columns: 1fr; } }
.pos-left[b-rqv4949p89], .pos-right[b-rqv4949p89] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; min-height:300px; }
.pos-panel-head[b-rqv4949p89] { display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.5rem; padding-bottom:.4rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.pos-panel-head i[b-rqv4949p89] { color:var(--rg-accent,#2563eb); }

.pos-empty[b-rqv4949p89] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; padding:2rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.85rem; }
.pos-empty i[b-rqv4949p89] { font-size:1.8rem; }

.pos-cola[b-rqv4949p89] { display:flex; flex-direction:column; gap:.4rem; max-height:calc(100vh - 360px); overflow-y:auto; }
.pos-cola-item[b-rqv4949p89] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .7rem; cursor:pointer; }
.pos-cola-item.active[b-rqv4949p89] { border-color:var(--rg-accent,#2563eb); box-shadow:0 0 0 2px rgba(37,99,235,.15); }
.pos-cola-num[b-rqv4949p89] { font-weight:700; font-size:.84rem; color:var(--rg-text-primary,#1e293b); }
.pos-cola-cli[b-rqv4949p89] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pos-cola-meta[b-rqv4949p89] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }

.pos-prod-list[b-rqv4949p89] { display:flex; flex-direction:column; gap:.35rem; max-height:calc(100vh - 400px); overflow-y:auto; }
.pos-prod-item[b-rqv4949p89] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .65rem; cursor:pointer; }
.pos-prod-item:hover[b-rqv4949p89] { border-color:var(--rg-accent,#2563eb); }
.pos-prod-nom[b-rqv4949p89] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.pos-prod-meta[b-rqv4949p89] { display:flex; gap:.7rem; flex-wrap:wrap; font-size:.72rem; color:var(--rg-text-muted,#94a3b8); margin-top:.15rem; align-items:center; }
.pos-nostock[b-rqv4949p89] { color:#dc2626; font-weight:600; }

.pos-cart[b-rqv4949p89] { overflow-x:auto; }
.pos-cart-table[b-rqv4949p89] { width:100%; }
.pos-cart-table input.far-input-sm[b-rqv4949p89] { width:100%; text-align:right; }

.pos-totales[b-rqv4949p89] { margin-top:.6rem; border-top:1px solid var(--rg-border,#e2e8f0); padding-top:.5rem; }
.pos-totales > div[b-rqv4949p89] { display:flex; justify-content:space-between; font-size:.84rem; color:var(--rg-text-secondary,#475569); padding:.15rem 0; }
.pos-ars[b-rqv4949p89] { color:#0d9488 !important; }
.pos-ars i[b-rqv4949p89] { margin-right:.2rem; }
[data-mode="dark"] .pos-ars[b-rqv4949p89] { color:#5eead4 !important; }
.pos-total-grande[b-rqv4949p89] { font-size:1.05rem !important; color:var(--rg-text-primary,#1e293b) !important; font-weight:700; border-top:1px dashed var(--rg-border,#e2e8f0); margin-top:.25rem; padding-top:.4rem !important; }

.pos-pagos-head[b-rqv4949p89] { margin-top:.8rem; }
.pos-pagos-actions[b-rqv4949p89] { display:flex; gap:.3rem; }
.pos-pago-row[b-rqv4949p89] { display:flex; gap:.4rem; align-items:center; margin-bottom:.35rem; }
.pos-pago-row .far-input-sm[b-rqv4949p89] { flex:1; }
.pos-pago-resumen[b-rqv4949p89] { display:flex; justify-content:space-between; font-size:.8rem; color:var(--rg-text-secondary,#475569); background:var(--rg-bg-subtle,#f8fafc); border-radius:.45rem; padding:.4rem .6rem; margin:.3rem 0 .6rem; }
.pos-pago-resumen.ok[b-rqv4949p89] { color:#0d9488; }
[data-mode="dark"] .pos-pago-resumen.ok[b-rqv4949p89] { color:#5eead4; }
.pos-facturar[b-rqv4949p89] { width:100%; justify-content:center; font-size:.95rem; padding:.7rem; }

/* Evidencia fotográfica */
.pos-evid-head[b-rqv4949p89] { margin-top:.8rem; }
.pos-evid-actions[b-rqv4949p89] { display:flex; gap:.3rem; }
.pos-evid-btn[b-rqv4949p89] { display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; cursor:pointer; font-size:.9rem; }
.pos-evid-btn:hover[b-rqv4949p89] { border-color:var(--rg-accent,#2563eb); color:var(--rg-accent,#2563eb); }
.pos-evid-btn.uploading[b-rqv4949p89] { opacity:.7; pointer-events:none; }
.pos-evid-empty[b-rqv4949p89] { font-size:.76rem; color:var(--rg-text-muted,#94a3b8); padding:.5rem 0; }
.pos-qr[b-rqv4949p89] { display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:.5rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; margin-bottom:.5rem; }
.pos-qr img[b-rqv4949p89] { width:140px; height:140px; }
.pos-qr span[b-rqv4949p89] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.pos-evid-galeria[b-rqv4949p89] { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.5rem; }
.pos-evid-thumb[b-rqv4949p89] { width:54px; height:54px; border-radius:.4rem; overflow:hidden; border:1px solid var(--rg-border,#e2e8f0); }
.pos-evid-thumb img[b-rqv4949p89] { width:100%; height:100%; object-fit:cover; }

/* Modales anidados (envío sobre post-grabado) */
.modal-backdrop-nested[b-rqv4949p89] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-rqv4949p89] { z-index: 2001 !important; }

/* Post-grabado */
.ps-recibo-info[b-rqv4949p89] { display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .75rem; margin-bottom:.5rem; }
.ps-label[b-rqv4949p89] { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-muted,#94a3b8); }
.ps-value[b-rqv4949p89] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.ps-acciones[b-rqv4949p89] { display:flex; flex-direction:column; gap:.5rem; margin-top:.5rem; }
.ps-acciones .btn-crud[b-rqv4949p89] { width:100%; justify-content:center; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Inventario/Frmfar_lotes_stock.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-no044eug83] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-no044eug83 0.3s ease-out; }
@keyframes slideUp-b-no044eug83 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-no044eug83] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-no044eug83] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-no044eug83] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-no044eug83] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-no044eug83] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-no044eug83] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-no044eug83] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-no044eug83] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-no044eug83] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-no044eug83] { filter: brightness(1.1); }
.btn-outline[b-no044eug83] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-no044eug83] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-no044eug83] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-no044eug83] { filter: brightness(1.1); }
.btn-icon[b-no044eug83] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-no044eug83] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-no044eug83] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-no044eug83] { color: #ef4444; }
.btn-delete:hover[b-no044eug83] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-no044eug83] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-no044eug83] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-no044eug83] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-no044eug83] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-no044eug83] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-no044eug83] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-no044eug83] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-no044eug83] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-no044eug83] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-no044eug83] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-no044eug83] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-no044eug83] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-no044eug83] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-no044eug83] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-no044eug83] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-no044eug83] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-no044eug83] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-no044eug83] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-no044eug83] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-no044eug83] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-no044eug83] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-no044eug83] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-no044eug83] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-no044eug83] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-no044eug83] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-no044eug83] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-no044eug83] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-no044eug83] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-no044eug83] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-no044eug83] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-no044eug83] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-no044eug83] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-no044eug83] { display: block; }
.hide-on-cards[b-no044eug83] { display: none !important; }
.show-on-cards[b-no044eug83] { display: grid; }
.hide-on-grid[b-no044eug83] { display: none !important; }

/* Badges */
.badge[b-no044eug83] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-no044eug83] { background: #ecfdf5; color: #065f46; }
.badge-no[b-no044eug83] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-no044eug83] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-no044eug83] { text-align: center; }
.text-muted[b-no044eug83] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-no044eug83], .crud-empty-state[b-no044eug83] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-no044eug83] { font-size: 2rem; }
.crud-spinner[b-no044eug83] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-no044eug83 0.6s linear infinite; }
.crud-spinner-sm[b-no044eug83] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-no044eug83 0.6s linear infinite; }
@keyframes spin-b-no044eug83 { to { transform: rotate(360deg); } }
.spin[b-no044eug83] { animation: spin-b-no044eug83 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-no044eug83] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-no044eug83 0.15s ease-out; }
.modal-container[b-no044eug83] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-no044eug83] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-no044eug83 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-no044eug83] { max-width: 820px; }
.modal-sm[b-no044eug83] { max-width: 420px; }
@keyframes fadeIn-b-no044eug83 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-no044eug83 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-no044eug83] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-no044eug83] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-no044eug83] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-no044eug83] { color: #dc2626; }
.modal-close[b-no044eug83] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-no044eug83] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-no044eug83] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-no044eug83] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-no044eug83] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-no044eug83] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-no044eug83] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-no044eug83] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-no044eug83] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-no044eug83] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-no044eug83] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-no044eug83] { flex: 2; }
.form-group label[b-no044eug83] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-no044eug83], .form-group select[b-no044eug83], .form-textarea[b-no044eug83] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-no044eug83], .form-group select:focus[b-no044eug83], .form-textarea:focus[b-no044eug83] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-no044eug83] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-no044eug83] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-no044eug83] { flex: 1; display: flex; align-items: center; }
.form-check[b-no044eug83] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-no044eug83] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-no044eug83] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-no044eug83] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-no044eug83] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-no044eug83] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-no044eug83] { font-size: 3rem; }
.photo-placeholder span[b-no044eug83] { font-size: 0.78rem; }
.photo-actions[b-no044eug83] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-no044eug83] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-no044eug83] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-no044eug83] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-no044eug83] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-no044eug83] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-no044eug83] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-no044eug83] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-no044eug83] { filter: brightness(1.15); transform: scale(1.05); }
[b-no044eug83] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-no044eug83] { padding: 0.75rem; }
    .crud-header[b-no044eug83] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-no044eug83] { font-size: 1.1rem; }
    .btn-text[b-no044eug83] { display: none; }
    .form-row[b-no044eug83] { flex-direction: column; }
    .form-row-4[b-no044eug83] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-no044eug83] { width: 98%; max-height: 95vh; }
    .modal-lg[b-no044eug83] { max-width: 820px; }
    .modal-body[b-no044eug83] { padding: 0.75rem; }
    .modal-tabs[b-no044eug83] { overflow-x: auto; }
    .modal-tab[b-no044eug83] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-no044eug83] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-no044eug83] { display: grid !important; }
    .crud-cards-wrapper[b-no044eug83] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-no044eug83] { grid-template-columns: 1fr; }
    .card-details[b-no044eug83] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-no044eug83] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-no044eug83] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-no044eug83] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-no044eug83] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-no044eug83] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-no044eug83] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-no044eug83] { flex: 1.6; }
.far-switch[b-no044eug83] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-no044eug83] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-no044eug83] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-no044eug83] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-no044eug83] { color:#93c5fd; }
.far-cold[b-no044eug83] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-no044eug83] { color:#7dd3fc !important; }
.badge-warn[b-no044eug83] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-no044eug83] { color:#fcd34d; }
.badge-func[b-no044eug83] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-no044eug83] { color:#a5b4fc; }
.far-row-venc td[b-no044eug83] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-no044eug83] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-no044eug83] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-no044eug83], .pc-addbar select[b-no044eug83] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-no044eug83] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-no044eug83] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-no044eug83] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-no044eug83] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-no044eug83] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-no044eug83] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-no044eug83] { border-bottom: none; }
.help-section p[b-no044eug83] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-no044eug83], .help-section ol[b-no044eug83] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-no044eug83] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-no044eug83] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-no044eug83] { color: var(--rg-accent,#2563eb); }
.help-example[b-no044eug83] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-no044eug83] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-no044eug83] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-no044eug83] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-no044eug83] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-no044eug83] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-no044eug83] { background: rgba(37,99,235,0.12); }
.help-steps[b-no044eug83] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-no044eug83] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-no044eug83] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-no044eug83] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-no044eug83] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-no044eug83] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-no044eug83] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-no044eug83] { background: rgba(255,255,255,0.04); }
.help-badge[b-no044eug83] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-no044eug83] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-no044eug83] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-no044eug83] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-no044eug83] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-no044eug83] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-no044eug83] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-no044eug83] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-no044eug83] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Inventario/Frmfar_recepcion_compra.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-73czgd6j34] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-73czgd6j34 0.3s ease-out; }
@keyframes slideUp-b-73czgd6j34 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-73czgd6j34] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-73czgd6j34] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-73czgd6j34] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-73czgd6j34] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-73czgd6j34] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-73czgd6j34] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-73czgd6j34] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-73czgd6j34] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-73czgd6j34] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-73czgd6j34] { filter: brightness(1.1); }
.btn-outline[b-73czgd6j34] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-73czgd6j34] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-73czgd6j34] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-73czgd6j34] { filter: brightness(1.1); }
.btn-icon[b-73czgd6j34] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-73czgd6j34] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-73czgd6j34] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-73czgd6j34] { color: #ef4444; }
.btn-delete:hover[b-73czgd6j34] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-73czgd6j34] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-73czgd6j34] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-73czgd6j34] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-73czgd6j34] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-73czgd6j34] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-73czgd6j34] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-73czgd6j34] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-73czgd6j34] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-73czgd6j34] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-73czgd6j34] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-73czgd6j34] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-73czgd6j34] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-73czgd6j34] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-73czgd6j34] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-73czgd6j34] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-73czgd6j34] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-73czgd6j34] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-73czgd6j34] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-73czgd6j34] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-73czgd6j34] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-73czgd6j34] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-73czgd6j34] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-73czgd6j34] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-73czgd6j34] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-73czgd6j34] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-73czgd6j34] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-73czgd6j34] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-73czgd6j34] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-73czgd6j34] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-73czgd6j34] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-73czgd6j34] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-73czgd6j34] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-73czgd6j34] { display: block; }
.hide-on-cards[b-73czgd6j34] { display: none !important; }
.show-on-cards[b-73czgd6j34] { display: grid; }
.hide-on-grid[b-73czgd6j34] { display: none !important; }

/* Badges */
.badge[b-73czgd6j34] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-73czgd6j34] { background: #ecfdf5; color: #065f46; }
.badge-no[b-73czgd6j34] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-73czgd6j34] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-73czgd6j34] { text-align: center; }
.text-muted[b-73czgd6j34] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-73czgd6j34], .crud-empty-state[b-73czgd6j34] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-73czgd6j34] { font-size: 2rem; }
.crud-spinner[b-73czgd6j34] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-73czgd6j34 0.6s linear infinite; }
.crud-spinner-sm[b-73czgd6j34] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-73czgd6j34 0.6s linear infinite; }
@keyframes spin-b-73czgd6j34 { to { transform: rotate(360deg); } }
.spin[b-73czgd6j34] { animation: spin-b-73czgd6j34 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-73czgd6j34] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-73czgd6j34 0.15s ease-out; }
.modal-container[b-73czgd6j34] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-73czgd6j34] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-73czgd6j34 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-73czgd6j34] { max-width: 820px; }
.modal-sm[b-73czgd6j34] { max-width: 420px; }
@keyframes fadeIn-b-73czgd6j34 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-73czgd6j34 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-73czgd6j34] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-73czgd6j34] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-73czgd6j34] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-73czgd6j34] { color: #dc2626; }
.modal-close[b-73czgd6j34] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-73czgd6j34] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-73czgd6j34] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-73czgd6j34] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-73czgd6j34] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-73czgd6j34] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-73czgd6j34] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-73czgd6j34] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-73czgd6j34] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-73czgd6j34] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-73czgd6j34] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-73czgd6j34] { flex: 2; }
.form-group label[b-73czgd6j34] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-73czgd6j34], .form-group select[b-73czgd6j34], .form-textarea[b-73czgd6j34] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-73czgd6j34], .form-group select:focus[b-73czgd6j34], .form-textarea:focus[b-73czgd6j34] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-73czgd6j34] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-73czgd6j34] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-73czgd6j34] { flex: 1; display: flex; align-items: center; }
.form-check[b-73czgd6j34] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-73czgd6j34] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-73czgd6j34] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-73czgd6j34] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-73czgd6j34] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-73czgd6j34] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-73czgd6j34] { font-size: 3rem; }
.photo-placeholder span[b-73czgd6j34] { font-size: 0.78rem; }
.photo-actions[b-73czgd6j34] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-73czgd6j34] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-73czgd6j34] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-73czgd6j34] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-73czgd6j34] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-73czgd6j34] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-73czgd6j34] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-73czgd6j34] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-73czgd6j34] { filter: brightness(1.15); transform: scale(1.05); }
[b-73czgd6j34] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-73czgd6j34] { padding: 0.75rem; }
    .crud-header[b-73czgd6j34] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-73czgd6j34] { font-size: 1.1rem; }
    .btn-text[b-73czgd6j34] { display: none; }
    .form-row[b-73czgd6j34] { flex-direction: column; }
    .form-row-4[b-73czgd6j34] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-73czgd6j34] { width: 98%; max-height: 95vh; }
    .modal-lg[b-73czgd6j34] { max-width: 820px; }
    .modal-body[b-73czgd6j34] { padding: 0.75rem; }
    .modal-tabs[b-73czgd6j34] { overflow-x: auto; }
    .modal-tab[b-73czgd6j34] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-73czgd6j34] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-73czgd6j34] { display: grid !important; }
    .crud-cards-wrapper[b-73czgd6j34] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-73czgd6j34] { grid-template-columns: 1fr; }
    .card-details[b-73czgd6j34] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-73czgd6j34] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-73czgd6j34] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-73czgd6j34] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-73czgd6j34] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-73czgd6j34] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-73czgd6j34] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-73czgd6j34] { flex: 1.6; }
.far-switch[b-73czgd6j34] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-73czgd6j34] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-73czgd6j34] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-73czgd6j34] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-73czgd6j34] { color:#93c5fd; }
.far-cold[b-73czgd6j34] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-73czgd6j34] { color:#7dd3fc !important; }
.badge-warn[b-73czgd6j34] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-73czgd6j34] { color:#fcd34d; }
.badge-func[b-73czgd6j34] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-73czgd6j34] { color:#a5b4fc; }
.far-row-venc td[b-73czgd6j34] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-73czgd6j34] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-73czgd6j34] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-73czgd6j34], .pc-addbar select[b-73czgd6j34] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-73czgd6j34] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-73czgd6j34] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-73czgd6j34] { background:rgba(37,99,235,0.12); }
.pc-empty[b-73czgd6j34] { color: var(--rg-text-muted); font-size: 0.85rem; text-align: center; padding: 1rem; }
.far-tot[b-73czgd6j34] { display: flex; flex-wrap: wrap; gap: 1.2rem; justify-content: flex-end; padding: 0.7rem 0.2rem 0.2rem; font-size: 0.88rem; color: var(--rg-text-secondary); border-top: 1px solid var(--rg-border); margin-top: 0.5rem; }
.far-tot strong[b-73czgd6j34] { color: var(--rg-text-primary); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-73czgd6j34] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-73czgd6j34] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-73czgd6j34] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-73czgd6j34] { border-bottom: none; }
.help-section p[b-73czgd6j34] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-73czgd6j34], .help-section ol[b-73czgd6j34] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-73czgd6j34] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-73czgd6j34] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-73czgd6j34] { color: var(--rg-accent,#2563eb); }
.help-example[b-73czgd6j34] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-73czgd6j34] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-73czgd6j34] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-73czgd6j34] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-73czgd6j34] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-73czgd6j34] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-73czgd6j34] { background: rgba(37,99,235,0.12); }
.help-steps[b-73czgd6j34] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-73czgd6j34] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-73czgd6j34] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-73czgd6j34] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-73czgd6j34] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-73czgd6j34] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-73czgd6j34] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-73czgd6j34] { background: rgba(255,255,255,0.04); }
.help-badge[b-73czgd6j34] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-73czgd6j34] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-73czgd6j34] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-73czgd6j34] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-73czgd6j34] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-73czgd6j34] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-73czgd6j34] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-73czgd6j34] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-73czgd6j34] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Inventario/Frmfar_registro_temperatura.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0cmtqq9x01] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0cmtqq9x01 0.3s ease-out; }
@keyframes slideUp-b-0cmtqq9x01 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0cmtqq9x01] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0cmtqq9x01] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0cmtqq9x01] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0cmtqq9x01] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0cmtqq9x01] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0cmtqq9x01] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0cmtqq9x01] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0cmtqq9x01] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0cmtqq9x01] { filter: brightness(1.1); }
.btn-outline[b-0cmtqq9x01] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0cmtqq9x01] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0cmtqq9x01] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0cmtqq9x01] { filter: brightness(1.1); }
.btn-icon[b-0cmtqq9x01] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0cmtqq9x01] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0cmtqq9x01] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0cmtqq9x01] { color: #ef4444; }
.btn-delete:hover[b-0cmtqq9x01] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0cmtqq9x01] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0cmtqq9x01] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0cmtqq9x01] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0cmtqq9x01] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0cmtqq9x01] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0cmtqq9x01] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0cmtqq9x01] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0cmtqq9x01] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0cmtqq9x01] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0cmtqq9x01] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0cmtqq9x01] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0cmtqq9x01] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0cmtqq9x01] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0cmtqq9x01] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0cmtqq9x01] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0cmtqq9x01] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0cmtqq9x01] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0cmtqq9x01] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0cmtqq9x01] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0cmtqq9x01] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0cmtqq9x01] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0cmtqq9x01] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0cmtqq9x01] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0cmtqq9x01] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0cmtqq9x01] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0cmtqq9x01] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0cmtqq9x01] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0cmtqq9x01] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0cmtqq9x01] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0cmtqq9x01] { display: block; }
.hide-on-cards[b-0cmtqq9x01] { display: none !important; }
.show-on-cards[b-0cmtqq9x01] { display: grid; }
.hide-on-grid[b-0cmtqq9x01] { display: none !important; }

/* Badges */
.badge[b-0cmtqq9x01] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0cmtqq9x01] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0cmtqq9x01] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0cmtqq9x01] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0cmtqq9x01] { text-align: center; }
.text-muted[b-0cmtqq9x01] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0cmtqq9x01], .crud-empty-state[b-0cmtqq9x01] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0cmtqq9x01] { font-size: 2rem; }
.crud-spinner[b-0cmtqq9x01] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0cmtqq9x01 0.6s linear infinite; }
.crud-spinner-sm[b-0cmtqq9x01] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0cmtqq9x01 0.6s linear infinite; }
@keyframes spin-b-0cmtqq9x01 { to { transform: rotate(360deg); } }
.spin[b-0cmtqq9x01] { animation: spin-b-0cmtqq9x01 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0cmtqq9x01] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0cmtqq9x01 0.15s ease-out; }
.modal-container[b-0cmtqq9x01] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0cmtqq9x01] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0cmtqq9x01 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-0cmtqq9x01] { max-width: 820px; }
.modal-sm[b-0cmtqq9x01] { max-width: 420px; }
@keyframes fadeIn-b-0cmtqq9x01 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0cmtqq9x01 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0cmtqq9x01] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0cmtqq9x01] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0cmtqq9x01] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0cmtqq9x01] { color: #dc2626; }
.modal-close[b-0cmtqq9x01] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0cmtqq9x01] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0cmtqq9x01] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0cmtqq9x01] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0cmtqq9x01] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0cmtqq9x01] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0cmtqq9x01] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0cmtqq9x01] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0cmtqq9x01] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0cmtqq9x01] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0cmtqq9x01] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0cmtqq9x01] { flex: 2; }
.form-group label[b-0cmtqq9x01] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0cmtqq9x01], .form-group select[b-0cmtqq9x01], .form-textarea[b-0cmtqq9x01] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0cmtqq9x01], .form-group select:focus[b-0cmtqq9x01], .form-textarea:focus[b-0cmtqq9x01] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0cmtqq9x01] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0cmtqq9x01] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0cmtqq9x01] { flex: 1; display: flex; align-items: center; }
.form-check[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0cmtqq9x01] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0cmtqq9x01] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0cmtqq9x01] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0cmtqq9x01] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0cmtqq9x01] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0cmtqq9x01] { font-size: 3rem; }
.photo-placeholder span[b-0cmtqq9x01] { font-size: 0.78rem; }
.photo-actions[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0cmtqq9x01] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-0cmtqq9x01] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0cmtqq9x01] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0cmtqq9x01] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0cmtqq9x01] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0cmtqq9x01] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0cmtqq9x01] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0cmtqq9x01] { filter: brightness(1.15); transform: scale(1.05); }
[b-0cmtqq9x01] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0cmtqq9x01] { padding: 0.75rem; }
    .crud-header[b-0cmtqq9x01] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0cmtqq9x01] { font-size: 1.1rem; }
    .btn-text[b-0cmtqq9x01] { display: none; }
    .form-row[b-0cmtqq9x01] { flex-direction: column; }
    .form-row-4[b-0cmtqq9x01] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0cmtqq9x01] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0cmtqq9x01] { max-width: 820px; }
    .modal-body[b-0cmtqq9x01] { padding: 0.75rem; }
    .modal-tabs[b-0cmtqq9x01] { overflow-x: auto; }
    .modal-tab[b-0cmtqq9x01] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0cmtqq9x01] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0cmtqq9x01] { display: grid !important; }
    .crud-cards-wrapper[b-0cmtqq9x01] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0cmtqq9x01] { grid-template-columns: 1fr; }
    .card-details[b-0cmtqq9x01] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-0cmtqq9x01] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0cmtqq9x01] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0cmtqq9x01] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0cmtqq9x01] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-0cmtqq9x01] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-0cmtqq9x01] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-0cmtqq9x01] { flex: 1.6; }
.far-switch[b-0cmtqq9x01] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-0cmtqq9x01] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-0cmtqq9x01] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-0cmtqq9x01] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-0cmtqq9x01] { color:#93c5fd; }
.far-cold[b-0cmtqq9x01] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-0cmtqq9x01] { color:#7dd3fc !important; }
.badge-warn[b-0cmtqq9x01] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-0cmtqq9x01] { color:#fcd34d; }
.badge-func[b-0cmtqq9x01] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-0cmtqq9x01] { color:#a5b4fc; }
.far-row-venc td[b-0cmtqq9x01] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-0cmtqq9x01] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-0cmtqq9x01] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-0cmtqq9x01], .pc-addbar select[b-0cmtqq9x01] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-0cmtqq9x01] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-0cmtqq9x01] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-0cmtqq9x01] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-0cmtqq9x01] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-0cmtqq9x01] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-0cmtqq9x01] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-0cmtqq9x01] { border-bottom: none; }
.help-section p[b-0cmtqq9x01] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-0cmtqq9x01], .help-section ol[b-0cmtqq9x01] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-0cmtqq9x01] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-0cmtqq9x01] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-0cmtqq9x01] { color: var(--rg-accent,#2563eb); }
.help-example[b-0cmtqq9x01] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-0cmtqq9x01] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-0cmtqq9x01] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-0cmtqq9x01] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-0cmtqq9x01] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-0cmtqq9x01] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-0cmtqq9x01] { background: rgba(37,99,235,0.12); }
.help-steps[b-0cmtqq9x01] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-0cmtqq9x01] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-0cmtqq9x01] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-0cmtqq9x01] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-0cmtqq9x01] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-0cmtqq9x01] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-0cmtqq9x01] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-0cmtqq9x01] { background: rgba(255,255,255,0.04); }
.help-badge[b-0cmtqq9x01] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-0cmtqq9x01] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-0cmtqq9x01] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-0cmtqq9x01] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-0cmtqq9x01] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-0cmtqq9x01] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-0cmtqq9x01] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-0cmtqq9x01] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-0cmtqq9x01] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_config_sucursal.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fbx8sqx3ox] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fbx8sqx3ox 0.3s ease-out; }
@keyframes slideUp-b-fbx8sqx3ox { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fbx8sqx3ox] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fbx8sqx3ox] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fbx8sqx3ox] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fbx8sqx3ox] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fbx8sqx3ox] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fbx8sqx3ox] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fbx8sqx3ox] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fbx8sqx3ox] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fbx8sqx3ox] { filter: brightness(1.1); }
.btn-outline[b-fbx8sqx3ox] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fbx8sqx3ox] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fbx8sqx3ox] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fbx8sqx3ox] { filter: brightness(1.1); }
.btn-icon[b-fbx8sqx3ox] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fbx8sqx3ox] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fbx8sqx3ox] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fbx8sqx3ox] { color: #ef4444; }
.btn-delete:hover[b-fbx8sqx3ox] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fbx8sqx3ox] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fbx8sqx3ox] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fbx8sqx3ox] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fbx8sqx3ox] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fbx8sqx3ox] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fbx8sqx3ox] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fbx8sqx3ox] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fbx8sqx3ox] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fbx8sqx3ox] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fbx8sqx3ox] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fbx8sqx3ox] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fbx8sqx3ox] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fbx8sqx3ox] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fbx8sqx3ox] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fbx8sqx3ox] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fbx8sqx3ox] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fbx8sqx3ox] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fbx8sqx3ox] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fbx8sqx3ox] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fbx8sqx3ox] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fbx8sqx3ox] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fbx8sqx3ox] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fbx8sqx3ox] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fbx8sqx3ox] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fbx8sqx3ox] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fbx8sqx3ox] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fbx8sqx3ox] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fbx8sqx3ox] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fbx8sqx3ox] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fbx8sqx3ox] { display: block; }
.hide-on-cards[b-fbx8sqx3ox] { display: none !important; }
.show-on-cards[b-fbx8sqx3ox] { display: grid; }
.hide-on-grid[b-fbx8sqx3ox] { display: none !important; }

/* Badges */
.badge[b-fbx8sqx3ox] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fbx8sqx3ox] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fbx8sqx3ox] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fbx8sqx3ox] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fbx8sqx3ox] { text-align: center; }
.text-muted[b-fbx8sqx3ox] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fbx8sqx3ox], .crud-empty-state[b-fbx8sqx3ox] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fbx8sqx3ox] { font-size: 2rem; }
.crud-spinner[b-fbx8sqx3ox] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fbx8sqx3ox 0.6s linear infinite; }
.crud-spinner-sm[b-fbx8sqx3ox] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fbx8sqx3ox 0.6s linear infinite; }
@keyframes spin-b-fbx8sqx3ox { to { transform: rotate(360deg); } }
.spin[b-fbx8sqx3ox] { animation: spin-b-fbx8sqx3ox 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fbx8sqx3ox] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fbx8sqx3ox 0.15s ease-out; }
.modal-container[b-fbx8sqx3ox] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fbx8sqx3ox] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fbx8sqx3ox 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-fbx8sqx3ox] { max-width: 820px; }
.modal-sm[b-fbx8sqx3ox] { max-width: 420px; }
@keyframes fadeIn-b-fbx8sqx3ox { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fbx8sqx3ox { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fbx8sqx3ox] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fbx8sqx3ox] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fbx8sqx3ox] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fbx8sqx3ox] { color: #dc2626; }
.modal-close[b-fbx8sqx3ox] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fbx8sqx3ox] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fbx8sqx3ox] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fbx8sqx3ox] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fbx8sqx3ox] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fbx8sqx3ox] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fbx8sqx3ox] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fbx8sqx3ox] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fbx8sqx3ox] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fbx8sqx3ox] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fbx8sqx3ox] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fbx8sqx3ox] { flex: 2; }
.form-group label[b-fbx8sqx3ox] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fbx8sqx3ox], .form-group select[b-fbx8sqx3ox], .form-textarea[b-fbx8sqx3ox] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fbx8sqx3ox], .form-group select:focus[b-fbx8sqx3ox], .form-textarea:focus[b-fbx8sqx3ox] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fbx8sqx3ox] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fbx8sqx3ox] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fbx8sqx3ox] { flex: 1; display: flex; align-items: center; }
.form-check[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fbx8sqx3ox] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fbx8sqx3ox] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fbx8sqx3ox] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fbx8sqx3ox] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fbx8sqx3ox] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fbx8sqx3ox] { font-size: 3rem; }
.photo-placeholder span[b-fbx8sqx3ox] { font-size: 0.78rem; }
.photo-actions[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fbx8sqx3ox] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-fbx8sqx3ox] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fbx8sqx3ox] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fbx8sqx3ox] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fbx8sqx3ox] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fbx8sqx3ox] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fbx8sqx3ox] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fbx8sqx3ox] { filter: brightness(1.15); transform: scale(1.05); }
[b-fbx8sqx3ox] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fbx8sqx3ox] { padding: 0.75rem; }
    .crud-header[b-fbx8sqx3ox] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fbx8sqx3ox] { font-size: 1.1rem; }
    .btn-text[b-fbx8sqx3ox] { display: none; }
    .form-row[b-fbx8sqx3ox] { flex-direction: column; }
    .form-row-4[b-fbx8sqx3ox] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fbx8sqx3ox] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fbx8sqx3ox] { max-width: 820px; }
    .modal-body[b-fbx8sqx3ox] { padding: 0.75rem; }
    .modal-tabs[b-fbx8sqx3ox] { overflow-x: auto; }
    .modal-tab[b-fbx8sqx3ox] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fbx8sqx3ox] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fbx8sqx3ox] { display: grid !important; }
    .crud-cards-wrapper[b-fbx8sqx3ox] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fbx8sqx3ox] { grid-template-columns: 1fr; }
    .card-details[b-fbx8sqx3ox] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-fbx8sqx3ox] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fbx8sqx3ox] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fbx8sqx3ox] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fbx8sqx3ox] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-fbx8sqx3ox] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-fbx8sqx3ox] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-fbx8sqx3ox] { flex: 1.6; }
.far-switch[b-fbx8sqx3ox] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-fbx8sqx3ox] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-fbx8sqx3ox] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-fbx8sqx3ox] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-fbx8sqx3ox] { color:#93c5fd; }
.far-cold[b-fbx8sqx3ox] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-fbx8sqx3ox] { color:#7dd3fc !important; }
.badge-warn[b-fbx8sqx3ox] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-fbx8sqx3ox] { color:#fcd34d; }
.badge-func[b-fbx8sqx3ox] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-fbx8sqx3ox] { color:#a5b4fc; }
.far-row-venc td[b-fbx8sqx3ox] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-fbx8sqx3ox] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-fbx8sqx3ox] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-fbx8sqx3ox], .pc-addbar select[b-fbx8sqx3ox] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-fbx8sqx3ox] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-fbx8sqx3ox] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-fbx8sqx3ox] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-fbx8sqx3ox] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-fbx8sqx3ox] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-fbx8sqx3ox] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-fbx8sqx3ox] { border-bottom: none; }
.help-section p[b-fbx8sqx3ox] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-fbx8sqx3ox], .help-section ol[b-fbx8sqx3ox] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-fbx8sqx3ox] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-fbx8sqx3ox] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-fbx8sqx3ox] { color: var(--rg-accent,#2563eb); }
.help-example[b-fbx8sqx3ox] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-fbx8sqx3ox] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-fbx8sqx3ox] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-fbx8sqx3ox] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-fbx8sqx3ox] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-fbx8sqx3ox] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-fbx8sqx3ox] { background: rgba(37,99,235,0.12); }
.help-steps[b-fbx8sqx3ox] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-fbx8sqx3ox] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-fbx8sqx3ox] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-fbx8sqx3ox] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-fbx8sqx3ox] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-fbx8sqx3ox] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-fbx8sqx3ox] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-fbx8sqx3ox] { background: rgba(255,255,255,0.04); }
.help-badge[b-fbx8sqx3ox] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-fbx8sqx3ox] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-fbx8sqx3ox] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-fbx8sqx3ox] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-fbx8sqx3ox] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-fbx8sqx3ox] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-fbx8sqx3ox] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-fbx8sqx3ox] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-fbx8sqx3ox] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_descuentos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9lxp7s7h7w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9lxp7s7h7w 0.3s ease-out; }
@keyframes slideUp-b-9lxp7s7h7w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9lxp7s7h7w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9lxp7s7h7w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9lxp7s7h7w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9lxp7s7h7w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9lxp7s7h7w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9lxp7s7h7w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9lxp7s7h7w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9lxp7s7h7w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9lxp7s7h7w] { filter: brightness(1.1); }
.btn-outline[b-9lxp7s7h7w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9lxp7s7h7w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9lxp7s7h7w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9lxp7s7h7w] { filter: brightness(1.1); }
.btn-icon[b-9lxp7s7h7w] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9lxp7s7h7w] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9lxp7s7h7w] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9lxp7s7h7w] { color: #ef4444; }
.btn-delete:hover[b-9lxp7s7h7w] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9lxp7s7h7w] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9lxp7s7h7w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9lxp7s7h7w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9lxp7s7h7w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9lxp7s7h7w] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9lxp7s7h7w] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9lxp7s7h7w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9lxp7s7h7w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9lxp7s7h7w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9lxp7s7h7w] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9lxp7s7h7w] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9lxp7s7h7w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9lxp7s7h7w] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9lxp7s7h7w] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9lxp7s7h7w] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9lxp7s7h7w] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9lxp7s7h7w] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9lxp7s7h7w] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9lxp7s7h7w] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9lxp7s7h7w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9lxp7s7h7w] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9lxp7s7h7w] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9lxp7s7h7w] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9lxp7s7h7w] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9lxp7s7h7w] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9lxp7s7h7w] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9lxp7s7h7w] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9lxp7s7h7w] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9lxp7s7h7w] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9lxp7s7h7w] { display: block; }
.hide-on-cards[b-9lxp7s7h7w] { display: none !important; }
.show-on-cards[b-9lxp7s7h7w] { display: grid; }
.hide-on-grid[b-9lxp7s7h7w] { display: none !important; }

/* Badges */
.badge[b-9lxp7s7h7w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9lxp7s7h7w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9lxp7s7h7w] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9lxp7s7h7w] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9lxp7s7h7w] { text-align: center; }
.text-muted[b-9lxp7s7h7w] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9lxp7s7h7w], .crud-empty-state[b-9lxp7s7h7w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9lxp7s7h7w] { font-size: 2rem; }
.crud-spinner[b-9lxp7s7h7w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9lxp7s7h7w 0.6s linear infinite; }
.crud-spinner-sm[b-9lxp7s7h7w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9lxp7s7h7w 0.6s linear infinite; }
@keyframes spin-b-9lxp7s7h7w { to { transform: rotate(360deg); } }
.spin[b-9lxp7s7h7w] { animation: spin-b-9lxp7s7h7w 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9lxp7s7h7w] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9lxp7s7h7w 0.15s ease-out; }
.modal-container[b-9lxp7s7h7w] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9lxp7s7h7w] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9lxp7s7h7w 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-9lxp7s7h7w] { max-width: 820px; }
.modal-sm[b-9lxp7s7h7w] { max-width: 420px; }
@keyframes fadeIn-b-9lxp7s7h7w { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9lxp7s7h7w { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9lxp7s7h7w] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9lxp7s7h7w] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9lxp7s7h7w] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9lxp7s7h7w] { color: #dc2626; }
.modal-close[b-9lxp7s7h7w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9lxp7s7h7w] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9lxp7s7h7w] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9lxp7s7h7w] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9lxp7s7h7w] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9lxp7s7h7w] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9lxp7s7h7w] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9lxp7s7h7w] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9lxp7s7h7w] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9lxp7s7h7w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9lxp7s7h7w] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9lxp7s7h7w] { flex: 2; }
.form-group label[b-9lxp7s7h7w] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9lxp7s7h7w], .form-group select[b-9lxp7s7h7w], .form-textarea[b-9lxp7s7h7w] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9lxp7s7h7w], .form-group select:focus[b-9lxp7s7h7w], .form-textarea:focus[b-9lxp7s7h7w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9lxp7s7h7w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9lxp7s7h7w] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9lxp7s7h7w] { flex: 1; display: flex; align-items: center; }
.form-check[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9lxp7s7h7w] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9lxp7s7h7w] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9lxp7s7h7w] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9lxp7s7h7w] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9lxp7s7h7w] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9lxp7s7h7w] { font-size: 3rem; }
.photo-placeholder span[b-9lxp7s7h7w] { font-size: 0.78rem; }
.photo-actions[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9lxp7s7h7w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-9lxp7s7h7w] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9lxp7s7h7w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9lxp7s7h7w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9lxp7s7h7w] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9lxp7s7h7w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9lxp7s7h7w] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9lxp7s7h7w] { filter: brightness(1.15); transform: scale(1.05); }
[b-9lxp7s7h7w] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9lxp7s7h7w] { padding: 0.75rem; }
    .crud-header[b-9lxp7s7h7w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9lxp7s7h7w] { font-size: 1.1rem; }
    .btn-text[b-9lxp7s7h7w] { display: none; }
    .form-row[b-9lxp7s7h7w] { flex-direction: column; }
    .form-row-4[b-9lxp7s7h7w] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9lxp7s7h7w] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9lxp7s7h7w] { max-width: 820px; }
    .modal-body[b-9lxp7s7h7w] { padding: 0.75rem; }
    .modal-tabs[b-9lxp7s7h7w] { overflow-x: auto; }
    .modal-tab[b-9lxp7s7h7w] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9lxp7s7h7w] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9lxp7s7h7w] { display: grid !important; }
    .crud-cards-wrapper[b-9lxp7s7h7w] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9lxp7s7h7w] { grid-template-columns: 1fr; }
    .card-details[b-9lxp7s7h7w] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-9lxp7s7h7w] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9lxp7s7h7w] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9lxp7s7h7w] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9lxp7s7h7w] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-9lxp7s7h7w] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-9lxp7s7h7w] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-9lxp7s7h7w] { flex: 1.6; }
.far-switch[b-9lxp7s7h7w] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-9lxp7s7h7w] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-9lxp7s7h7w] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-9lxp7s7h7w] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-9lxp7s7h7w] { color:#93c5fd; }
.far-cold[b-9lxp7s7h7w] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-9lxp7s7h7w] { color:#7dd3fc !important; }
.badge-warn[b-9lxp7s7h7w] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-9lxp7s7h7w] { color:#fcd34d; }
.badge-func[b-9lxp7s7h7w] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-9lxp7s7h7w] { color:#a5b4fc; }
.far-row-venc td[b-9lxp7s7h7w] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-9lxp7s7h7w] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-9lxp7s7h7w] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-9lxp7s7h7w], .pc-addbar select[b-9lxp7s7h7w] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-9lxp7s7h7w] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-9lxp7s7h7w] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-9lxp7s7h7w] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-9lxp7s7h7w] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-9lxp7s7h7w] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-9lxp7s7h7w] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-9lxp7s7h7w] { border-bottom: none; }
.help-section p[b-9lxp7s7h7w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-9lxp7s7h7w], .help-section ol[b-9lxp7s7h7w] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-9lxp7s7h7w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-9lxp7s7h7w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-9lxp7s7h7w] { color: var(--rg-accent,#2563eb); }
.help-example[b-9lxp7s7h7w] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-9lxp7s7h7w] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-9lxp7s7h7w] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-9lxp7s7h7w] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-9lxp7s7h7w] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-9lxp7s7h7w] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-9lxp7s7h7w] { background: rgba(37,99,235,0.12); }
.help-steps[b-9lxp7s7h7w] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-9lxp7s7h7w] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-9lxp7s7h7w] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-9lxp7s7h7w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-9lxp7s7h7w] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-9lxp7s7h7w] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-9lxp7s7h7w] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-9lxp7s7h7w] { background: rgba(255,255,255,0.04); }
.help-badge[b-9lxp7s7h7w] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-9lxp7s7h7w] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-9lxp7s7h7w] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-9lxp7s7h7w] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-9lxp7s7h7w] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-9lxp7s7h7w] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-9lxp7s7h7w] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-9lxp7s7h7w] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-9lxp7s7h7w] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_facturas.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-a9yrzgzvfg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-a9yrzgzvfg 0.3s ease-out; }
@keyframes slideUp-b-a9yrzgzvfg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-a9yrzgzvfg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-a9yrzgzvfg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-a9yrzgzvfg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-a9yrzgzvfg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-a9yrzgzvfg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-a9yrzgzvfg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-a9yrzgzvfg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-a9yrzgzvfg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-a9yrzgzvfg] { filter: brightness(1.1); }
.btn-outline[b-a9yrzgzvfg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-a9yrzgzvfg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-a9yrzgzvfg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-a9yrzgzvfg] { filter: brightness(1.1); }
.btn-icon[b-a9yrzgzvfg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-a9yrzgzvfg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-a9yrzgzvfg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-a9yrzgzvfg] { color: #ef4444; }
.btn-delete:hover[b-a9yrzgzvfg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-a9yrzgzvfg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-a9yrzgzvfg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-a9yrzgzvfg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-a9yrzgzvfg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-a9yrzgzvfg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-a9yrzgzvfg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-a9yrzgzvfg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-a9yrzgzvfg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-a9yrzgzvfg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-a9yrzgzvfg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-a9yrzgzvfg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-a9yrzgzvfg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-a9yrzgzvfg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-a9yrzgzvfg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-a9yrzgzvfg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-a9yrzgzvfg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-a9yrzgzvfg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-a9yrzgzvfg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-a9yrzgzvfg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-a9yrzgzvfg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-a9yrzgzvfg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-a9yrzgzvfg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-a9yrzgzvfg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-a9yrzgzvfg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-a9yrzgzvfg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-a9yrzgzvfg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-a9yrzgzvfg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-a9yrzgzvfg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-a9yrzgzvfg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-a9yrzgzvfg] { display: block; }
.hide-on-cards[b-a9yrzgzvfg] { display: none !important; }
.show-on-cards[b-a9yrzgzvfg] { display: grid; }
.hide-on-grid[b-a9yrzgzvfg] { display: none !important; }

/* Badges */
.badge[b-a9yrzgzvfg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-a9yrzgzvfg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-a9yrzgzvfg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-a9yrzgzvfg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-a9yrzgzvfg] { text-align: center; }
.text-muted[b-a9yrzgzvfg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-a9yrzgzvfg], .crud-empty-state[b-a9yrzgzvfg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-a9yrzgzvfg] { font-size: 2rem; }
.crud-spinner[b-a9yrzgzvfg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-a9yrzgzvfg 0.6s linear infinite; }
.crud-spinner-sm[b-a9yrzgzvfg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-a9yrzgzvfg 0.6s linear infinite; }
@keyframes spin-b-a9yrzgzvfg { to { transform: rotate(360deg); } }
.spin[b-a9yrzgzvfg] { animation: spin-b-a9yrzgzvfg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-a9yrzgzvfg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-a9yrzgzvfg 0.15s ease-out; }
.modal-container[b-a9yrzgzvfg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-a9yrzgzvfg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-a9yrzgzvfg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-a9yrzgzvfg] { max-width: 820px; }
.modal-sm[b-a9yrzgzvfg] { max-width: 420px; }
@keyframes fadeIn-b-a9yrzgzvfg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-a9yrzgzvfg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-a9yrzgzvfg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-a9yrzgzvfg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-a9yrzgzvfg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-a9yrzgzvfg] { color: #dc2626; }
.modal-close[b-a9yrzgzvfg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-a9yrzgzvfg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-a9yrzgzvfg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-a9yrzgzvfg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-a9yrzgzvfg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-a9yrzgzvfg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-a9yrzgzvfg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-a9yrzgzvfg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-a9yrzgzvfg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-a9yrzgzvfg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-a9yrzgzvfg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-a9yrzgzvfg] { flex: 2; }
.form-group label[b-a9yrzgzvfg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-a9yrzgzvfg], .form-group select[b-a9yrzgzvfg], .form-textarea[b-a9yrzgzvfg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-a9yrzgzvfg], .form-group select:focus[b-a9yrzgzvfg], .form-textarea:focus[b-a9yrzgzvfg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-a9yrzgzvfg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-a9yrzgzvfg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-a9yrzgzvfg] { flex: 1; display: flex; align-items: center; }
.form-check[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-a9yrzgzvfg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-a9yrzgzvfg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-a9yrzgzvfg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-a9yrzgzvfg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-a9yrzgzvfg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-a9yrzgzvfg] { font-size: 3rem; }
.photo-placeholder span[b-a9yrzgzvfg] { font-size: 0.78rem; }
.photo-actions[b-a9yrzgzvfg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-a9yrzgzvfg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-a9yrzgzvfg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-a9yrzgzvfg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-a9yrzgzvfg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-a9yrzgzvfg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-a9yrzgzvfg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-a9yrzgzvfg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-a9yrzgzvfg] { filter: brightness(1.15); transform: scale(1.05); }
[b-a9yrzgzvfg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-a9yrzgzvfg] { padding: 0.75rem; }
    .crud-header[b-a9yrzgzvfg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-a9yrzgzvfg] { font-size: 1.1rem; }
    .btn-text[b-a9yrzgzvfg] { display: none; }
    .form-row[b-a9yrzgzvfg] { flex-direction: column; }
    .form-row-4[b-a9yrzgzvfg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-a9yrzgzvfg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-a9yrzgzvfg] { max-width: 820px; }
    .modal-body[b-a9yrzgzvfg] { padding: 0.75rem; }
    .modal-tabs[b-a9yrzgzvfg] { overflow-x: auto; }
    .modal-tab[b-a9yrzgzvfg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-a9yrzgzvfg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-a9yrzgzvfg] { display: grid !important; }
    .crud-cards-wrapper[b-a9yrzgzvfg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-a9yrzgzvfg] { grid-template-columns: 1fr; }
    .card-details[b-a9yrzgzvfg] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-a9yrzgzvfg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-a9yrzgzvfg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-a9yrzgzvfg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-a9yrzgzvfg] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-a9yrzgzvfg] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-a9yrzgzvfg] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-a9yrzgzvfg] { flex: 1.6; }
.far-switch[b-a9yrzgzvfg] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-a9yrzgzvfg] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-a9yrzgzvfg] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-a9yrzgzvfg] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-a9yrzgzvfg] { color:#93c5fd; }
.far-cold[b-a9yrzgzvfg] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-a9yrzgzvfg] { color:#7dd3fc !important; }
.badge-warn[b-a9yrzgzvfg] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-a9yrzgzvfg] { color:#fcd34d; }
.badge-func[b-a9yrzgzvfg] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-a9yrzgzvfg] { color:#a5b4fc; }
.far-row-venc td[b-a9yrzgzvfg] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-a9yrzgzvfg] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-a9yrzgzvfg] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-a9yrzgzvfg], .pc-addbar select[b-a9yrzgzvfg] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-a9yrzgzvfg] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-a9yrzgzvfg] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-a9yrzgzvfg] { background:rgba(37,99,235,0.12); }

/* ── Perfil Contable por Documento ── */
.far-input[b-a9yrzgzvfg] { padding:.4rem .55rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; font-size:.82rem; color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-input,#fff); outline:none; width:100%; transition:border-color .15s; }
.far-input:focus[b-a9yrzgzvfg] { border-color:var(--rg-accent,#4f46e5); box-shadow:0 0 0 2px rgba(79,70,229,.15); }
.far-input:disabled[b-a9yrzgzvfg] { background:var(--rg-bg-subtle,#f8fafc); color:var(--rg-text-muted,#94a3b8); }
.far-input-sm[b-a9yrzgzvfg] { padding:.3rem .4rem; font-size:.78rem; }

.far-tot[b-a9yrzgzvfg] { display:inline-flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.5rem; padding:0 .45rem; border-radius:1rem; background:rgba(13,148,136,.14); color:#0d9488; font-weight:700; font-size:.74rem; }
[data-mode="dark"] .far-tot[b-a9yrzgzvfg] { background:rgba(13,148,136,.22); color:#5eead4; }

.btn-sm[b-a9yrzgzvfg] { padding:.32rem .6rem; font-size:.74rem; }

/* selectores de movimiento DEB/CRE */
.mov-deb[b-a9yrzgzvfg] { color:#1d4ed8; font-weight:700; }
.mov-cre[b-a9yrzgzvfg] { color:#b45309; font-weight:700; }
[data-mode="dark"] .mov-deb[b-a9yrzgzvfg] { color:#93c5fd; }
[data-mode="dark"] .mov-cre[b-a9yrzgzvfg] { color:#fcd34d; }

.pc-section-head[b-a9yrzgzvfg] { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin:1.1rem 0 .35rem; }
.pc-section-head .far-section-title[b-a9yrzgzvfg] { margin:0; border:none; padding:0; }

.pc-balance-hint[b-a9yrzgzvfg] { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pc-balance-hint i[b-a9yrzgzvfg] { margin-right:.2rem; }
.pc-hint-note[b-a9yrzgzvfg] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); flex:1; min-width:200px; }

.pc-empty[b-a9yrzgzvfg] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.8rem; border:1px dashed var(--rg-border,#e2e8f0); border-radius:.5rem; }

.pc-lineas td[b-a9yrzgzvfg] { vertical-align:top; }
.pc-cuenta-nom[b-a9yrzgzvfg] { display:flex; align-items:center; gap:.3rem; margin-top:.2rem; font-size:.72rem; color:#0d9488; }
[data-mode="dark"] .pc-cuenta-nom[b-a9yrzgzvfg] { color:#5eead4; }
.pc-cuenta-nom i[b-a9yrzgzvfg] { font-size:.8rem; }

/* ── Contenido del modal de ayuda ── */
.help-icon-header[b-a9yrzgzvfg] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-a9yrzgzvfg] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-a9yrzgzvfg] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-a9yrzgzvfg] { border-bottom:none; }
.help-section p[b-a9yrzgzvfg] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.4rem; }
.help-section ul[b-a9yrzgzvfg] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-a9yrzgzvfg] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.2rem; }
.help-section-title[b-a9yrzgzvfg] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-a9yrzgzvfg] { color:var(--rg-accent,#2563eb); }

/* ── POS ── */
.pos-context[b-a9yrzgzvfg] { display:flex; gap:.75rem; flex-wrap:wrap; align-items:flex-end; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; margin-bottom:.8rem; }
.pos-ctx-field[b-a9yrzgzvfg] { display:flex; flex-direction:column; gap:.2rem; min-width:160px; }
.pos-ctx-field > label[b-a9yrzgzvfg] { font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted,#94a3b8); }
.pos-ctx-grow[b-a9yrzgzvfg] { flex:1; min-width:240px; }
.pos-cliente-ok[b-a9yrzgzvfg] { font-size:.74rem; color:#0d9488; margin-top:.15rem; display:inline-flex; align-items:center; gap:.3rem; }
[data-mode="dark"] .pos-cliente-ok[b-a9yrzgzvfg] { color:#5eead4; }
.pos-modo[b-a9yrzgzvfg] { display:flex; gap:.3rem; }
.pos-modo-btn[b-a9yrzgzvfg] { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.pos-modo-btn.active[b-a9yrzgzvfg] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }

.pos-grid[b-a9yrzgzvfg] { display:grid; grid-template-columns: 1fr 1fr; gap:.8rem; }
@media (max-width: 900px) { .pos-grid[b-a9yrzgzvfg] { grid-template-columns: 1fr; } }
.pos-left[b-a9yrzgzvfg], .pos-right[b-a9yrzgzvfg] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; min-height:300px; }
.pos-panel-head[b-a9yrzgzvfg] { display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.5rem; padding-bottom:.4rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.pos-panel-head i[b-a9yrzgzvfg] { color:var(--rg-accent,#2563eb); }

.pos-empty[b-a9yrzgzvfg] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; padding:2rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.85rem; }
.pos-empty i[b-a9yrzgzvfg] { font-size:1.8rem; }

.pos-cola[b-a9yrzgzvfg] { display:flex; flex-direction:column; gap:.4rem; max-height:calc(100vh - 360px); overflow-y:auto; }
.pos-cola-item[b-a9yrzgzvfg] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .7rem; cursor:pointer; }
.pos-cola-item.active[b-a9yrzgzvfg] { border-color:var(--rg-accent,#2563eb); box-shadow:0 0 0 2px rgba(37,99,235,.15); }
.pos-cola-num[b-a9yrzgzvfg] { font-weight:700; font-size:.84rem; color:var(--rg-text-primary,#1e293b); }
.pos-cola-cli[b-a9yrzgzvfg] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pos-cola-meta[b-a9yrzgzvfg] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }

.pos-prod-list[b-a9yrzgzvfg] { display:flex; flex-direction:column; gap:.35rem; max-height:calc(100vh - 400px); overflow-y:auto; }
.pos-prod-item[b-a9yrzgzvfg] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .65rem; cursor:pointer; }
.pos-prod-item:hover[b-a9yrzgzvfg] { border-color:var(--rg-accent,#2563eb); }
.pos-prod-nom[b-a9yrzgzvfg] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.pos-prod-meta[b-a9yrzgzvfg] { display:flex; gap:.7rem; flex-wrap:wrap; font-size:.72rem; color:var(--rg-text-muted,#94a3b8); margin-top:.15rem; align-items:center; }
.pos-nostock[b-a9yrzgzvfg] { color:#dc2626; font-weight:600; }

.pos-cart[b-a9yrzgzvfg] { overflow-x:auto; }
.pos-cart-table[b-a9yrzgzvfg] { width:100%; }
.pos-cart-table input.far-input-sm[b-a9yrzgzvfg] { width:100%; text-align:right; }

.pos-totales[b-a9yrzgzvfg] { margin-top:.6rem; border-top:1px solid var(--rg-border,#e2e8f0); padding-top:.5rem; }
.pos-totales > div[b-a9yrzgzvfg] { display:flex; justify-content:space-between; font-size:.84rem; color:var(--rg-text-secondary,#475569); padding:.15rem 0; }
.pos-total-grande[b-a9yrzgzvfg] { font-size:1.05rem !important; color:var(--rg-text-primary,#1e293b) !important; font-weight:700; border-top:1px dashed var(--rg-border,#e2e8f0); margin-top:.25rem; padding-top:.4rem !important; }

.pos-pagos-head[b-a9yrzgzvfg] { margin-top:.8rem; }
.pos-pagos-actions[b-a9yrzgzvfg] { display:flex; gap:.3rem; }
.pos-pago-row[b-a9yrzgzvfg] { display:flex; gap:.4rem; align-items:center; margin-bottom:.35rem; }
.pos-pago-row .far-input-sm[b-a9yrzgzvfg] { flex:1; }
.pos-pago-resumen[b-a9yrzgzvfg] { display:flex; justify-content:space-between; font-size:.8rem; color:var(--rg-text-secondary,#475569); background:var(--rg-bg-subtle,#f8fafc); border-radius:.45rem; padding:.4rem .6rem; margin:.3rem 0 .6rem; }
.pos-pago-resumen.ok[b-a9yrzgzvfg] { color:#0d9488; }
[data-mode="dark"] .pos-pago-resumen.ok[b-a9yrzgzvfg] { color:#5eead4; }
.pos-facturar[b-a9yrzgzvfg] { width:100%; justify-content:center; font-size:.95rem; padding:.7rem; }

/* Modales anidados (envío sobre post-grabado) */
.modal-backdrop-nested[b-a9yrzgzvfg] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-a9yrzgzvfg] { z-index: 2001 !important; }

/* Post-grabado */
.ps-recibo-info[b-a9yrzgzvfg] { display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .75rem; margin-bottom:.5rem; }
.ps-label[b-a9yrzgzvfg] { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-muted,#94a3b8); }
.ps-value[b-a9yrzgzvfg] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.ps-acciones[b-a9yrzgzvfg] { display:flex; flex-direction:column; gap:.5rem; margin-top:.5rem; }
.ps-acciones .btn-crud[b-a9yrzgzvfg] { width:100%; justify-content:center; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_operadores.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0xqk418gyp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0xqk418gyp 0.3s ease-out; }
@keyframes slideUp-b-0xqk418gyp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0xqk418gyp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0xqk418gyp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0xqk418gyp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0xqk418gyp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0xqk418gyp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0xqk418gyp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0xqk418gyp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0xqk418gyp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0xqk418gyp] { filter: brightness(1.1); }
.btn-outline[b-0xqk418gyp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0xqk418gyp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0xqk418gyp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0xqk418gyp] { filter: brightness(1.1); }
.btn-icon[b-0xqk418gyp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0xqk418gyp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0xqk418gyp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0xqk418gyp] { color: #ef4444; }
.btn-delete:hover[b-0xqk418gyp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0xqk418gyp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0xqk418gyp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0xqk418gyp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0xqk418gyp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0xqk418gyp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0xqk418gyp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0xqk418gyp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0xqk418gyp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0xqk418gyp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0xqk418gyp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0xqk418gyp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0xqk418gyp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0xqk418gyp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0xqk418gyp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0xqk418gyp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0xqk418gyp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0xqk418gyp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0xqk418gyp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0xqk418gyp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0xqk418gyp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0xqk418gyp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0xqk418gyp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0xqk418gyp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0xqk418gyp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0xqk418gyp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0xqk418gyp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0xqk418gyp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0xqk418gyp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0xqk418gyp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0xqk418gyp] { display: block; }
.hide-on-cards[b-0xqk418gyp] { display: none !important; }
.show-on-cards[b-0xqk418gyp] { display: grid; }
.hide-on-grid[b-0xqk418gyp] { display: none !important; }

/* Badges */
.badge[b-0xqk418gyp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0xqk418gyp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0xqk418gyp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0xqk418gyp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0xqk418gyp] { text-align: center; }
.text-muted[b-0xqk418gyp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0xqk418gyp], .crud-empty-state[b-0xqk418gyp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0xqk418gyp] { font-size: 2rem; }
.crud-spinner[b-0xqk418gyp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0xqk418gyp 0.6s linear infinite; }
.crud-spinner-sm[b-0xqk418gyp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0xqk418gyp 0.6s linear infinite; }
@keyframes spin-b-0xqk418gyp { to { transform: rotate(360deg); } }
.spin[b-0xqk418gyp] { animation: spin-b-0xqk418gyp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0xqk418gyp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0xqk418gyp 0.15s ease-out; }
.modal-container[b-0xqk418gyp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0xqk418gyp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0xqk418gyp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-0xqk418gyp] { max-width: 820px; }
.modal-sm[b-0xqk418gyp] { max-width: 420px; }
@keyframes fadeIn-b-0xqk418gyp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0xqk418gyp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0xqk418gyp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0xqk418gyp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0xqk418gyp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0xqk418gyp] { color: #dc2626; }
.modal-close[b-0xqk418gyp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0xqk418gyp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0xqk418gyp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0xqk418gyp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0xqk418gyp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0xqk418gyp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0xqk418gyp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0xqk418gyp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0xqk418gyp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0xqk418gyp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0xqk418gyp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0xqk418gyp] { flex: 2; }
.form-group label[b-0xqk418gyp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0xqk418gyp], .form-group select[b-0xqk418gyp], .form-textarea[b-0xqk418gyp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0xqk418gyp], .form-group select:focus[b-0xqk418gyp], .form-textarea:focus[b-0xqk418gyp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0xqk418gyp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0xqk418gyp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0xqk418gyp] { flex: 1; display: flex; align-items: center; }
.form-check[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0xqk418gyp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0xqk418gyp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0xqk418gyp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0xqk418gyp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0xqk418gyp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0xqk418gyp] { font-size: 3rem; }
.photo-placeholder span[b-0xqk418gyp] { font-size: 0.78rem; }
.photo-actions[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0xqk418gyp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-0xqk418gyp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0xqk418gyp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0xqk418gyp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0xqk418gyp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0xqk418gyp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0xqk418gyp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0xqk418gyp] { filter: brightness(1.15); transform: scale(1.05); }
[b-0xqk418gyp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0xqk418gyp] { padding: 0.75rem; }
    .crud-header[b-0xqk418gyp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0xqk418gyp] { font-size: 1.1rem; }
    .btn-text[b-0xqk418gyp] { display: none; }
    .form-row[b-0xqk418gyp] { flex-direction: column; }
    .form-row-4[b-0xqk418gyp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0xqk418gyp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0xqk418gyp] { max-width: 820px; }
    .modal-body[b-0xqk418gyp] { padding: 0.75rem; }
    .modal-tabs[b-0xqk418gyp] { overflow-x: auto; }
    .modal-tab[b-0xqk418gyp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0xqk418gyp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0xqk418gyp] { display: grid !important; }
    .crud-cards-wrapper[b-0xqk418gyp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0xqk418gyp] { grid-template-columns: 1fr; }
    .card-details[b-0xqk418gyp] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-0xqk418gyp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0xqk418gyp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0xqk418gyp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0xqk418gyp] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-0xqk418gyp] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-0xqk418gyp] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-0xqk418gyp] { flex: 1.6; }
.far-switch[b-0xqk418gyp] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-0xqk418gyp] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-0xqk418gyp] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-0xqk418gyp] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-0xqk418gyp] { color:#93c5fd; }
.far-cold[b-0xqk418gyp] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-0xqk418gyp] { color:#7dd3fc !important; }
.badge-warn[b-0xqk418gyp] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-0xqk418gyp] { color:#fcd34d; }
.badge-func[b-0xqk418gyp] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-0xqk418gyp] { color:#a5b4fc; }
.far-row-venc td[b-0xqk418gyp] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-0xqk418gyp] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-0xqk418gyp] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-0xqk418gyp], .pc-addbar select[b-0xqk418gyp] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-0xqk418gyp] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-0xqk418gyp] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-0xqk418gyp] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-0xqk418gyp] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-0xqk418gyp] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-0xqk418gyp] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-0xqk418gyp] { border-bottom: none; }
.help-section p[b-0xqk418gyp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-0xqk418gyp], .help-section ol[b-0xqk418gyp] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-0xqk418gyp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-0xqk418gyp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-0xqk418gyp] { color: var(--rg-accent,#2563eb); }
.help-example[b-0xqk418gyp] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-0xqk418gyp] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-0xqk418gyp] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-0xqk418gyp] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-0xqk418gyp] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-0xqk418gyp] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-0xqk418gyp] { background: rgba(37,99,235,0.12); }
.help-steps[b-0xqk418gyp] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-0xqk418gyp] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-0xqk418gyp] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-0xqk418gyp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-0xqk418gyp] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-0xqk418gyp] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-0xqk418gyp] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-0xqk418gyp] { background: rgba(255,255,255,0.04); }
.help-badge[b-0xqk418gyp] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-0xqk418gyp] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-0xqk418gyp] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-0xqk418gyp] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-0xqk418gyp] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-0xqk418gyp] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-0xqk418gyp] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-0xqk418gyp] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-0xqk418gyp] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_ordenes.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6ycgt3bwj8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6ycgt3bwj8 0.3s ease-out; }
@keyframes slideUp-b-6ycgt3bwj8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6ycgt3bwj8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6ycgt3bwj8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6ycgt3bwj8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6ycgt3bwj8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6ycgt3bwj8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6ycgt3bwj8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6ycgt3bwj8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6ycgt3bwj8] { filter: brightness(1.1); }
.btn-outline[b-6ycgt3bwj8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6ycgt3bwj8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6ycgt3bwj8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6ycgt3bwj8] { filter: brightness(1.1); }
.btn-icon[b-6ycgt3bwj8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6ycgt3bwj8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6ycgt3bwj8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6ycgt3bwj8] { color: #ef4444; }
.btn-delete:hover[b-6ycgt3bwj8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6ycgt3bwj8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6ycgt3bwj8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6ycgt3bwj8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6ycgt3bwj8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6ycgt3bwj8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6ycgt3bwj8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6ycgt3bwj8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6ycgt3bwj8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6ycgt3bwj8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6ycgt3bwj8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6ycgt3bwj8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6ycgt3bwj8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6ycgt3bwj8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6ycgt3bwj8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6ycgt3bwj8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6ycgt3bwj8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6ycgt3bwj8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6ycgt3bwj8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6ycgt3bwj8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6ycgt3bwj8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6ycgt3bwj8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6ycgt3bwj8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6ycgt3bwj8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6ycgt3bwj8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6ycgt3bwj8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6ycgt3bwj8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6ycgt3bwj8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6ycgt3bwj8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6ycgt3bwj8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6ycgt3bwj8] { display: block; }
.hide-on-cards[b-6ycgt3bwj8] { display: none !important; }
.show-on-cards[b-6ycgt3bwj8] { display: grid; }
.hide-on-grid[b-6ycgt3bwj8] { display: none !important; }

/* Badges */
.badge[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6ycgt3bwj8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6ycgt3bwj8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6ycgt3bwj8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6ycgt3bwj8] { text-align: center; }
.text-muted[b-6ycgt3bwj8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6ycgt3bwj8], .crud-empty-state[b-6ycgt3bwj8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6ycgt3bwj8] { font-size: 2rem; }
.crud-spinner[b-6ycgt3bwj8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6ycgt3bwj8 0.6s linear infinite; }
.crud-spinner-sm[b-6ycgt3bwj8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6ycgt3bwj8 0.6s linear infinite; }
@keyframes spin-b-6ycgt3bwj8 { to { transform: rotate(360deg); } }
.spin[b-6ycgt3bwj8] { animation: spin-b-6ycgt3bwj8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6ycgt3bwj8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6ycgt3bwj8 0.15s ease-out; }
.modal-container[b-6ycgt3bwj8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6ycgt3bwj8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6ycgt3bwj8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-6ycgt3bwj8] { max-width: 820px; }
.modal-sm[b-6ycgt3bwj8] { max-width: 420px; }
@keyframes fadeIn-b-6ycgt3bwj8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6ycgt3bwj8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6ycgt3bwj8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6ycgt3bwj8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6ycgt3bwj8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6ycgt3bwj8] { color: #dc2626; }
.modal-close[b-6ycgt3bwj8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6ycgt3bwj8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6ycgt3bwj8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6ycgt3bwj8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6ycgt3bwj8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6ycgt3bwj8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6ycgt3bwj8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6ycgt3bwj8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6ycgt3bwj8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6ycgt3bwj8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6ycgt3bwj8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6ycgt3bwj8] { flex: 2; }
.form-group label[b-6ycgt3bwj8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6ycgt3bwj8], .form-group select[b-6ycgt3bwj8], .form-textarea[b-6ycgt3bwj8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6ycgt3bwj8], .form-group select:focus[b-6ycgt3bwj8], .form-textarea:focus[b-6ycgt3bwj8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6ycgt3bwj8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6ycgt3bwj8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6ycgt3bwj8] { flex: 1; display: flex; align-items: center; }
.form-check[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6ycgt3bwj8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6ycgt3bwj8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6ycgt3bwj8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6ycgt3bwj8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6ycgt3bwj8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6ycgt3bwj8] { font-size: 3rem; }
.photo-placeholder span[b-6ycgt3bwj8] { font-size: 0.78rem; }
.photo-actions[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6ycgt3bwj8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-6ycgt3bwj8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6ycgt3bwj8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6ycgt3bwj8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6ycgt3bwj8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6ycgt3bwj8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6ycgt3bwj8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6ycgt3bwj8] { filter: brightness(1.15); transform: scale(1.05); }
[b-6ycgt3bwj8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6ycgt3bwj8] { padding: 0.75rem; }
    .crud-header[b-6ycgt3bwj8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6ycgt3bwj8] { font-size: 1.1rem; }
    .btn-text[b-6ycgt3bwj8] { display: none; }
    .form-row[b-6ycgt3bwj8] { flex-direction: column; }
    .form-row-4[b-6ycgt3bwj8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6ycgt3bwj8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6ycgt3bwj8] { max-width: 820px; }
    .modal-body[b-6ycgt3bwj8] { padding: 0.75rem; }
    .modal-tabs[b-6ycgt3bwj8] { overflow-x: auto; }
    .modal-tab[b-6ycgt3bwj8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6ycgt3bwj8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6ycgt3bwj8] { display: grid !important; }
    .crud-cards-wrapper[b-6ycgt3bwj8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6ycgt3bwj8] { grid-template-columns: 1fr; }
    .card-details[b-6ycgt3bwj8] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-6ycgt3bwj8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6ycgt3bwj8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6ycgt3bwj8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6ycgt3bwj8] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-6ycgt3bwj8] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-6ycgt3bwj8] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-6ycgt3bwj8] { flex: 1.6; }
.far-switch[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-6ycgt3bwj8] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Perfil Clínico ── */
.pc-cliente-bar[b-6ycgt3bwj8] { display: flex; flex-direction: column; gap: 0.3rem; max-width: 560px; margin-bottom: 1rem; }
.pc-cliente-bar > label[b-6ycgt3bwj8] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); }
.pc-cliente-head[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.7rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.7rem 0.9rem; margin-bottom: 0.9rem; }
.pc-cliente-head i[b-6ycgt3bwj8] { font-size: 1.8rem; color: var(--rg-primary); }
.pc-cliente-head strong[b-6ycgt3bwj8] { display: block; color: var(--rg-text-primary); }
.pc-cliente-id[b-6ycgt3bwj8] { font-size: 0.75rem; color: var(--rg-text-muted); }
.pc-tabs[b-6ycgt3bwj8] { display: flex; gap: 0.25rem; flex-wrap: wrap; border-bottom: 2px solid var(--rg-border); margin-bottom: 1rem; }
.pc-tab[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: 0.4rem; background: transparent; border: none; border-bottom: 2px solid transparent; cursor: pointer; color: var(--rg-text-secondary); font-size: 0.84rem; font-weight: 600; padding: 0.55rem 0.85rem; margin-bottom: -2px; }
.pc-tab:hover[b-6ycgt3bwj8] { color: var(--rg-text-primary); }
.pc-tab.active[b-6ycgt3bwj8] { color: var(--rg-primary); border-bottom-color: var(--rg-primary); }
[data-mode="dark"] .pc-tab.active[b-6ycgt3bwj8] { color: #93c5fd; border-bottom-color: #93c5fd; }
.pc-panel[b-6ycgt3bwj8] { }
.pc-addbar[b-6ycgt3bwj8] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.55rem; padding: 0.6rem; margin-bottom: 0.85rem; }
.pc-addbar input[b-6ycgt3bwj8], .pc-addbar select[b-6ycgt3bwj8] { flex: 1; min-width: 130px; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.4rem 0.55rem; font-size: 0.84rem; }
.pc-actions[b-6ycgt3bwj8] { margin-top: 0.85rem; display: flex; justify-content: flex-end; }
.pc-empty[b-6ycgt3bwj8] { color: var(--rg-text-muted); font-size: 0.85rem; text-align: center; padding: 1rem; }
.pc-notas[b-6ycgt3bwj8] { display: flex; flex-direction: column; gap: 0.6rem; }
.pc-nota[b-6ycgt3bwj8] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-left: 4px solid var(--rg-primary); border-radius: 0.5rem; padding: 0.6rem 0.8rem; }
.pc-nota-head[b-6ycgt3bwj8] { display: flex; justify-content: space-between; font-size: 0.74rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.3rem; }
.pc-nota-meta[b-6ycgt3bwj8] { font-weight: 500; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; }
.pc-nota-text[b-6ycgt3bwj8] { font-size: 0.88rem; color: var(--rg-text-primary); white-space: pre-wrap; }
.badge-warn[b-6ycgt3bwj8] { background: rgba(217,119,6,0.14); color: #92400e; }
[data-mode="dark"] .badge-warn[b-6ycgt3bwj8] { color: #fcd34d; }
.far-switch[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-6ycgt3bwj8] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }
.form-grow[b-6ycgt3bwj8] { flex: 1.6; }

/* ── Órdenes: filtros + autocomplete + extras ── */
.am-filtros[b-6ycgt3bwj8] { display:flex; gap:.75rem; align-items:flex-end; flex-wrap:wrap; margin-bottom:1rem; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.6rem; padding:.85rem; }
.am-field[b-6ycgt3bwj8] { display:flex; flex-direction:column; gap:.25rem; min-width:200px; }
.am-field-grow[b-6ycgt3bwj8] { flex:1; min-width:240px; }
.am-field label[b-6ycgt3bwj8] { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted); }
.am-field select[b-6ycgt3bwj8] { background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.45rem .6rem; font-size:.85rem; width:100%; }
.am-autocomplete[b-6ycgt3bwj8] { position:relative; width:100%; }
.am-autocomplete input[b-6ycgt3bwj8] { background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.45rem .6rem; font-size:.85rem; width:100%; }
.am-dropdown[b-6ycgt3bwj8] { position:absolute; top:calc(100% + 2px); left:0; right:0; z-index:60; background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:.5rem; box-shadow:0 12px 30px rgba(0,0,0,.15); max-height:300px; overflow-y:auto; }
.am-dropdown-item[b-6ycgt3bwj8] { display:flex; align-items:center; gap:.5rem; padding:.5rem .7rem; cursor:pointer; border-bottom:1px solid var(--rg-border); font-size:.84rem; color:var(--rg-text-primary); }
.am-dropdown-item:last-child[b-6ycgt3bwj8] { border-bottom:none; }
.am-dropdown-item:hover[b-6ycgt3bwj8] { background:var(--rg-bg-hover); }
.am-code[b-6ycgt3bwj8] { font-family:'Cascadia Code',monospace; font-size:.74rem; color:var(--rg-text-muted); background:var(--rg-bg-subtle); padding:.05rem .35rem; border-radius:.3rem; }
.far-section-title[b-6ycgt3bwj8] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
[data-mode="dark"] .far-section-title[b-6ycgt3bwj8] { color:#93c5fd; }
.far-cold[b-6ycgt3bwj8] { background:rgba(56,189,248,.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-6ycgt3bwj8] { color:#7dd3fc !important; }
.far-tot[b-6ycgt3bwj8] { display:flex; flex-wrap:wrap; gap:1.2rem; justify-content:flex-end; padding:.7rem .2rem .2rem; font-size:.9rem; color:var(--rg-text-secondary); border-top:1px solid var(--rg-border); margin-top:.5rem; }
.far-tot strong[b-6ycgt3bwj8] { color:var(--rg-text-primary); }
.badge-ctrl[b-6ycgt3bwj8] { background:rgba(234,88,12,.14); color:#c2410c; border:1px solid rgba(234,88,12,.3); padding:.1rem .45rem; border-radius:1rem; font-size:.7rem; font-weight:700; }
[data-mode="dark"] .badge-ctrl[b-6ycgt3bwj8] { color:#fdba74; }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-6ycgt3bwj8] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-6ycgt3bwj8] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-6ycgt3bwj8] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-6ycgt3bwj8] { border-bottom: none; }
.help-section p[b-6ycgt3bwj8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-6ycgt3bwj8], .help-section ol[b-6ycgt3bwj8] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-6ycgt3bwj8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-6ycgt3bwj8] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-6ycgt3bwj8] { color: var(--rg-accent,#2563eb); }
.help-example[b-6ycgt3bwj8] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-6ycgt3bwj8] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-6ycgt3bwj8] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-6ycgt3bwj8] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-6ycgt3bwj8] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-6ycgt3bwj8] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-6ycgt3bwj8] { background: rgba(37,99,235,0.12); }
.help-steps[b-6ycgt3bwj8] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-6ycgt3bwj8] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-6ycgt3bwj8] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-6ycgt3bwj8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-6ycgt3bwj8] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-6ycgt3bwj8] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-6ycgt3bwj8] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-6ycgt3bwj8] { background: rgba(255,255,255,0.04); }
.help-badge[b-6ycgt3bwj8] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-6ycgt3bwj8] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-6ycgt3bwj8] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-6ycgt3bwj8] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-6ycgt3bwj8] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-6ycgt3bwj8] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-6ycgt3bwj8] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-6ycgt3bwj8] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-6ycgt3bwj8] { color: #fca5a5; }

/* ── Barra de identificación (operador activo) ── */
.am-ident-bar[b-6ycgt3bwj8] { display:flex; align-items:center; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f1f5f9); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.55rem .9rem; margin-bottom:.8rem; font-size:.85rem; color:var(--rg-text-primary,#1e293b); }
.am-ident-bar i[b-6ycgt3bwj8] { color:var(--rg-success,#16a34a); margin-right:.35rem; }
.btn-crud.btn-sm[b-6ycgt3bwj8] { padding:.3rem .6rem; font-size:.78rem; }

/* ── Modales anidados (solicitud de transferencia desde Órdenes) ── */
.modal-backdrop-nested[b-6ycgt3bwj8]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-6ycgt3bwj8] { z-index: 2001 !important; }

/* ── Barra de producto seleccionado (consulta otra sucursal) ── */
.trf-prod-bar[b-6ycgt3bwj8] { display: flex; align-items: center; justify-content: space-between; gap: .6rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .5rem .75rem; font-size: .9rem; color: var(--rg-text-primary); }
.trf-prod-bar i[b-6ycgt3bwj8] { color: var(--rg-primary); }

/* Confirmación de cliente seleccionado en el editor de orden */
.pc-cliente-ok[b-6ycgt3bwj8] { display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; font-size: .8rem; color: var(--rg-success); font-weight: 600; }
.pc-cliente-ok i[b-6ycgt3bwj8] { color: var(--rg-success); }

/* Tercer nivel de modal (solicitar transferencia sobre la consulta) */
.modal-backdrop-nested2[b-6ycgt3bwj8]  { z-index: 3000 !important; background: rgba(0,0,0,0.55) !important; }
.modal-container-nested2[b-6ycgt3bwj8] { z-index: 3001 !important; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_parametros.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-89luz1dna8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-89luz1dna8 0.3s ease-out; }
@keyframes slideUp-b-89luz1dna8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-89luz1dna8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-89luz1dna8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-89luz1dna8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-89luz1dna8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-89luz1dna8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-89luz1dna8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-89luz1dna8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-89luz1dna8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-89luz1dna8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-89luz1dna8] { filter: brightness(1.1); }
.btn-outline[b-89luz1dna8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-89luz1dna8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-89luz1dna8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-89luz1dna8] { filter: brightness(1.1); }
.btn-icon[b-89luz1dna8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-89luz1dna8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-89luz1dna8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-89luz1dna8] { color: #ef4444; }
.btn-delete:hover[b-89luz1dna8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-89luz1dna8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-89luz1dna8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-89luz1dna8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-89luz1dna8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-89luz1dna8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-89luz1dna8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-89luz1dna8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-89luz1dna8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-89luz1dna8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-89luz1dna8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-89luz1dna8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-89luz1dna8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-89luz1dna8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-89luz1dna8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-89luz1dna8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-89luz1dna8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-89luz1dna8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-89luz1dna8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-89luz1dna8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-89luz1dna8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-89luz1dna8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-89luz1dna8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-89luz1dna8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-89luz1dna8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-89luz1dna8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-89luz1dna8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-89luz1dna8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-89luz1dna8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-89luz1dna8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-89luz1dna8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-89luz1dna8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-89luz1dna8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-89luz1dna8] { display: block; }
.hide-on-cards[b-89luz1dna8] { display: none !important; }
.show-on-cards[b-89luz1dna8] { display: grid; }
.hide-on-grid[b-89luz1dna8] { display: none !important; }

/* Badges */
.badge[b-89luz1dna8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-89luz1dna8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-89luz1dna8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-89luz1dna8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-89luz1dna8] { text-align: center; }
.text-muted[b-89luz1dna8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-89luz1dna8], .crud-empty-state[b-89luz1dna8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-89luz1dna8] { font-size: 2rem; }
.crud-spinner[b-89luz1dna8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-89luz1dna8 0.6s linear infinite; }
.crud-spinner-sm[b-89luz1dna8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-89luz1dna8 0.6s linear infinite; }
@keyframes spin-b-89luz1dna8 { to { transform: rotate(360deg); } }
.spin[b-89luz1dna8] { animation: spin-b-89luz1dna8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-89luz1dna8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-89luz1dna8 0.15s ease-out; }
.modal-container[b-89luz1dna8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-89luz1dna8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-89luz1dna8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-89luz1dna8] { max-width: 820px; }
.modal-sm[b-89luz1dna8] { max-width: 420px; }
@keyframes fadeIn-b-89luz1dna8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-89luz1dna8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-89luz1dna8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-89luz1dna8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-89luz1dna8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-89luz1dna8] { color: #dc2626; }
.modal-close[b-89luz1dna8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-89luz1dna8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-89luz1dna8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-89luz1dna8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-89luz1dna8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-89luz1dna8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-89luz1dna8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-89luz1dna8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-89luz1dna8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-89luz1dna8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-89luz1dna8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-89luz1dna8] { flex: 2; }
.form-group label[b-89luz1dna8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-89luz1dna8], .form-group select[b-89luz1dna8], .form-textarea[b-89luz1dna8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-89luz1dna8], .form-group select:focus[b-89luz1dna8], .form-textarea:focus[b-89luz1dna8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-89luz1dna8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-89luz1dna8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-89luz1dna8] { flex: 1; display: flex; align-items: center; }
.form-check[b-89luz1dna8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-89luz1dna8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-89luz1dna8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-89luz1dna8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-89luz1dna8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-89luz1dna8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-89luz1dna8] { font-size: 3rem; }
.photo-placeholder span[b-89luz1dna8] { font-size: 0.78rem; }
.photo-actions[b-89luz1dna8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-89luz1dna8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-89luz1dna8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-89luz1dna8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-89luz1dna8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-89luz1dna8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-89luz1dna8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-89luz1dna8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-89luz1dna8] { filter: brightness(1.15); transform: scale(1.05); }
[b-89luz1dna8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-89luz1dna8] { padding: 0.75rem; }
    .crud-header[b-89luz1dna8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-89luz1dna8] { font-size: 1.1rem; }
    .btn-text[b-89luz1dna8] { display: none; }
    .form-row[b-89luz1dna8] { flex-direction: column; }
    .form-row-4[b-89luz1dna8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-89luz1dna8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-89luz1dna8] { max-width: 820px; }
    .modal-body[b-89luz1dna8] { padding: 0.75rem; }
    .modal-tabs[b-89luz1dna8] { overflow-x: auto; }
    .modal-tab[b-89luz1dna8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-89luz1dna8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-89luz1dna8] { display: grid !important; }
    .crud-cards-wrapper[b-89luz1dna8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-89luz1dna8] { grid-template-columns: 1fr; }
    .card-details[b-89luz1dna8] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-89luz1dna8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-89luz1dna8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-89luz1dna8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-89luz1dna8] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-89luz1dna8] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-89luz1dna8] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-89luz1dna8] { flex: 1.6; }
.far-switch[b-89luz1dna8] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-89luz1dna8] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-89luz1dna8] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-89luz1dna8] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-89luz1dna8] { color:#93c5fd; }
.far-cold[b-89luz1dna8] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-89luz1dna8] { color:#7dd3fc !important; }
.badge-warn[b-89luz1dna8] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-89luz1dna8] { color:#fcd34d; }
.badge-func[b-89luz1dna8] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-89luz1dna8] { color:#a5b4fc; }
.far-row-venc td[b-89luz1dna8] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-89luz1dna8] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-89luz1dna8] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-89luz1dna8], .pc-addbar select[b-89luz1dna8] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-89luz1dna8] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-89luz1dna8] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-89luz1dna8] { background:rgba(37,99,235,0.12); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-89luz1dna8] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-89luz1dna8] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-89luz1dna8] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-89luz1dna8] { border-bottom: none; }
.help-section p[b-89luz1dna8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-89luz1dna8], .help-section ol[b-89luz1dna8] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-89luz1dna8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-89luz1dna8] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-89luz1dna8] { color: var(--rg-accent,#2563eb); }
.help-example[b-89luz1dna8] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-89luz1dna8] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-89luz1dna8] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-89luz1dna8] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-89luz1dna8] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-89luz1dna8] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-89luz1dna8] { background: rgba(37,99,235,0.12); }
.help-steps[b-89luz1dna8] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-89luz1dna8] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-89luz1dna8] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-89luz1dna8] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-89luz1dna8] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-89luz1dna8] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-89luz1dna8] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-89luz1dna8] { background: rgba(255,255,255,0.04); }
.help-badge[b-89luz1dna8] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-89luz1dna8] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-89luz1dna8] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-89luz1dna8] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-89luz1dna8] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-89luz1dna8] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-89luz1dna8] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-89luz1dna8] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-89luz1dna8] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_perfil_contable.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-okz5nsnzim] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-okz5nsnzim 0.3s ease-out; }
@keyframes slideUp-b-okz5nsnzim { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-okz5nsnzim] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-okz5nsnzim] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-okz5nsnzim] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-okz5nsnzim] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-okz5nsnzim] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-okz5nsnzim] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-okz5nsnzim] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-okz5nsnzim] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-okz5nsnzim] { filter: brightness(1.1); }
.btn-outline[b-okz5nsnzim] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-okz5nsnzim] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-okz5nsnzim] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-okz5nsnzim] { filter: brightness(1.1); }
.btn-icon[b-okz5nsnzim] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-okz5nsnzim] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-okz5nsnzim] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-okz5nsnzim] { color: #ef4444; }
.btn-delete:hover[b-okz5nsnzim] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-okz5nsnzim] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-okz5nsnzim] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-okz5nsnzim] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-okz5nsnzim] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-okz5nsnzim] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-okz5nsnzim] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-okz5nsnzim] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-okz5nsnzim] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-okz5nsnzim] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-okz5nsnzim] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-okz5nsnzim] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-okz5nsnzim] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-okz5nsnzim] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-okz5nsnzim] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-okz5nsnzim] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-okz5nsnzim] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-okz5nsnzim] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-okz5nsnzim] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-okz5nsnzim] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-okz5nsnzim] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-okz5nsnzim] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-okz5nsnzim] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-okz5nsnzim] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-okz5nsnzim] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-okz5nsnzim] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-okz5nsnzim] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-okz5nsnzim] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-okz5nsnzim] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-okz5nsnzim] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-okz5nsnzim] { display: block; }
.hide-on-cards[b-okz5nsnzim] { display: none !important; }
.show-on-cards[b-okz5nsnzim] { display: grid; }
.hide-on-grid[b-okz5nsnzim] { display: none !important; }

/* Badges */
.badge[b-okz5nsnzim] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-okz5nsnzim] { background: #ecfdf5; color: #065f46; }
.badge-no[b-okz5nsnzim] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-okz5nsnzim] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-okz5nsnzim] { text-align: center; }
.text-muted[b-okz5nsnzim] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-okz5nsnzim], .crud-empty-state[b-okz5nsnzim] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-okz5nsnzim] { font-size: 2rem; }
.crud-spinner[b-okz5nsnzim] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-okz5nsnzim 0.6s linear infinite; }
.crud-spinner-sm[b-okz5nsnzim] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-okz5nsnzim 0.6s linear infinite; }
@keyframes spin-b-okz5nsnzim { to { transform: rotate(360deg); } }
.spin[b-okz5nsnzim] { animation: spin-b-okz5nsnzim 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-okz5nsnzim] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-okz5nsnzim 0.15s ease-out; }
.modal-container[b-okz5nsnzim] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-okz5nsnzim] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-okz5nsnzim 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-okz5nsnzim] { max-width: 820px; }
.modal-sm[b-okz5nsnzim] { max-width: 420px; }
@keyframes fadeIn-b-okz5nsnzim { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-okz5nsnzim { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-okz5nsnzim] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-okz5nsnzim] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-okz5nsnzim] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-okz5nsnzim] { color: #dc2626; }
.modal-close[b-okz5nsnzim] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-okz5nsnzim] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-okz5nsnzim] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-okz5nsnzim] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-okz5nsnzim] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-okz5nsnzim] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-okz5nsnzim] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-okz5nsnzim] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-okz5nsnzim] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-okz5nsnzim] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-okz5nsnzim] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-okz5nsnzim] { flex: 2; }
.form-group label[b-okz5nsnzim] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-okz5nsnzim], .form-group select[b-okz5nsnzim], .form-textarea[b-okz5nsnzim] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-okz5nsnzim], .form-group select:focus[b-okz5nsnzim], .form-textarea:focus[b-okz5nsnzim] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-okz5nsnzim] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-okz5nsnzim] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-okz5nsnzim] { flex: 1; display: flex; align-items: center; }
.form-check[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-okz5nsnzim] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-okz5nsnzim] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-okz5nsnzim] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-okz5nsnzim] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-okz5nsnzim] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-okz5nsnzim] { font-size: 3rem; }
.photo-placeholder span[b-okz5nsnzim] { font-size: 0.78rem; }
.photo-actions[b-okz5nsnzim] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-okz5nsnzim] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-okz5nsnzim] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-okz5nsnzim] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-okz5nsnzim] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-okz5nsnzim] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-okz5nsnzim] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-okz5nsnzim] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-okz5nsnzim] { filter: brightness(1.15); transform: scale(1.05); }
[b-okz5nsnzim] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-okz5nsnzim] { padding: 0.75rem; }
    .crud-header[b-okz5nsnzim] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-okz5nsnzim] { font-size: 1.1rem; }
    .btn-text[b-okz5nsnzim] { display: none; }
    .form-row[b-okz5nsnzim] { flex-direction: column; }
    .form-row-4[b-okz5nsnzim] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-okz5nsnzim] { width: 98%; max-height: 95vh; }
    .modal-lg[b-okz5nsnzim] { max-width: 820px; }
    .modal-body[b-okz5nsnzim] { padding: 0.75rem; }
    .modal-tabs[b-okz5nsnzim] { overflow-x: auto; }
    .modal-tab[b-okz5nsnzim] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-okz5nsnzim] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-okz5nsnzim] { display: grid !important; }
    .crud-cards-wrapper[b-okz5nsnzim] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-okz5nsnzim] { grid-template-columns: 1fr; }
    .card-details[b-okz5nsnzim] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-okz5nsnzim] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-okz5nsnzim] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-okz5nsnzim] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-okz5nsnzim] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-okz5nsnzim] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-okz5nsnzim] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-okz5nsnzim] { flex: 1.6; }
.far-switch[b-okz5nsnzim] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-okz5nsnzim] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-okz5nsnzim] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-okz5nsnzim] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-okz5nsnzim] { color:#93c5fd; }
.far-cold[b-okz5nsnzim] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-okz5nsnzim] { color:#7dd3fc !important; }
.badge-warn[b-okz5nsnzim] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-okz5nsnzim] { color:#fcd34d; }
.badge-func[b-okz5nsnzim] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-okz5nsnzim] { color:#a5b4fc; }
.far-row-venc td[b-okz5nsnzim] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-okz5nsnzim] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-okz5nsnzim] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-okz5nsnzim], .pc-addbar select[b-okz5nsnzim] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-okz5nsnzim] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-okz5nsnzim] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-okz5nsnzim] { background:rgba(37,99,235,0.12); }

/* ── Perfil Contable por Documento ── */
.far-input[b-okz5nsnzim] { padding:.4rem .55rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; font-size:.82rem; color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-input,#fff); outline:none; width:100%; transition:border-color .15s; }
.far-input:focus[b-okz5nsnzim] { border-color:var(--rg-accent,#4f46e5); box-shadow:0 0 0 2px rgba(79,70,229,.15); }
.far-input:disabled[b-okz5nsnzim] { background:var(--rg-bg-subtle,#f8fafc); color:var(--rg-text-muted,#94a3b8); }
.far-input-sm[b-okz5nsnzim] { padding:.3rem .4rem; font-size:.78rem; }

.far-tot[b-okz5nsnzim] { display:inline-flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.5rem; padding:0 .45rem; border-radius:1rem; background:rgba(13,148,136,.14); color:#0d9488; font-weight:700; font-size:.74rem; }
[data-mode="dark"] .far-tot[b-okz5nsnzim] { background:rgba(13,148,136,.22); color:#5eead4; }

.btn-sm[b-okz5nsnzim] { padding:.32rem .6rem; font-size:.74rem; }

/* selectores de movimiento DEB/CRE */
.mov-deb[b-okz5nsnzim] { color:#1d4ed8; font-weight:700; }
.mov-cre[b-okz5nsnzim] { color:#b45309; font-weight:700; }
[data-mode="dark"] .mov-deb[b-okz5nsnzim] { color:#93c5fd; }
[data-mode="dark"] .mov-cre[b-okz5nsnzim] { color:#fcd34d; }

.pc-section-head[b-okz5nsnzim] { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin:1.1rem 0 .35rem; }
.pc-section-head .far-section-title[b-okz5nsnzim] { margin:0; border:none; padding:0; }

.pc-balance-hint[b-okz5nsnzim] { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pc-balance-hint i[b-okz5nsnzim] { margin-right:.2rem; }
.pc-hint-note[b-okz5nsnzim] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); flex:1; min-width:200px; }

.pc-empty[b-okz5nsnzim] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.8rem; border:1px dashed var(--rg-border,#e2e8f0); border-radius:.5rem; }

.pc-lineas td[b-okz5nsnzim] { vertical-align:top; }
.pc-cuenta-nom[b-okz5nsnzim] { display:flex; align-items:center; gap:.3rem; margin-top:.2rem; font-size:.72rem; color:#0d9488; }
[data-mode="dark"] .pc-cuenta-nom[b-okz5nsnzim] { color:#5eead4; }
.pc-cuenta-nom i[b-okz5nsnzim] { font-size:.8rem; }

/* ── Contenido del modal de ayuda ── */
.help-icon-header[b-okz5nsnzim] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-okz5nsnzim] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-okz5nsnzim] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-okz5nsnzim] { border-bottom:none; }
.help-section p[b-okz5nsnzim] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.4rem; }
.help-section ul[b-okz5nsnzim] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-okz5nsnzim] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.2rem; }
.help-section-title[b-okz5nsnzim] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-okz5nsnzim] { color:var(--rg-accent,#2563eb); }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_pos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2jyog6rclu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2jyog6rclu 0.3s ease-out; }
@keyframes slideUp-b-2jyog6rclu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2jyog6rclu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2jyog6rclu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2jyog6rclu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2jyog6rclu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2jyog6rclu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2jyog6rclu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2jyog6rclu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2jyog6rclu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2jyog6rclu] { filter: brightness(1.1); }
.btn-outline[b-2jyog6rclu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2jyog6rclu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2jyog6rclu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2jyog6rclu] { filter: brightness(1.1); }
.btn-icon[b-2jyog6rclu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2jyog6rclu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2jyog6rclu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2jyog6rclu] { color: #ef4444; }
.btn-delete:hover[b-2jyog6rclu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2jyog6rclu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2jyog6rclu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2jyog6rclu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2jyog6rclu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2jyog6rclu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2jyog6rclu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2jyog6rclu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2jyog6rclu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2jyog6rclu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2jyog6rclu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2jyog6rclu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2jyog6rclu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2jyog6rclu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2jyog6rclu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2jyog6rclu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2jyog6rclu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2jyog6rclu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2jyog6rclu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2jyog6rclu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2jyog6rclu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2jyog6rclu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2jyog6rclu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2jyog6rclu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2jyog6rclu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2jyog6rclu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2jyog6rclu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2jyog6rclu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2jyog6rclu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2jyog6rclu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2jyog6rclu] { display: block; }
.hide-on-cards[b-2jyog6rclu] { display: none !important; }
.show-on-cards[b-2jyog6rclu] { display: grid; }
.hide-on-grid[b-2jyog6rclu] { display: none !important; }

/* Badges */
.badge[b-2jyog6rclu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2jyog6rclu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2jyog6rclu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2jyog6rclu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2jyog6rclu] { text-align: center; }
.text-muted[b-2jyog6rclu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2jyog6rclu], .crud-empty-state[b-2jyog6rclu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2jyog6rclu] { font-size: 2rem; }
.crud-spinner[b-2jyog6rclu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2jyog6rclu 0.6s linear infinite; }
.crud-spinner-sm[b-2jyog6rclu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2jyog6rclu 0.6s linear infinite; }
@keyframes spin-b-2jyog6rclu { to { transform: rotate(360deg); } }
.spin[b-2jyog6rclu] { animation: spin-b-2jyog6rclu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2jyog6rclu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2jyog6rclu 0.15s ease-out; }
.modal-container[b-2jyog6rclu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2jyog6rclu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2jyog6rclu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-2jyog6rclu] { max-width: 820px; }
.modal-sm[b-2jyog6rclu] { max-width: 420px; }
@keyframes fadeIn-b-2jyog6rclu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2jyog6rclu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2jyog6rclu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2jyog6rclu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2jyog6rclu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2jyog6rclu] { color: #dc2626; }
.modal-close[b-2jyog6rclu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2jyog6rclu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2jyog6rclu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2jyog6rclu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2jyog6rclu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2jyog6rclu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2jyog6rclu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2jyog6rclu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2jyog6rclu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2jyog6rclu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2jyog6rclu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2jyog6rclu] { flex: 2; }
.form-group label[b-2jyog6rclu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2jyog6rclu], .form-group select[b-2jyog6rclu], .form-textarea[b-2jyog6rclu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2jyog6rclu], .form-group select:focus[b-2jyog6rclu], .form-textarea:focus[b-2jyog6rclu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2jyog6rclu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2jyog6rclu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2jyog6rclu] { flex: 1; display: flex; align-items: center; }
.form-check[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2jyog6rclu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2jyog6rclu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2jyog6rclu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2jyog6rclu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2jyog6rclu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2jyog6rclu] { font-size: 3rem; }
.photo-placeholder span[b-2jyog6rclu] { font-size: 0.78rem; }
.photo-actions[b-2jyog6rclu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2jyog6rclu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-2jyog6rclu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2jyog6rclu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2jyog6rclu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2jyog6rclu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2jyog6rclu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2jyog6rclu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2jyog6rclu] { filter: brightness(1.15); transform: scale(1.05); }
[b-2jyog6rclu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2jyog6rclu] { padding: 0.75rem; }
    .crud-header[b-2jyog6rclu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2jyog6rclu] { font-size: 1.1rem; }
    .btn-text[b-2jyog6rclu] { display: none; }
    .form-row[b-2jyog6rclu] { flex-direction: column; }
    .form-row-4[b-2jyog6rclu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2jyog6rclu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2jyog6rclu] { max-width: 820px; }
    .modal-body[b-2jyog6rclu] { padding: 0.75rem; }
    .modal-tabs[b-2jyog6rclu] { overflow-x: auto; }
    .modal-tab[b-2jyog6rclu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2jyog6rclu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2jyog6rclu] { display: grid !important; }
    .crud-cards-wrapper[b-2jyog6rclu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2jyog6rclu] { grid-template-columns: 1fr; }
    .card-details[b-2jyog6rclu] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-2jyog6rclu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2jyog6rclu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2jyog6rclu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2jyog6rclu] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-2jyog6rclu] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-2jyog6rclu] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-2jyog6rclu] { flex: 1.6; }
.far-switch[b-2jyog6rclu] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-2jyog6rclu] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-2jyog6rclu] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-2jyog6rclu] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-2jyog6rclu] { color:#93c5fd; }
.far-cold[b-2jyog6rclu] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-2jyog6rclu] { color:#7dd3fc !important; }
.badge-warn[b-2jyog6rclu] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-2jyog6rclu] { color:#fcd34d; }
.badge-func[b-2jyog6rclu] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-2jyog6rclu] { color:#a5b4fc; }
.far-row-venc td[b-2jyog6rclu] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-2jyog6rclu] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-2jyog6rclu] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-2jyog6rclu], .pc-addbar select[b-2jyog6rclu] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-2jyog6rclu] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-2jyog6rclu] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-2jyog6rclu] { background:rgba(37,99,235,0.12); }

/* ── Perfil Contable por Documento ── */
.far-input[b-2jyog6rclu] { padding:.4rem .55rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; font-size:.82rem; color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-input,#fff); outline:none; width:100%; transition:border-color .15s; }
.far-input:focus[b-2jyog6rclu] { border-color:var(--rg-accent,#4f46e5); box-shadow:0 0 0 2px rgba(79,70,229,.15); }
.far-input:disabled[b-2jyog6rclu] { background:var(--rg-bg-subtle,#f8fafc); color:var(--rg-text-muted,#94a3b8); }
.far-input-sm[b-2jyog6rclu] { padding:.3rem .4rem; font-size:.78rem; }

.far-tot[b-2jyog6rclu] { display:inline-flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.5rem; padding:0 .45rem; border-radius:1rem; background:rgba(13,148,136,.14); color:#0d9488; font-weight:700; font-size:.74rem; }
[data-mode="dark"] .far-tot[b-2jyog6rclu] { background:rgba(13,148,136,.22); color:#5eead4; }

.btn-sm[b-2jyog6rclu] { padding:.32rem .6rem; font-size:.74rem; }

/* selectores de movimiento DEB/CRE */
.mov-deb[b-2jyog6rclu] { color:#1d4ed8; font-weight:700; }
.mov-cre[b-2jyog6rclu] { color:#b45309; font-weight:700; }
[data-mode="dark"] .mov-deb[b-2jyog6rclu] { color:#93c5fd; }
[data-mode="dark"] .mov-cre[b-2jyog6rclu] { color:#fcd34d; }

.pc-section-head[b-2jyog6rclu] { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin:1.1rem 0 .35rem; }
.pc-section-head .far-section-title[b-2jyog6rclu] { margin:0; border:none; padding:0; }

.pc-balance-hint[b-2jyog6rclu] { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pc-balance-hint i[b-2jyog6rclu] { margin-right:.2rem; }
.pc-hint-note[b-2jyog6rclu] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); flex:1; min-width:200px; }

.pc-empty[b-2jyog6rclu] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.8rem; border:1px dashed var(--rg-border,#e2e8f0); border-radius:.5rem; }

.pc-lineas td[b-2jyog6rclu] { vertical-align:top; }
.pc-cuenta-nom[b-2jyog6rclu] { display:flex; align-items:center; gap:.3rem; margin-top:.2rem; font-size:.72rem; color:#0d9488; }
[data-mode="dark"] .pc-cuenta-nom[b-2jyog6rclu] { color:#5eead4; }
.pc-cuenta-nom i[b-2jyog6rclu] { font-size:.8rem; }

/* ── Contenido del modal de ayuda ── */
.help-icon-header[b-2jyog6rclu] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-2jyog6rclu] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-2jyog6rclu] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-2jyog6rclu] { border-bottom:none; }
.help-section p[b-2jyog6rclu] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.4rem; }
.help-section ul[b-2jyog6rclu] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-2jyog6rclu] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.2rem; }
.help-section-title[b-2jyog6rclu] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-2jyog6rclu] { color:var(--rg-accent,#2563eb); }

/* ── POS ── */
.pos-context[b-2jyog6rclu] { display:flex; gap:.75rem; flex-wrap:wrap; align-items:flex-end; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; margin-bottom:.8rem; }
.pos-ctx-field[b-2jyog6rclu] { display:flex; flex-direction:column; gap:.2rem; min-width:160px; }
.pos-ctx-field > label[b-2jyog6rclu] { font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted,#94a3b8); }
.pos-ctx-grow[b-2jyog6rclu] { flex:1; min-width:240px; }
.pos-cliente-ok[b-2jyog6rclu] { font-size:.74rem; color:#0d9488; margin-top:.15rem; display:inline-flex; align-items:center; gap:.3rem; }
[data-mode="dark"] .pos-cliente-ok[b-2jyog6rclu] { color:#5eead4; }
.pos-modo[b-2jyog6rclu] { display:flex; gap:.3rem; }
.pos-modo-btn[b-2jyog6rclu] { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.pos-modo-btn.active[b-2jyog6rclu] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }

.pos-grid[b-2jyog6rclu] { display:grid; grid-template-columns: 1fr 1fr; gap:.8rem; }
@media (max-width: 900px) { .pos-grid[b-2jyog6rclu] { grid-template-columns: 1fr; } }
.pos-left[b-2jyog6rclu], .pos-right[b-2jyog6rclu] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; min-height:300px; }
.pos-panel-head[b-2jyog6rclu] { display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.5rem; padding-bottom:.4rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.pos-panel-head i[b-2jyog6rclu] { color:var(--rg-accent,#2563eb); }

.pos-empty[b-2jyog6rclu] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; padding:2rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.85rem; }
.pos-empty i[b-2jyog6rclu] { font-size:1.8rem; }

.pos-cola[b-2jyog6rclu] { display:flex; flex-direction:column; gap:.4rem; max-height:calc(100vh - 360px); overflow-y:auto; }
.pos-cola-item[b-2jyog6rclu] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .7rem; cursor:pointer; }
.pos-cola-item.active[b-2jyog6rclu] { border-color:var(--rg-accent,#2563eb); box-shadow:0 0 0 2px rgba(37,99,235,.15); }
.pos-cola-num[b-2jyog6rclu] { font-weight:700; font-size:.84rem; color:var(--rg-text-primary,#1e293b); }
.pos-cola-cli[b-2jyog6rclu] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pos-cola-meta[b-2jyog6rclu] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }

.pos-prod-list[b-2jyog6rclu] { display:flex; flex-direction:column; gap:.35rem; max-height:calc(100vh - 400px); overflow-y:auto; }
.pos-prod-item[b-2jyog6rclu] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .65rem; cursor:pointer; }
.pos-prod-item:hover[b-2jyog6rclu] { border-color:var(--rg-accent,#2563eb); }
.pos-prod-nom[b-2jyog6rclu] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.pos-prod-meta[b-2jyog6rclu] { display:flex; gap:.7rem; flex-wrap:wrap; font-size:.72rem; color:var(--rg-text-muted,#94a3b8); margin-top:.15rem; align-items:center; }
.pos-nostock[b-2jyog6rclu] { color:#dc2626; font-weight:600; }

.pos-cart[b-2jyog6rclu] { overflow-x:auto; }
.pos-cart-table[b-2jyog6rclu] { width:100%; }
.pos-cart-table input.far-input-sm[b-2jyog6rclu] { width:100%; text-align:right; }

.pos-totales[b-2jyog6rclu] { margin-top:.6rem; border-top:1px solid var(--rg-border,#e2e8f0); padding-top:.5rem; }
.pos-totales > div[b-2jyog6rclu] { display:flex; justify-content:space-between; font-size:.84rem; color:var(--rg-text-secondary,#475569); padding:.15rem 0; }
.pos-ars[b-2jyog6rclu] { color:#0d9488 !important; }
.pos-ars i[b-2jyog6rclu] { margin-right:.2rem; }
[data-mode="dark"] .pos-ars[b-2jyog6rclu] { color:#5eead4 !important; }
.pos-total-grande[b-2jyog6rclu] { font-size:1.05rem !important; color:var(--rg-text-primary,#1e293b) !important; font-weight:700; border-top:1px dashed var(--rg-border,#e2e8f0); margin-top:.25rem; padding-top:.4rem !important; }

.pos-pagos-head[b-2jyog6rclu] { margin-top:.8rem; }
.pos-pagos-actions[b-2jyog6rclu] { display:flex; gap:.3rem; }
.pos-pago-row[b-2jyog6rclu] { display:flex; gap:.4rem; align-items:center; margin-bottom:.35rem; }
.pos-pago-row .far-input-sm[b-2jyog6rclu] { flex:1; }
.pos-pago-resumen[b-2jyog6rclu] { display:flex; justify-content:space-between; font-size:.8rem; color:var(--rg-text-secondary,#475569); background:var(--rg-bg-subtle,#f8fafc); border-radius:.45rem; padding:.4rem .6rem; margin:.3rem 0 .6rem; }
.pos-pago-resumen.ok[b-2jyog6rclu] { color:#0d9488; }
[data-mode="dark"] .pos-pago-resumen.ok[b-2jyog6rclu] { color:#5eead4; }
.pos-facturar[b-2jyog6rclu] { width:100%; justify-content:center; font-size:.95rem; padding:.7rem; }

/* Evidencia fotográfica */
.pos-evid-head[b-2jyog6rclu] { margin-top:.8rem; }
.pos-evid-actions[b-2jyog6rclu] { display:flex; gap:.3rem; }
.pos-evid-btn[b-2jyog6rclu] { display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; cursor:pointer; font-size:.9rem; }
.pos-evid-btn:hover[b-2jyog6rclu] { border-color:var(--rg-accent,#2563eb); color:var(--rg-accent,#2563eb); }
.pos-evid-btn.uploading[b-2jyog6rclu] { opacity:.7; pointer-events:none; }
.pos-evid-empty[b-2jyog6rclu] { font-size:.76rem; color:var(--rg-text-muted,#94a3b8); padding:.5rem 0; }
.pos-qr[b-2jyog6rclu] { display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:.5rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; margin-bottom:.5rem; }
.pos-qr img[b-2jyog6rclu] { width:140px; height:140px; }
.pos-qr span[b-2jyog6rclu] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.pos-evid-galeria[b-2jyog6rclu] { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.5rem; }
.pos-evid-thumb[b-2jyog6rclu] { width:54px; height:54px; border-radius:.4rem; overflow:hidden; border:1px solid var(--rg-border,#e2e8f0); }
.pos-evid-thumb img[b-2jyog6rclu] { width:100%; height:100%; object-fit:cover; }

/* Modales anidados (envío sobre post-grabado) */
.modal-backdrop-nested[b-2jyog6rclu] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-2jyog6rclu] { z-index: 2001 !important; }

/* Post-grabado */
.ps-recibo-info[b-2jyog6rclu] { display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .75rem; margin-bottom:.5rem; }
.ps-label[b-2jyog6rclu] { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-muted,#94a3b8); }
.ps-value[b-2jyog6rclu] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.ps-acciones[b-2jyog6rclu] { display:flex; flex-direction:column; gap:.5rem; margin-top:.5rem; }
.ps-acciones .btn-crud[b-2jyog6rclu] { width:100%; justify-content:center; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Operacion/Frmfar_transferencias.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3p6nyicp3f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3p6nyicp3f 0.3s ease-out; }
@keyframes slideUp-b-3p6nyicp3f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3p6nyicp3f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3p6nyicp3f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3p6nyicp3f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3p6nyicp3f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3p6nyicp3f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3p6nyicp3f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3p6nyicp3f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3p6nyicp3f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3p6nyicp3f] { filter: brightness(1.1); }
.btn-outline[b-3p6nyicp3f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3p6nyicp3f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3p6nyicp3f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3p6nyicp3f] { filter: brightness(1.1); }
.btn-icon[b-3p6nyicp3f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3p6nyicp3f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3p6nyicp3f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3p6nyicp3f] { color: #ef4444; }
.btn-delete:hover[b-3p6nyicp3f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3p6nyicp3f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3p6nyicp3f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3p6nyicp3f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3p6nyicp3f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3p6nyicp3f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3p6nyicp3f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3p6nyicp3f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3p6nyicp3f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3p6nyicp3f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3p6nyicp3f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3p6nyicp3f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3p6nyicp3f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3p6nyicp3f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3p6nyicp3f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3p6nyicp3f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3p6nyicp3f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3p6nyicp3f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3p6nyicp3f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3p6nyicp3f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3p6nyicp3f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3p6nyicp3f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3p6nyicp3f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3p6nyicp3f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3p6nyicp3f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3p6nyicp3f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3p6nyicp3f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3p6nyicp3f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3p6nyicp3f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3p6nyicp3f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3p6nyicp3f] { display: block; }
.hide-on-cards[b-3p6nyicp3f] { display: none !important; }
.show-on-cards[b-3p6nyicp3f] { display: grid; }
.hide-on-grid[b-3p6nyicp3f] { display: none !important; }

/* Badges */
.badge[b-3p6nyicp3f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3p6nyicp3f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3p6nyicp3f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3p6nyicp3f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3p6nyicp3f] { text-align: center; }
.text-muted[b-3p6nyicp3f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3p6nyicp3f], .crud-empty-state[b-3p6nyicp3f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3p6nyicp3f] { font-size: 2rem; }
.crud-spinner[b-3p6nyicp3f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3p6nyicp3f 0.6s linear infinite; }
.crud-spinner-sm[b-3p6nyicp3f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3p6nyicp3f 0.6s linear infinite; }
@keyframes spin-b-3p6nyicp3f { to { transform: rotate(360deg); } }
.spin[b-3p6nyicp3f] { animation: spin-b-3p6nyicp3f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3p6nyicp3f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3p6nyicp3f 0.15s ease-out; }
.modal-container[b-3p6nyicp3f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3p6nyicp3f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3p6nyicp3f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-3p6nyicp3f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-3p6nyicp3f] { max-width: 420px; }
@keyframes fadeIn-b-3p6nyicp3f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3p6nyicp3f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3p6nyicp3f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3p6nyicp3f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3p6nyicp3f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3p6nyicp3f] { color: #dc2626; }
.modal-close[b-3p6nyicp3f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3p6nyicp3f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3p6nyicp3f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3p6nyicp3f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3p6nyicp3f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3p6nyicp3f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3p6nyicp3f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3p6nyicp3f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3p6nyicp3f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3p6nyicp3f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3p6nyicp3f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3p6nyicp3f] { flex: 2; }
.form-group label[b-3p6nyicp3f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3p6nyicp3f], .form-group select[b-3p6nyicp3f], .form-textarea[b-3p6nyicp3f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3p6nyicp3f], .form-group select:focus[b-3p6nyicp3f], .form-textarea:focus[b-3p6nyicp3f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3p6nyicp3f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3p6nyicp3f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3p6nyicp3f] { flex: 1; display: flex; align-items: center; }
.form-check[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3p6nyicp3f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3p6nyicp3f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3p6nyicp3f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3p6nyicp3f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3p6nyicp3f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3p6nyicp3f] { font-size: 3rem; }
.photo-placeholder span[b-3p6nyicp3f] { font-size: 0.78rem; }
.photo-actions[b-3p6nyicp3f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3p6nyicp3f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-3p6nyicp3f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3p6nyicp3f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3p6nyicp3f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3p6nyicp3f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3p6nyicp3f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3p6nyicp3f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3p6nyicp3f] { filter: brightness(1.15); transform: scale(1.05); }
[b-3p6nyicp3f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3p6nyicp3f] { padding: 0.75rem; }
    .crud-header[b-3p6nyicp3f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3p6nyicp3f] { font-size: 1.1rem; }
    .btn-text[b-3p6nyicp3f] { display: none; }
    .form-row[b-3p6nyicp3f] { flex-direction: column; }
    .form-row-4[b-3p6nyicp3f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3p6nyicp3f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3p6nyicp3f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-3p6nyicp3f] { padding: 0.75rem; }
    .modal-tabs[b-3p6nyicp3f] { overflow-x: auto; }
    .modal-tab[b-3p6nyicp3f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3p6nyicp3f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3p6nyicp3f] { display: grid !important; }
    .crud-cards-wrapper[b-3p6nyicp3f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3p6nyicp3f] { grid-template-columns: 1fr; }
    .card-details[b-3p6nyicp3f] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-3p6nyicp3f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3p6nyicp3f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3p6nyicp3f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3p6nyicp3f] { background:rgba(37,99,235,.25); }

/* ── Tabs / chips transferencias ── */
.trf-tabs[b-3p6nyicp3f] { display:flex; gap:.3rem; border-bottom:1px solid var(--rg-border,#e2e8f0); margin-bottom:.8rem; }
.trf-tab[b-3p6nyicp3f] { background:none; border:none; border-bottom:2px solid transparent; padding:.5rem .9rem; cursor:pointer; color:var(--rg-text-secondary,#475569); font-size:.85rem; font-weight:600; display:inline-flex; align-items:center; gap:.4rem; }
.trf-tab.on[b-3p6nyicp3f] { color:var(--rg-accent,#2563eb); border-bottom-color:var(--rg-accent,#2563eb); }
.trf-filtros[b-3p6nyicp3f] { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.8rem; }
.trf-chip[b-3p6nyicp3f] { display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; padding:.35rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:1rem; cursor:pointer; }
.trf-chip.on[b-3p6nyicp3f] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }
.trf-prod-bar[b-3p6nyicp3f] { display:flex; align-items:center; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f1f5f9); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .8rem; margin-bottom:.7rem; font-size:.85rem; }
.btn-crud.btn-sm[b-3p6nyicp3f] { padding:.3rem .6rem; font-size:.78rem; }
.badge-warn[b-3p6nyicp3f] { background:rgba(217,119,6,.14); color:#b45309; }
[data-mode="dark"] .badge-warn[b-3p6nyicp3f] { color:#fcd34d; }
/* _content/Rgclouds.Web/Components/Pages/Farmacia/Regulatorio/Frmfar_libro_controlados.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-el16tw4o4w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-el16tw4o4w 0.3s ease-out; }
@keyframes slideUp-b-el16tw4o4w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-el16tw4o4w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-el16tw4o4w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-el16tw4o4w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-el16tw4o4w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-el16tw4o4w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-el16tw4o4w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-el16tw4o4w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-el16tw4o4w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-el16tw4o4w] { filter: brightness(1.1); }
.btn-outline[b-el16tw4o4w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-el16tw4o4w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-el16tw4o4w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-el16tw4o4w] { filter: brightness(1.1); }
.btn-icon[b-el16tw4o4w] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-el16tw4o4w] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-el16tw4o4w] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-el16tw4o4w] { color: #ef4444; }
.btn-delete:hover[b-el16tw4o4w] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-el16tw4o4w] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-el16tw4o4w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-el16tw4o4w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-el16tw4o4w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-el16tw4o4w] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-el16tw4o4w] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-el16tw4o4w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-el16tw4o4w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-el16tw4o4w] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-el16tw4o4w] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-el16tw4o4w] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-el16tw4o4w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-el16tw4o4w] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-el16tw4o4w] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-el16tw4o4w] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-el16tw4o4w] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-el16tw4o4w] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-el16tw4o4w] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-el16tw4o4w] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-el16tw4o4w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-el16tw4o4w] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-el16tw4o4w] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-el16tw4o4w] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-el16tw4o4w] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-el16tw4o4w] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-el16tw4o4w] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-el16tw4o4w] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-el16tw4o4w] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-el16tw4o4w] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-el16tw4o4w] { display: block; }
.hide-on-cards[b-el16tw4o4w] { display: none !important; }
.show-on-cards[b-el16tw4o4w] { display: grid; }
.hide-on-grid[b-el16tw4o4w] { display: none !important; }

/* Badges */
.badge[b-el16tw4o4w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-el16tw4o4w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-el16tw4o4w] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-el16tw4o4w] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-el16tw4o4w] { text-align: center; }
.text-muted[b-el16tw4o4w] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-el16tw4o4w], .crud-empty-state[b-el16tw4o4w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-el16tw4o4w] { font-size: 2rem; }
.crud-spinner[b-el16tw4o4w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-el16tw4o4w 0.6s linear infinite; }
.crud-spinner-sm[b-el16tw4o4w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-el16tw4o4w 0.6s linear infinite; }
@keyframes spin-b-el16tw4o4w { to { transform: rotate(360deg); } }
.spin[b-el16tw4o4w] { animation: spin-b-el16tw4o4w 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-el16tw4o4w] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-el16tw4o4w 0.15s ease-out; }
.modal-container[b-el16tw4o4w] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-el16tw4o4w] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-el16tw4o4w 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-el16tw4o4w] { max-width: 820px; }
.modal-sm[b-el16tw4o4w] { max-width: 420px; }
@keyframes fadeIn-b-el16tw4o4w { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-el16tw4o4w { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-el16tw4o4w] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-el16tw4o4w] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-el16tw4o4w] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-el16tw4o4w] { color: #dc2626; }
.modal-close[b-el16tw4o4w] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-el16tw4o4w] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-el16tw4o4w] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-el16tw4o4w] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-el16tw4o4w] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-el16tw4o4w] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-el16tw4o4w] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-el16tw4o4w] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-el16tw4o4w] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-el16tw4o4w] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-el16tw4o4w] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-el16tw4o4w] { flex: 2; }
.form-group label[b-el16tw4o4w] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-el16tw4o4w], .form-group select[b-el16tw4o4w], .form-textarea[b-el16tw4o4w] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-el16tw4o4w], .form-group select:focus[b-el16tw4o4w], .form-textarea:focus[b-el16tw4o4w] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-el16tw4o4w] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-el16tw4o4w] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-el16tw4o4w] { flex: 1; display: flex; align-items: center; }
.form-check[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-el16tw4o4w] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-el16tw4o4w] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-el16tw4o4w] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-el16tw4o4w] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-el16tw4o4w] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-el16tw4o4w] { font-size: 3rem; }
.photo-placeholder span[b-el16tw4o4w] { font-size: 0.78rem; }
.photo-actions[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-el16tw4o4w] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-el16tw4o4w] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-el16tw4o4w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-el16tw4o4w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-el16tw4o4w] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-el16tw4o4w] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-el16tw4o4w] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-el16tw4o4w] { filter: brightness(1.15); transform: scale(1.05); }
[b-el16tw4o4w] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-el16tw4o4w] { padding: 0.75rem; }
    .crud-header[b-el16tw4o4w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-el16tw4o4w] { font-size: 1.1rem; }
    .btn-text[b-el16tw4o4w] { display: none; }
    .form-row[b-el16tw4o4w] { flex-direction: column; }
    .form-row-4[b-el16tw4o4w] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-el16tw4o4w] { width: 98%; max-height: 95vh; }
    .modal-lg[b-el16tw4o4w] { max-width: 820px; }
    .modal-body[b-el16tw4o4w] { padding: 0.75rem; }
    .modal-tabs[b-el16tw4o4w] { overflow-x: auto; }
    .modal-tab[b-el16tw4o4w] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-el16tw4o4w] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-el16tw4o4w] { display: grid !important; }
    .crud-cards-wrapper[b-el16tw4o4w] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-el16tw4o4w] { grid-template-columns: 1fr; }
    .card-details[b-el16tw4o4w] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-el16tw4o4w] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-el16tw4o4w] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-el16tw4o4w] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-el16tw4o4w] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-el16tw4o4w] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-el16tw4o4w] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-el16tw4o4w] { flex: 1.6; }
.far-switch[b-el16tw4o4w] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-el16tw4o4w] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Perfil Clínico ── */
.pc-cliente-bar[b-el16tw4o4w] { display: flex; flex-direction: column; gap: 0.3rem; max-width: 560px; margin-bottom: 1rem; }
.pc-cliente-bar > label[b-el16tw4o4w] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rg-text-muted); }
.pc-cliente-head[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.7rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 0.7rem 0.9rem; margin-bottom: 0.9rem; }
.pc-cliente-head i[b-el16tw4o4w] { font-size: 1.8rem; color: var(--rg-primary); }
.pc-cliente-head strong[b-el16tw4o4w] { display: block; color: var(--rg-text-primary); }
.pc-cliente-id[b-el16tw4o4w] { font-size: 0.75rem; color: var(--rg-text-muted); }
.pc-tabs[b-el16tw4o4w] { display: flex; gap: 0.25rem; flex-wrap: wrap; border-bottom: 2px solid var(--rg-border); margin-bottom: 1rem; }
.pc-tab[b-el16tw4o4w] { display: inline-flex; align-items: center; gap: 0.4rem; background: transparent; border: none; border-bottom: 2px solid transparent; cursor: pointer; color: var(--rg-text-secondary); font-size: 0.84rem; font-weight: 600; padding: 0.55rem 0.85rem; margin-bottom: -2px; }
.pc-tab:hover[b-el16tw4o4w] { color: var(--rg-text-primary); }
.pc-tab.active[b-el16tw4o4w] { color: var(--rg-primary); border-bottom-color: var(--rg-primary); }
[data-mode="dark"] .pc-tab.active[b-el16tw4o4w] { color: #93c5fd; border-bottom-color: #93c5fd; }
.pc-panel[b-el16tw4o4w] { }
.pc-addbar[b-el16tw4o4w] { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.55rem; padding: 0.6rem; margin-bottom: 0.85rem; }
.pc-addbar input[b-el16tw4o4w], .pc-addbar select[b-el16tw4o4w] { flex: 1; min-width: 130px; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.45rem; padding: 0.4rem 0.55rem; font-size: 0.84rem; }
.pc-actions[b-el16tw4o4w] { margin-top: 0.85rem; display: flex; justify-content: flex-end; }
.pc-empty[b-el16tw4o4w] { color: var(--rg-text-muted); font-size: 0.85rem; text-align: center; padding: 1rem; }
.pc-notas[b-el16tw4o4w] { display: flex; flex-direction: column; gap: 0.6rem; }
.pc-nota[b-el16tw4o4w] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-left: 4px solid var(--rg-primary); border-radius: 0.5rem; padding: 0.6rem 0.8rem; }
.pc-nota-head[b-el16tw4o4w] { display: flex; justify-content: space-between; font-size: 0.74rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.3rem; }
.pc-nota-meta[b-el16tw4o4w] { font-weight: 500; color: var(--rg-text-muted); text-transform: none; letter-spacing: 0; }
.pc-nota-text[b-el16tw4o4w] { font-size: 0.88rem; color: var(--rg-text-primary); white-space: pre-wrap; }
.badge-warn[b-el16tw4o4w] { background: rgba(217,119,6,0.14); color: #92400e; }
[data-mode="dark"] .badge-warn[b-el16tw4o4w] { color: #fcd34d; }
.far-switch[b-el16tw4o4w] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-el16tw4o4w] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }
.form-grow[b-el16tw4o4w] { flex: 1.6; }

/* ── Órdenes: filtros + autocomplete + extras ── */
.am-filtros[b-el16tw4o4w] { display:flex; gap:.75rem; align-items:flex-end; flex-wrap:wrap; margin-bottom:1rem; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.6rem; padding:.85rem; }
.am-field[b-el16tw4o4w] { display:flex; flex-direction:column; gap:.25rem; min-width:200px; }
.am-field-grow[b-el16tw4o4w] { flex:1; min-width:240px; }
.am-field label[b-el16tw4o4w] { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted); }
.am-field select[b-el16tw4o4w] { background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.45rem .6rem; font-size:.85rem; width:100%; }
.am-autocomplete[b-el16tw4o4w] { position:relative; width:100%; }
.am-autocomplete input[b-el16tw4o4w] { background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.45rem .6rem; font-size:.85rem; width:100%; }
.am-dropdown[b-el16tw4o4w] { position:absolute; top:calc(100% + 2px); left:0; right:0; z-index:60; background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:.5rem; box-shadow:0 12px 30px rgba(0,0,0,.15); max-height:300px; overflow-y:auto; }
.am-dropdown-item[b-el16tw4o4w] { display:flex; align-items:center; gap:.5rem; padding:.5rem .7rem; cursor:pointer; border-bottom:1px solid var(--rg-border); font-size:.84rem; color:var(--rg-text-primary); }
.am-dropdown-item:last-child[b-el16tw4o4w] { border-bottom:none; }
.am-dropdown-item:hover[b-el16tw4o4w] { background:var(--rg-bg-hover); }
.am-code[b-el16tw4o4w] { font-family:'Cascadia Code',monospace; font-size:.74rem; color:var(--rg-text-muted); background:var(--rg-bg-subtle); padding:.05rem .35rem; border-radius:.3rem; }
.far-section-title[b-el16tw4o4w] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
[data-mode="dark"] .far-section-title[b-el16tw4o4w] { color:#93c5fd; }
.far-cold[b-el16tw4o4w] { background:rgba(56,189,248,.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-el16tw4o4w] { color:#7dd3fc !important; }
.far-tot[b-el16tw4o4w] { display:flex; flex-wrap:wrap; gap:1.2rem; justify-content:flex-end; padding:.7rem .2rem .2rem; font-size:.9rem; color:var(--rg-text-secondary); border-top:1px solid var(--rg-border); margin-top:.5rem; }
.far-tot strong[b-el16tw4o4w] { color:var(--rg-text-primary); }
.badge-ctrl[b-el16tw4o4w] { background:rgba(234,88,12,.14); color:#c2410c; border:1px solid rgba(234,88,12,.3); padding:.1rem .45rem; border-radius:1rem; font-size:.7rem; font-weight:700; }
[data-mode="dark"] .badge-ctrl[b-el16tw4o4w] { color:#fdba74; }
.am-count[b-el16tw4o4w] { font-size:.78rem; color:var(--rg-text-muted); margin-top:.5rem; }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-el16tw4o4w] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-el16tw4o4w] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-el16tw4o4w] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-el16tw4o4w] { border-bottom: none; }
.help-section p[b-el16tw4o4w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-el16tw4o4w], .help-section ol[b-el16tw4o4w] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-el16tw4o4w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-el16tw4o4w] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-el16tw4o4w] { color: var(--rg-accent,#2563eb); }
.help-example[b-el16tw4o4w] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-el16tw4o4w] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-el16tw4o4w] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-el16tw4o4w] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-el16tw4o4w] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-el16tw4o4w] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-el16tw4o4w] { background: rgba(37,99,235,0.12); }
.help-steps[b-el16tw4o4w] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-el16tw4o4w] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-el16tw4o4w] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-el16tw4o4w] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-el16tw4o4w] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-el16tw4o4w] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-el16tw4o4w] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-el16tw4o4w] { background: rgba(255,255,255,0.04); }
.help-badge[b-el16tw4o4w] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-el16tw4o4w] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-el16tw4o4w] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-el16tw4o4w] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-el16tw4o4w] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-el16tw4o4w] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-el16tw4o4w] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-el16tw4o4w] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-el16tw4o4w] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Fiscal/Frmanulacionitems.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kzztg9vuxk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kzztg9vuxk 0.3s ease-out; }
@keyframes slideUp-b-kzztg9vuxk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kzztg9vuxk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kzztg9vuxk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kzztg9vuxk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kzztg9vuxk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kzztg9vuxk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kzztg9vuxk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kzztg9vuxk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kzztg9vuxk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kzztg9vuxk] { filter: brightness(1.1); }
.btn-outline[b-kzztg9vuxk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kzztg9vuxk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kzztg9vuxk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kzztg9vuxk] { filter: brightness(1.1); }
.btn-icon[b-kzztg9vuxk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kzztg9vuxk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kzztg9vuxk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kzztg9vuxk] { color: #ef4444; }
.btn-delete:hover[b-kzztg9vuxk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kzztg9vuxk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kzztg9vuxk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kzztg9vuxk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kzztg9vuxk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kzztg9vuxk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kzztg9vuxk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kzztg9vuxk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kzztg9vuxk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kzztg9vuxk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kzztg9vuxk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kzztg9vuxk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kzztg9vuxk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kzztg9vuxk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kzztg9vuxk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kzztg9vuxk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kzztg9vuxk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kzztg9vuxk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kzztg9vuxk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kzztg9vuxk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kzztg9vuxk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kzztg9vuxk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kzztg9vuxk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kzztg9vuxk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kzztg9vuxk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kzztg9vuxk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kzztg9vuxk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kzztg9vuxk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kzztg9vuxk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kzztg9vuxk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kzztg9vuxk] { display: block; }
.hide-on-cards[b-kzztg9vuxk] { display: none !important; }
.show-on-cards[b-kzztg9vuxk] { display: grid; }
.hide-on-grid[b-kzztg9vuxk] { display: none !important; }

/* Badges */
.badge[b-kzztg9vuxk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kzztg9vuxk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kzztg9vuxk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kzztg9vuxk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kzztg9vuxk] { text-align: center; }
.text-muted[b-kzztg9vuxk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kzztg9vuxk], .crud-empty-state[b-kzztg9vuxk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kzztg9vuxk] { font-size: 2rem; }
.crud-spinner[b-kzztg9vuxk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kzztg9vuxk 0.6s linear infinite; }
.crud-spinner-sm[b-kzztg9vuxk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kzztg9vuxk 0.6s linear infinite; }
@keyframes spin-b-kzztg9vuxk { to { transform: rotate(360deg); } }
.spin[b-kzztg9vuxk] { animation: spin-b-kzztg9vuxk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kzztg9vuxk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kzztg9vuxk 0.15s ease-out; }
.modal-container[b-kzztg9vuxk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kzztg9vuxk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kzztg9vuxk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kzztg9vuxk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kzztg9vuxk] { max-width: 420px; }
@keyframes fadeIn-b-kzztg9vuxk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kzztg9vuxk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kzztg9vuxk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kzztg9vuxk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kzztg9vuxk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kzztg9vuxk] { color: #dc2626; }
.modal-close[b-kzztg9vuxk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kzztg9vuxk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kzztg9vuxk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kzztg9vuxk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kzztg9vuxk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kzztg9vuxk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kzztg9vuxk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kzztg9vuxk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kzztg9vuxk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kzztg9vuxk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kzztg9vuxk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kzztg9vuxk] { flex: 2; }
.form-group label[b-kzztg9vuxk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kzztg9vuxk], .form-group select[b-kzztg9vuxk], .form-textarea[b-kzztg9vuxk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kzztg9vuxk], .form-group select:focus[b-kzztg9vuxk], .form-textarea:focus[b-kzztg9vuxk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kzztg9vuxk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kzztg9vuxk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kzztg9vuxk] { flex: 1; display: flex; align-items: center; }
.form-check[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kzztg9vuxk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kzztg9vuxk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kzztg9vuxk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kzztg9vuxk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kzztg9vuxk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kzztg9vuxk] { font-size: 3rem; }
.photo-placeholder span[b-kzztg9vuxk] { font-size: 0.78rem; }
.photo-actions[b-kzztg9vuxk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kzztg9vuxk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kzztg9vuxk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kzztg9vuxk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kzztg9vuxk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kzztg9vuxk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kzztg9vuxk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kzztg9vuxk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kzztg9vuxk] { filter: brightness(1.15); transform: scale(1.05); }
[b-kzztg9vuxk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kzztg9vuxk] { padding: 0.75rem; }
    .crud-header[b-kzztg9vuxk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kzztg9vuxk] { font-size: 1.1rem; }
    .btn-text[b-kzztg9vuxk] { display: none; }
    .form-row[b-kzztg9vuxk] { flex-direction: column; }
    .form-row-4[b-kzztg9vuxk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kzztg9vuxk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kzztg9vuxk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kzztg9vuxk] { padding: 0.75rem; }
    .modal-tabs[b-kzztg9vuxk] { overflow-x: auto; }
    .modal-tab[b-kzztg9vuxk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kzztg9vuxk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kzztg9vuxk] { display: grid !important; }
    .crud-cards-wrapper[b-kzztg9vuxk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kzztg9vuxk] { grid-template-columns: 1fr; }
    .card-details[b-kzztg9vuxk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kzztg9vuxk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kzztg9vuxk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kzztg9vuxk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kzztg9vuxk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Frutas/Frmfru_maestraproducto.razor.rz.scp.css */
/* ============================================================
   Frmfru_maestraproducto — Estilos CRUD + Modal + Tabs + Imagen
   Copiado de Frmclientes.razor.css (CSS isolation de Blazor
   NO hereda entre componentes — debe ser auto-contenido).
   Tokens --rg-* para soporte de tema oscuro. Sin hex hardcoded.
   ============================================================ */

.crud-container[b-yucvntzcjr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yucvntzcjr 0.3s ease-out; }
@keyframes slideUp-b-yucvntzcjr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yucvntzcjr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yucvntzcjr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yucvntzcjr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yucvntzcjr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yucvntzcjr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yucvntzcjr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yucvntzcjr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yucvntzcjr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yucvntzcjr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yucvntzcjr] { filter: brightness(1.1); }
.btn-outline[b-yucvntzcjr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yucvntzcjr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yucvntzcjr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yucvntzcjr] { filter: brightness(1.1); }
.btn-warning[b-yucvntzcjr] { background: #d97706; color: #fff; }
.btn-warning:hover:not(:disabled)[b-yucvntzcjr] { filter: brightness(1.1); }
.btn-icon[b-yucvntzcjr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yucvntzcjr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yucvntzcjr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yucvntzcjr] { color: #ef4444; }
.btn-delete:hover[b-yucvntzcjr] { background: rgba(239, 68, 68, 0.1); }
.btn-toggle-inactivar[b-yucvntzcjr] { color: #d97706; }
.btn-toggle-inactivar:hover[b-yucvntzcjr] { background: rgba(217, 119, 6, 0.1); }
.btn-toggle-activar[b-yucvntzcjr] { color: #16a34a; }
.btn-toggle-activar:hover[b-yucvntzcjr] { background: rgba(22, 163, 74, 0.1); }

/* Alert */
.crud-alert[b-yucvntzcjr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yucvntzcjr] { background: rgba(34, 197, 94, 0.12); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-yucvntzcjr]   { background: rgba(239, 68, 68, 0.12);  color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-yucvntzcjr] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-yucvntzcjr]   { color: #fca5a5; }
.crud-alert-close[b-yucvntzcjr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yucvntzcjr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yucvntzcjr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yucvntzcjr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-btn[b-yucvntzcjr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; display: flex; align-items: center; }
.crud-search-btn:hover[b-yucvntzcjr] { color: var(--rg-accent, #4f46e5); }
.crud-search-clear[b-yucvntzcjr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yucvntzcjr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yucvntzcjr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yucvntzcjr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yucvntzcjr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yucvntzcjr] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yucvntzcjr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yucvntzcjr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yucvntzcjr] { width: 80px; text-align: center; white-space: nowrap; }

/* Foto mini en grid */
.fru-foto-sm[b-yucvntzcjr] { width: 32px; height: 32px; border-radius: 6px; overflow: hidden; background: var(--rg-bg-subtle, #f1f5f9); display: flex; align-items: center; justify-content: center; }
.fru-foto-sm img[b-yucvntzcjr] { width: 100%; height: 100%; object-fit: cover; }
.fru-foto-placeholder[b-yucvntzcjr] { color: var(--rg-text-muted, #94a3b8); font-size: 1.1rem; }

/* Badges */
.badge[b-yucvntzcjr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yucvntzcjr] { background: rgba(34, 197, 94, 0.15); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.badge-no[b-yucvntzcjr]  { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #64748b); border: 1px solid var(--rg-border, #e2e8f0); }
[data-mode="dark"] .badge-yes[b-yucvntzcjr] { color: #86efac; }

/* Utilities */
.font-mono[b-yucvntzcjr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yucvntzcjr] { text-align: center; }
.text-muted[b-yucvntzcjr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yucvntzcjr], .crud-empty-state[b-yucvntzcjr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yucvntzcjr] { font-size: 2rem; }
.crud-spinner[b-yucvntzcjr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yucvntzcjr 0.6s linear infinite; }
.crud-spinner-sm[b-yucvntzcjr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yucvntzcjr 0.6s linear infinite; }
@keyframes spin-b-yucvntzcjr { to { transform: rotate(360deg); } }
.spin[b-yucvntzcjr] { animation: spin-b-yucvntzcjr 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-yucvntzcjr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yucvntzcjr 0.15s ease-out; }
.modal-container[b-yucvntzcjr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yucvntzcjr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yucvntzcjr 0.2s ease-out; }
.modal-lg[b-yucvntzcjr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yucvntzcjr] { max-width: 420px; }
@keyframes fadeIn-b-yucvntzcjr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yucvntzcjr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yucvntzcjr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yucvntzcjr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yucvntzcjr] { border-bottom-color: rgba(239,68,68,0.4); }
.modal-header-danger h2[b-yucvntzcjr] { color: #dc2626; }
[data-mode="dark"] .modal-header-danger h2[b-yucvntzcjr] { color: #fca5a5; }
.modal-header-warning[b-yucvntzcjr] { border-bottom-color: rgba(217,119,6,0.4); }
.modal-header-warning h2[b-yucvntzcjr] { color: #d97706; }
[data-mode="dark"] .modal-header-warning h2[b-yucvntzcjr] { color: #fbbf24; }
.modal-header-success[b-yucvntzcjr] { border-bottom-color: rgba(22,163,74,0.4); }
.modal-header-success h2[b-yucvntzcjr] { color: #16a34a; }
[data-mode="dark"] .modal-header-success h2[b-yucvntzcjr] { color: #86efac; }
.modal-close[b-yucvntzcjr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yucvntzcjr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yucvntzcjr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yucvntzcjr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yucvntzcjr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); flex-shrink: 0; padding: 0 1.25rem; }
.modal-tab[b-yucvntzcjr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover:not(:disabled)[b-yucvntzcjr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yucvntzcjr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }
.modal-tab.disabled[b-yucvntzcjr], .modal-tab:disabled[b-yucvntzcjr] { opacity: 0.4; cursor: not-allowed; }

/* Form */
.form-row[b-yucvntzcjr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yucvntzcjr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yucvntzcjr] { flex: 2; }
.form-group label[b-yucvntzcjr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yucvntzcjr], .form-group select[b-yucvntzcjr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yucvntzcjr], .form-group select:focus[b-yucvntzcjr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yucvntzcjr], .form-group input[readonly][b-yucvntzcjr] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); cursor: default; }
.form-check-group[b-yucvntzcjr] { flex: 1; display: flex; align-items: center; }
.form-check[b-yucvntzcjr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yucvntzcjr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yucvntzcjr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 1rem 0; }
.photo-preview[b-yucvntzcjr] { width: 200px; height: 200px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-subtle, #f8fafc); }
.photo-preview img[b-yucvntzcjr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yucvntzcjr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yucvntzcjr] { font-size: 3rem; }
.photo-actions[b-yucvntzcjr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yucvntzcjr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos foto */
.btn-icon-round[b-yucvntzcjr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yucvntzcjr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yucvntzcjr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yucvntzcjr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yucvntzcjr] { filter: brightness(1.15); transform: scale(1.05); }

/* Grid de precios (tab Precios) */
.fru-precios-grid-header[b-yucvntzcjr] {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-secondary, #475569);
    padding: 0.3rem 0.4rem 0.3rem 0;
    width: 33%;
}
.fru-precios-row[b-yucvntzcjr] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.4rem;
    padding: 0.3rem 0.5rem;
    border-radius: 0.375rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-card, #fff);
}
.fru-precios-label[b-yucvntzcjr] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    width: 70px;
    flex-shrink: 0;
}
.fru-precios-row .form-group[b-yucvntzcjr] { margin-bottom: 0; }

/* Nota de inventario */
.fru-inv-note[b-yucvntzcjr] {
    margin-top: 1rem;
    padding: 0.6rem 0.8rem;
    border-radius: 0.375rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yucvntzcjr] { padding: 0.75rem; }
    .crud-header[b-yucvntzcjr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yucvntzcjr] { font-size: 1.1rem; }
    .btn-text[b-yucvntzcjr] { display: none; }
    .form-row[b-yucvntzcjr] { flex-direction: column; }
    .modal-dialog[b-yucvntzcjr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yucvntzcjr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yucvntzcjr] { padding: 0.75rem; }
    .modal-tabs[b-yucvntzcjr] { overflow-x: auto; }
    .modal-tab[b-yucvntzcjr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
    .fru-precios-grid-header[b-yucvntzcjr] { width: auto; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Frmfru_pos.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════════════════════
   POS Frutas — Frmfru_pos.razor.css
   Full-page card-based POS: izquierda catálogo | derecha documento
   Tokens --rg-* para soporte dark/light completo
   Basado en Frmoptmasteroptical.razor.css (sin sección receta médica)
   ══════════════════════════════════════════════════════════════════════════ */

.pos-wrapper[b-olfxnh7dq9] {
    display: flex;
    flex-direction: column;
    /* 60px = app-header height  |  3rem = padding 1.5rem top + 1.5rem bottom de app-content */
    height: calc(100vh - 60px - 3rem);
    background: var(--rg-bg-page);
    overflow: hidden;
}

/* ── Barra de modo ── */
.pos-modebar[b-olfxnh7dq9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 14px;
    background: var(--rg-bg-card);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.pos-mode-toggle[b-olfxnh7dq9] {
    display: inline-flex;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    overflow: hidden;
}
.pos-mode-btn[b-olfxnh7dq9] {
    border: none;
    padding: 6px 16px;
    background: var(--rg-bg-card);
    color: var(--rg-text-secondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border-right: 1px solid var(--rg-border);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    transition: background .15s, color .15s;
}
.pos-mode-btn:last-child[b-olfxnh7dq9] { border-right: none; }
.pos-mode-btn:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); }
.pos-mode-btn.active.cot[b-olfxnh7dq9] { background: #e85d00; color: #fff; }
.pos-mode-btn.active.fac[b-olfxnh7dq9] { background: var(--rg-primary); color: #fff; }
.pos-mode-tag[b-olfxnh7dq9] { font-size: 9px; opacity: .75; letter-spacing: .06em; text-transform: uppercase; }

.pos-modebar-right[b-olfxnh7dq9] { margin-left: auto; display: flex; align-items: center; gap: 8px; }
/* ── Toast de alerta flotante (reemplaza pos-flash) ── */
.pos-toast[b-olfxnh7dq9] {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 10px 14px; border-radius: 6px;
    font-size: 12.5px; line-height: 1.4;
    border-left: 4px solid transparent;
    margin: 0 8px 4px;
    animation: pos-toast-in-b-olfxnh7dq9 .2s ease;
}
@keyframes pos-toast-in-b-olfxnh7dq9 { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.pos-toast.success[b-olfxnh7dq9] { background: rgba(34,197,94,.12); color: #166534; border-left-color: #16a34a; }
.pos-toast.error[b-olfxnh7dq9]   { background: rgba(239,68,68,.12); color: #b91c1c; border-left-color: #dc2626; }
[data-mode="dark"] .pos-toast.success[b-olfxnh7dq9] { background: rgba(34,197,94,.15); color: #86efac; }
[data-mode="dark"] .pos-toast.error[b-olfxnh7dq9]   { background: rgba(239,68,68,.15); color: #fca5a5; }
.pos-toast i[b-olfxnh7dq9] { flex-shrink: 0; margin-top: 1px; }
.pos-toast-text[b-olfxnh7dq9] { flex: 1; white-space: normal; word-break: break-word; }
.pos-toast-close[b-olfxnh7dq9] { border: none; background: transparent; cursor: pointer; color: inherit; padding: 0; margin-left: 4px; opacity: .7; flex-shrink: 0; }
.pos-toast-close:hover[b-olfxnh7dq9] { opacity: 1; }

/* ── Banner modo ── */
.pos-banner[b-olfxnh7dq9] { padding: 4px 14px; font-size: 11px; flex-shrink: 0; border-bottom: 1px solid var(--rg-border); }
.pos-banner.cot[b-olfxnh7dq9] { background: rgba(180,83,9,.08); color: #c44d00; }
.pos-banner.fac[b-olfxnh7dq9] { background: rgba(26,58,92,.08);  color: var(--rg-primary); }
[data-mode="dark"] .pos-banner.cot[b-olfxnh7dq9] { background: rgba(251,191,36,.08); color: #fde68a; }
[data-mode="dark"] .pos-banner.fac[b-olfxnh7dq9] { background: rgba(96,165,250,.08); color: #93c5fd; }

/* ── Cabecera documento ── */
.pos-docheader[b-olfxnh7dq9] { background: var(--rg-bg-card); border-bottom: 1px solid var(--rg-border); padding: 7px 14px; flex-shrink: 0; }
.pos-docheader-grid[b-olfxnh7dq9] { display: grid; grid-template-columns: 110px 2fr 1fr 1fr; gap: 6px 10px; align-items: end; }
.pos-doc-num-wrap[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: 2px; }
.pos-doc-num-label[b-olfxnh7dq9] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; color: var(--rg-text-muted); }
.pos-doc-num[b-olfxnh7dq9] { font-family: monospace; font-size: 14px; font-weight: 700; line-height: 1; }
.pos-doc-num.cot[b-olfxnh7dq9] { color: #e85d00; }
.pos-doc-num.fac[b-olfxnh7dq9] { color: var(--rg-primary); }
[data-mode="dark"] .pos-doc-num.cot[b-olfxnh7dq9] { color: #fde68a; }

.pos-field[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pos-field label[b-olfxnh7dq9] { font-size: 9px; text-transform: uppercase; letter-spacing: .06em; color: var(--rg-text-muted); font-weight: 600; }
.pos-lbl-opt[b-olfxnh7dq9] { font-weight: 400; letter-spacing: 0; text-transform: none; }
.pos-field-group[b-olfxnh7dq9] { display: flex; gap: 6px; align-items: flex-end; }
.pos-field-group .pos-field[b-olfxnh7dq9] { flex: 1; min-width: 80px; }

.pos-inp[b-olfxnh7dq9] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 3px; padding: 5px 7px; font-size: 12px; width: 100%; }
.pos-inp:focus[b-olfxnh7dq9] { outline: none; border-color: var(--rg-primary); box-shadow: 0 0 0 2px rgba(26,58,92,.15); }
/* Campo obligatorio no completado */
.pos-inp-error[b-olfxnh7dq9] { border-color: var(--rg-danger) !important; box-shadow: 0 0 0 2px rgba(220,38,38,.2) !important; }
[data-mode="dark"] .pos-inp-error[b-olfxnh7dq9] { border-color: #f87171 !important; box-shadow: 0 0 0 2px rgba(248,113,113,.25) !important; }

.pos-cliente-row[b-olfxnh7dq9] { display: flex; gap: 3px; }
.pos-cliente-row .pos-inp[b-olfxnh7dq9] { flex: 1; }
.pos-btn-buscar[b-olfxnh7dq9], .pos-btn-clear[b-olfxnh7dq9] { border: 1px solid var(--rg-border); background: var(--rg-bg-input); color: var(--rg-text-secondary); border-radius: 3px; width: 27px; cursor: pointer; font-size: 12px; flex-shrink: 0; }
.pos-btn-buscar:hover[b-olfxnh7dq9] { background: var(--rg-primary); color: #fff; }
.pos-btn-clear:hover[b-olfxnh7dq9]  { background: rgba(239,68,68,.12); color: #b91c1c; }
.pos-cliente-nombre[b-olfxnh7dq9] { font-size: 10px; color: var(--rg-text-secondary); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }

/* Insignia exento ITBIS (NCF-114) */
.pos-badge-exento[b-olfxnh7dq9] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    background: rgba(16, 185, 129, 0.15);
    color: #065f46;
    border: 1px solid rgba(16, 185, 129, 0.35);
    white-space: nowrap;
}
[data-mode="dark"] .pos-badge-exento[b-olfxnh7dq9] { color: #6ee7b7; border-color: rgba(16,185,129,.4); }

/* ── Cuerpo principal ── */
.pos-main[b-olfxnh7dq9] { display: grid; grid-template-columns: 1fr 370px; flex: 1; overflow: hidden; }

/* ════ Panel izquierdo catálogo ════ */
.pos-left[b-olfxnh7dq9] { display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid var(--rg-border); }

.pos-filterbar[b-olfxnh7dq9] { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; padding: 7px 10px; background: var(--rg-bg-card); border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.pos-search-box[b-olfxnh7dq9] { position: relative; display: flex; align-items: center; flex-shrink: 0; width: 240px; border: 1px solid var(--rg-border); border-radius: 4px; background: var(--rg-bg-input); overflow: hidden; }
.pos-search-btn[b-olfxnh7dq9] { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; font-size: 12px; padding: 0; transition: color .12s; }
.pos-search-btn:hover[b-olfxnh7dq9] { color: var(--rg-primary); }
.pos-search-box input[b-olfxnh7dq9] { flex: 1; padding: 5px 6px; background: transparent; color: var(--rg-text-primary); border: none; font-size: 12px; min-width: 0; }
.pos-search-box input:focus[b-olfxnh7dq9] { outline: none; }
.pos-search-box:focus-within[b-olfxnh7dq9] { border-color: var(--rg-primary); }
.pos-search-clear[b-olfxnh7dq9] { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 22px; border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; font-size: 11px; padding: 0; }
.pos-search-clear:hover[b-olfxnh7dq9] { color: var(--rg-danger); }

.pos-chips[b-olfxnh7dq9] { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.pos-chip[b-olfxnh7dq9] { padding: 3px 9px; border: 1px solid var(--rg-border); border-radius: 16px; background: var(--rg-bg-card); color: var(--rg-text-secondary); font-size: 11px; cursor: pointer; transition: all .12s; white-space: nowrap; }
.pos-chip:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); }
.pos-chip.active[b-olfxnh7dq9] { background: var(--rg-text-primary); color: var(--rg-bg-card); border-color: var(--rg-text-primary); }
.pos-chip-count[b-olfxnh7dq9] { margin-left: 2px; font-size: 9px; opacity: .7; }

.pos-catalog-loading[b-olfxnh7dq9], .pos-catalog-empty[b-olfxnh7dq9] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; flex: 1; color: var(--rg-text-muted); font-size: 13px; }
.pos-catalog-empty i[b-olfxnh7dq9] { font-size: 2.5rem; opacity: .35; }

/* ── Grid de tarjetas ── */
.pos-cardgrid[b-olfxnh7dq9] { flex: 1; overflow-y: auto; padding: 8px; display: grid; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 7px; align-content: start; }
.pos-card[b-olfxnh7dq9] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 5px; padding: 9px 10px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; text-align: left; position: relative; transition: all .12s; font-family: inherit; }
.pos-card:hover[b-olfxnh7dq9] { border-color: var(--rg-primary); box-shadow: 0 3px 10px rgba(26,58,92,.1); transform: translateY(-1px); }
.pos-card:active[b-olfxnh7dq9] { transform: translateY(0); box-shadow: none; }
.pos-card.in-doc[b-olfxnh7dq9] { border-color: var(--rg-primary); background: rgba(26,58,92,.06); }
[data-mode="dark"] .pos-card.in-doc[b-olfxnh7dq9] { background: rgba(96,165,250,.08); }

/* ── Paleta de colores — solo el precio de cada tarjeta ── */
.pos-card-color-0 .pos-card-price[b-olfxnh7dq9] { color: #6366f1; }
.pos-card-color-1 .pos-card-price[b-olfxnh7dq9] { color: #0ea5e9; }
.pos-card-color-2 .pos-card-price[b-olfxnh7dq9] { color: #10b981; }
.pos-card-color-3 .pos-card-price[b-olfxnh7dq9] { color: #d97706; }
.pos-card-color-4 .pos-card-price[b-olfxnh7dq9] { color: #ef4444; }
.pos-card-color-5 .pos-card-price[b-olfxnh7dq9] { color: #8b5cf6; }
.pos-card-color-6 .pos-card-price[b-olfxnh7dq9] { color: #ec4899; }
.pos-card-color-7 .pos-card-price[b-olfxnh7dq9] { color: #14b8a6; }
.pos-card-color-8 .pos-card-price[b-olfxnh7dq9] { color: #f97316; }
.pos-card-color-9 .pos-card-price[b-olfxnh7dq9] { color: #65a30d; }
[data-mode="dark"] .pos-card-color-9 .pos-card-price[b-olfxnh7dq9] { color: #a3e635; }
.pos-card-qty[b-olfxnh7dq9] { position: absolute; top: -7px; right: -7px; background: var(--rg-primary); color: #fff; width: 20px; height: 20px; border-radius: 50%; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 4px rgba(0,0,0,.15); }
.pos-card-code[b-olfxnh7dq9]  { font-family: monospace; font-size: 9px; color: var(--rg-text-muted); letter-spacing: .04em; }
.pos-card-name[b-olfxnh7dq9]  { font-size: 11px; font-weight: 500; line-height: 1.3; color: var(--rg-text-primary); flex: 1; }
.pos-card-price[b-olfxnh7dq9] { font-family: monospace; font-size: 13px; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 3px; }

/* Tag s/ITBIS en tarjeta de producto (cliente exento NCF-114) */
.pos-card-exento-tag[b-olfxnh7dq9] {
    font-family: sans-serif;
    font-size: 8px;
    font-weight: 700;
    padding: 1px 4px;
    border-radius: 2px;
    background: rgba(16, 185, 129, 0.2);
    color: #065f46;
    letter-spacing: .03em;
    text-transform: uppercase;
}
[data-mode="dark"] .pos-card-exento-tag[b-olfxnh7dq9] { color: #6ee7b7; }
.pos-card-meta[b-olfxnh7dq9]  { display: flex; gap: 3px; flex-wrap: wrap; margin-top: 2px; }
.pos-badge[b-olfxnh7dq9]      { font-size: 8px; padding: 1px 4px; border-radius: 2px; font-weight: 700; letter-spacing: .04em; }
.pos-badge.svc[b-olfxnh7dq9]  { background: rgba(59,130,246,.15); color: #1e40af; }
.pos-badge.fifo[b-olfxnh7dq9] { background: rgba(139,92,246,.15); color: #5b21b6; }
[data-mode="dark"] .pos-badge.svc[b-olfxnh7dq9]  { color: #93c5fd; }
[data-mode="dark"] .pos-badge.fifo[b-olfxnh7dq9] { color: #c4b5fd; }

/* ════ Panel derecho documento ════ */
.pos-right[b-olfxnh7dq9] { display: flex; flex-direction: column; background: var(--rg-bg-card); overflow: hidden; }
.pos-panel-head[b-olfxnh7dq9] { padding: 9px 13px 7px; border-bottom: 1px solid var(--rg-border); display: flex; justify-content: space-between; align-items: baseline; flex-shrink: 0; }
.pos-panel-title[b-olfxnh7dq9] { font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rg-text-secondary); }
.pos-panel-count[b-olfxnh7dq9] { font-size: 9px; color: var(--rg-text-muted); font-family: monospace; }

.pos-lines-empty[b-olfxnh7dq9] { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--rg-text-muted); font-size: 12px; font-style: italic; }
.pos-lines-empty i[b-olfxnh7dq9] { font-size: 2rem; opacity: .3; }
.pos-lines[b-olfxnh7dq9] { flex: 1; overflow-y: auto; }

.pos-line[b-olfxnh7dq9] { padding: 7px 12px; border-bottom: 1px solid var(--rg-border); transition: background .1s; }
.pos-line:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); }
.pos-line-top[b-olfxnh7dq9] { display: flex; align-items: flex-start; gap: 6px; justify-content: space-between; }
.pos-line-name[b-olfxnh7dq9] { font-size: 11px; font-weight: 500; line-height: 1.3; flex: 1; min-width: 0; }
.pos-line-code[b-olfxnh7dq9] { font-family: monospace; font-size: 9px; color: var(--rg-text-muted); margin-right: 3px; }
.pos-line-controls[b-olfxnh7dq9] { display: flex; align-items: center; gap: 3px; flex-shrink: 0; }
.pos-qty-stepper[b-olfxnh7dq9] { display: inline-flex; align-items: center; background: var(--rg-bg-subtle); border-radius: 3px; overflow: hidden; border: 1px solid var(--rg-border); }
.pos-qty-stepper button[b-olfxnh7dq9] { width: 20px; height: 20px; border: none; background: transparent; cursor: pointer; font-size: 13px; color: var(--rg-text-secondary); font-weight: 700; }
.pos-qty-stepper button:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); }
.pos-qty-stepper span[b-olfxnh7dq9] { width: 26px; text-align: center; font-family: monospace; font-size: 12px; font-weight: 600; color: var(--rg-text-primary); }
.pos-btn-rm[b-olfxnh7dq9] { width: 18px; height: 18px; border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; font-size: 14px; border-radius: 3px; line-height: 1; padding: 0; }
.pos-btn-rm:hover[b-olfxnh7dq9] { background: rgba(239,68,68,.12); color: #b91c1c; }
.pos-line-detail[b-olfxnh7dq9] { display: flex; justify-content: space-between; margin-top: 2px; }
.pos-line-lbl[b-olfxnh7dq9] { font-size: 9px; color: var(--rg-text-muted); }
.pos-line-subtotal[b-olfxnh7dq9] { font-family: monospace; font-size: 11px; font-weight: 600; color: var(--rg-text-primary); }

/* ── Totales ── */
.pos-totals[b-olfxnh7dq9] { border-top: 2px solid var(--rg-text-primary); padding: 9px 13px; background: var(--rg-bg-subtle); flex-shrink: 0; }
.pos-total-row[b-olfxnh7dq9] { display: flex; justify-content: space-between; align-items: baseline; padding: 2px 0; font-size: 12px; color: var(--rg-text-secondary); }
.pos-total-row.grand[b-olfxnh7dq9] { border-top: 1px solid var(--rg-border); margin-top: 5px; padding-top: 6px; }
.pos-total-row.grand span:first-child[b-olfxnh7dq9] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rg-text-primary); }
.pos-grand-value[b-olfxnh7dq9] { font-size: 19px; font-weight: 700; color: var(--rg-text-primary); font-family: monospace; }

/* ── Acciones ── */
.pos-actions[b-olfxnh7dq9] { padding: 9px 12px; background: var(--rg-text-primary); display: flex; gap: 7px; flex-shrink: 0; }
.pos-btn-cancel[b-olfxnh7dq9] { background: transparent; color: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.2); border-radius: 3px; padding: 8px 12px; font-size: 13px; font-weight: 500; cursor: pointer; }
.pos-btn-cancel:hover[b-olfxnh7dq9] { background: rgba(255,255,255,.08); }
.pos-btn-cancel:disabled[b-olfxnh7dq9] { opacity: .4; cursor: default; }
.pos-btn-save[b-olfxnh7dq9] { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 14px; border: none; border-radius: 3px; font-size: 14px; font-weight: 600; cursor: pointer; color: #fff; }
.pos-btn-save.cot[b-olfxnh7dq9] { background: #e85d00; }
.pos-btn-save.cot:hover:not(:disabled)[b-olfxnh7dq9] { background: #c44d00; }
.pos-btn-save.fac[b-olfxnh7dq9] { background: #0d4f4b; }
.pos-btn-save.fac:hover:not(:disabled)[b-olfxnh7dq9] { background: #0a3f3c; }
.pos-btn-save:disabled[b-olfxnh7dq9] { opacity: .45; cursor: default; }

/* ── Post-grabado ── */
.ps-modal[b-olfxnh7dq9] { max-width: 320px; }
.ps-recibo-info[b-olfxnh7dq9] { display: flex; align-items: baseline; gap: .5rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .55rem .75rem; margin-bottom: .4rem; }
.ps-label[b-olfxnh7dq9] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-olfxnh7dq9] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-cliente-info[b-olfxnh7dq9] { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--rg-text-secondary); margin-bottom: .8rem; }
.ps-acciones[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: .4rem; }
.ps-acciones .btn-crud[b-olfxnh7dq9] { width: 100%; justify-content: center; }
.ps-pdf-error[b-olfxnh7dq9] { font-size: .78rem; color: var(--rg-danger); display: flex; align-items: center; gap: .3rem; padding: .25rem 0; }

/* ── Modal PDF Viewer (anidado) ── */
.modal-backdrop-nested[b-olfxnh7dq9]  { z-index: 2000 !important; background: rgba(0,0,0,.5) !important; }
.modal-container-nested[b-olfxnh7dq9] { z-index: 2001 !important; }
.pdf-viewer-dialog[b-olfxnh7dq9] { max-width: 900px; width: 92vw; height: 85vh; }
.pdf-viewer-body[b-olfxnh7dq9] { padding: 0; overflow: hidden; display: flex; flex: 1; }
.pdf-iframe[b-olfxnh7dq9] { width: 100%; height: 100%; border: none; flex: 1; }

/* ── Modal Envío ── */
.envio-form-group[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .75rem; }
.envio-label[b-olfxnh7dq9] { display: flex; align-items: center; gap: .4rem; font-size: .8rem; font-weight: 600; color: var(--rg-text-secondary); }
.envio-input[b-olfxnh7dq9] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 6px; padding: .45rem .65rem; font-size: .88rem; width: 100%; }
.envio-input:focus[b-olfxnh7dq9] { border-color: var(--rg-primary); outline: none; box-shadow: 0 0 0 3px rgba(26,58,92,.15); }
.envio-input:disabled[b-olfxnh7dq9] { opacity: .55; cursor: not-allowed; }
.crud-alert.error[b-olfxnh7dq9] { background: rgba(239,68,68,.12); color: #991b1b; border: 1px solid rgba(239,68,68,.25); }
[data-mode="dark"] .crud-alert.error[b-olfxnh7dq9] { color: #fca5a5; }

/* ── Modales (CSS isolation — necesario en cada componente) ── */
.modal-backdrop[b-olfxnh7dq9] { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1000; }
.modal-container[b-olfxnh7dq9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-olfxnh7dq9] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 8px; display: flex; flex-direction: column; max-height: 90vh; pointer-events: all; width: 90vw; }
.modal-dialog.modal-sm[b-olfxnh7dq9] { max-width: 400px; }
.modal-header[b-olfxnh7dq9] { display: flex; align-items: center; justify-content: space-between; padding: .85rem 1.1rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-olfxnh7dq9] { margin: 0; font-size: .95rem; color: var(--rg-text-primary); display: flex; align-items: center; gap: .5rem; }
.modal-close[b-olfxnh7dq9] { border: none; background: transparent; cursor: pointer; color: var(--rg-text-muted); font-size: .95rem; padding: .2rem .4rem; border-radius: 4px; }
.modal-close:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); color: var(--rg-danger); }
.modal-body[b-olfxnh7dq9] { padding: 1.1rem; overflow-y: auto; flex: 1; color: var(--rg-text-primary); }
.modal-footer[b-olfxnh7dq9] { padding: .75rem 1.1rem; border-top: 1px solid var(--rg-border); display: flex; gap: .5rem; justify-content: flex-end; flex-shrink: 0; }

/* ── Helpers ── */
.btn-crud[b-olfxnh7dq9] { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer; border: 1px solid transparent; transition: all .15s; }
.btn-crud.btn-primary[b-olfxnh7dq9] { background: var(--rg-primary); color: #fff; }
.btn-crud.btn-primary:hover[b-olfxnh7dq9] { opacity: .9; }
.btn-crud.btn-outline[b-olfxnh7dq9] { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-crud.btn-outline:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); }
.btn-crud.btn-sm[b-olfxnh7dq9] { padding: 5px 10px; font-size: 12px; }
.btn-crud:disabled[b-olfxnh7dq9] { opacity: .45; cursor: default; }
.crud-spinner[b-olfxnh7dq9] { width: 26px; height: 26px; border: 3px solid var(--rg-border); border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-pos-b-olfxnh7dq9 .7s linear infinite; }
.crud-alert[b-olfxnh7dq9] { display: flex; align-items: center; gap: 8px; padding: .55rem .9rem; border-radius: 6px; font-size: 12px; }
.crud-alert.success[b-olfxnh7dq9] { background: rgba(34,197,94,.12); color: #166534; }
[data-mode="dark"] .crud-alert.success[b-olfxnh7dq9] { color: #86efac; }
.font-mono[b-olfxnh7dq9] { font-family: monospace; }
.ms-1[b-olfxnh7dq9] { margin-left: 4px; }
.ms-auto[b-olfxnh7dq9] { margin-left: auto; }
.spin[b-olfxnh7dq9] { animation: spin-pos-b-olfxnh7dq9 .7s linear infinite; }

@keyframes spin-pos-b-olfxnh7dq9 { to { transform: rotate(360deg); } }

/* ── Edición inline precio/descuento por línea ── */
.pos-line-detail[b-olfxnh7dq9] { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; gap: 6px; }
.pos-line-edit[b-olfxnh7dq9]   { display: flex; gap: 6px; align-items: flex-end; }
.pos-inp-mini-group[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: 1px; }
.pos-mini-lbl[b-olfxnh7dq9]    { font-size: 8px; text-transform: uppercase; letter-spacing: .05em; color: var(--rg-text-muted); font-weight: 600; }
.pos-inp-mini[b-olfxnh7dq9]    { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 3px; padding: 3px 5px; font-size: 11px; font-family: monospace; width: 70px; }
.pos-inp-mini:focus[b-olfxnh7dq9] { outline: none; border-color: var(--rg-primary); }

/* ── Descuento global ── */
.pos-global-discount-bar[b-olfxnh7dq9] { padding: 5px 12px; border-top: 1px solid var(--rg-border); background: var(--rg-bg-subtle); flex-shrink: 0; }
.pos-global-discount-row[b-olfxnh7dq9] { display: flex; align-items: center; gap: 5px; margin-top: 2px; }
.pos-global-discount-row .pos-inp[b-olfxnh7dq9] { width: 70px; text-align: right; font-family: monospace; }
.pos-global-discount-row .pos-lbl-opt[b-olfxnh7dq9] { font-size: 11px; color: var(--rg-text-secondary); }

/* ── FAB flotante ── */
.pos-fab-container[b-olfxnh7dq9] { position: fixed; bottom: 20px; right: 22px; z-index: 900; }
.pos-fab[b-olfxnh7dq9] {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 16px; border-radius: 30px; border: none; cursor: pointer;
    color: #fff; font-size: 14px; font-weight: 600;
    box-shadow: 0 4px 16px rgba(0,0,0,.3);
    transition: transform .15s, box-shadow .15s;
}
.pos-fab.cot[b-olfxnh7dq9] { background: #e85d00; }
.pos-fab.fac[b-olfxnh7dq9] { background: var(--rg-primary); }
.pos-fab:hover:not(:disabled)[b-olfxnh7dq9] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.35); }
.pos-fab:disabled[b-olfxnh7dq9] { opacity: .5; cursor: default; }
.pos-fab-label[b-olfxnh7dq9] { font-size: 14px; font-weight: 700; }
.pos-fab-count[b-olfxnh7dq9] { font-size: 10px; opacity: .85; white-space: nowrap; }

/* ── Sección Forma de Pago dentro del checkout drawer ── */
.pos-checkout-fp-section[b-olfxnh7dq9] { }

.pos-fp-badge[b-olfxnh7dq9] { display: inline-flex; align-items: center; gap: .25rem;
    font-size: .68rem; font-weight: 700; padding: .15rem .5rem;
    border-radius: 1rem; margin-left: auto; }
.pos-fp-badge.ok[b-olfxnh7dq9]      { background: rgba(22,163,74,.15); color: #15803d; }
.pos-fp-badge.pending[b-olfxnh7dq9] { background: rgba(217,119,6,.15);  color: #b45309; }
[data-mode="dark"] .pos-fp-badge.ok[b-olfxnh7dq9]      { color: #86efac; }
[data-mode="dark"] .pos-fp-badge.pending[b-olfxnh7dq9] { color: #fcd34d; }

.pos-fp-open-btn[b-olfxnh7dq9] {
    display: flex; align-items: center; gap: .6rem;
    width: 100%; padding: .65rem .8rem; margin-top: .4rem;
    background: var(--rg-bg-subtle); border: 1.5px dashed var(--rg-border);
    border-radius: 8px; cursor: pointer; color: var(--rg-text-secondary);
    font-size: .82rem; font-weight: 600; text-align: left;
    transition: border-color .15s, background .15s;
}
.pos-fp-open-btn:hover[b-olfxnh7dq9] { border-color: var(--rg-primary); background: var(--rg-bg-hover); color: var(--rg-primary); }
.pos-fp-open-btn .bi-chevron-right[b-olfxnh7dq9] { margin-left: auto; font-size: .7rem; opacity: .6; }

.pos-fp-summary[b-olfxnh7dq9] {
    display: flex; align-items: center; gap: .5rem; margin-top: .4rem;
    padding: .55rem .75rem; background: rgba(22,163,74,.08);
    border: 1px solid rgba(22,163,74,.25); border-radius: 8px;
    font-size: .82rem; color: var(--rg-text-primary);
}
.pos-fp-edit-btn[b-olfxnh7dq9] {
    margin-left: auto; display: inline-flex; align-items: center; gap: .25rem;
    padding: .2rem .55rem; font-size: .72rem; font-weight: 600;
    background: transparent; border: 1px solid var(--rg-border);
    border-radius: 6px; cursor: pointer; color: var(--rg-text-secondary);
    transition: border-color .15s, color .15s;
}
.pos-fp-edit-btn:hover[b-olfxnh7dq9] { border-color: var(--rg-primary); color: var(--rg-primary); }

/* ── Tarjetas sin stock ── */
.pos-card.no-stock[b-olfxnh7dq9] { opacity: .65; }
.pos-card.blocked-fac[b-olfxnh7dq9] { cursor: not-allowed; }
.pos-card.blocked-fac:hover[b-olfxnh7dq9] { border-color: rgba(239,68,68,.4); box-shadow: none; transform: none; }
.pos-card-no-stock-tag[b-olfxnh7dq9] {
    position: absolute; top: 4px; left: 4px;
    background: rgba(239,68,68,.85); color: #fff;
    font-size: 7px; font-weight: 700; letter-spacing: .06em;
    padding: 1px 4px; border-radius: 2px;
}

/* ══ Checkout Drawer ══ */
.pos-checkout-backdrop[b-olfxnh7dq9] {
    position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 800;
    opacity: 0; pointer-events: none; transition: opacity .3s;
}
.pos-checkout-backdrop.open[b-olfxnh7dq9] { opacity: 1; }

.pos-checkout-drawer[b-olfxnh7dq9] {
    position: fixed; top: 58px; right: 0;
    width: 460px; height: calc(100vh - 58px);
    background: var(--rg-bg-card);
    border-left: 2px solid var(--rg-primary);
    z-index: 801;
    display: flex; flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.4,0,.2,1);
    box-shadow: -6px 0 28px rgba(0,0,0,.18);
}
.pos-checkout-drawer.open[b-olfxnh7dq9] { transform: translateX(0); }

.pos-checkout-header[b-olfxnh7dq9] {
    padding: 12px 16px; border-bottom: 1px solid var(--rg-border);
    display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
}
.pos-checkout-header.cot[b-olfxnh7dq9] { background: rgba(180,83,9,.08); }
.pos-checkout-header.fac[b-olfxnh7dq9] { background: rgba(26,58,92,.08); }
[data-mode="dark"] .pos-checkout-header.cot[b-olfxnh7dq9] { background: rgba(251,191,36,.06); }
[data-mode="dark"] .pos-checkout-header.fac[b-olfxnh7dq9] { background: rgba(96,165,250,.06); }
.pos-checkout-title[b-olfxnh7dq9] { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--rg-text-primary); }
.pos-checkout-close[b-olfxnh7dq9] { border: none; background: transparent; color: var(--rg-text-muted); font-size: 14px; cursor: pointer; padding: 4px 8px; border-radius: 4px; }
.pos-checkout-close:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); color: var(--rg-danger); }

.pos-checkout-body[b-olfxnh7dq9] { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }

.pos-checkout-section[b-olfxnh7dq9] { border: 1px solid var(--rg-border); border-radius: 6px; padding: 8px 11px; }
.pos-checkout-section-sm[b-olfxnh7dq9] { padding: 5px 11px; }
.pos-checkout-section-label[b-olfxnh7dq9] { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--rg-text-muted); margin-bottom: 4px; display: flex; align-items: center; gap: 4px; }
.pos-checkout-cliente[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: 1px; }
.pos-checkout-cliente-nombre[b-olfxnh7dq9] { font-size: 14px; font-weight: 600; color: var(--rg-text-primary); }
.pos-checkout-cliente-id[b-olfxnh7dq9] { font-size: 11px; color: var(--rg-text-muted); }
.pos-checkout-cliente-empty[b-olfxnh7dq9] { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--rg-text-secondary); }

.pos-checkout-lines-section[b-olfxnh7dq9] { padding: 8px 0 0; }
.pos-checkout-lines[b-olfxnh7dq9] { max-height: 220px; overflow-y: auto; padding: 0 11px 8px; }
.pos-checkout-line[b-olfxnh7dq9] { padding: 5px 0; border-bottom: 1px solid var(--rg-border); display: flex; flex-direction: column; gap: 2px; }
.pos-checkout-line:last-child[b-olfxnh7dq9] { border-bottom: none; }
.pos-checkout-line-name[b-olfxnh7dq9] { font-size: 11px; color: var(--rg-text-primary); display: flex; flex-direction: column; gap: 1px; }
.pos-checkout-line-nums[b-olfxnh7dq9] { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--rg-text-secondary); }
.pos-checkout-desc[b-olfxnh7dq9] { color: #10b981; font-size: 10px; }
.pos-checkout-subtotal[b-olfxnh7dq9] { margin-left: auto; font-weight: 600; color: var(--rg-text-primary); }

/* Botón − del checkout drawer */
.pos-checkout-dec[b-olfxnh7dq9] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: 50%; border: none; cursor: pointer;
    background: rgba(239,68,68,0.10); color: var(--rg-danger);
    font-size: .8rem; flex-shrink: 0; transition: background .15s;
    padding: 0;
}
.pos-checkout-dec:hover[b-olfxnh7dq9] { background: rgba(239,68,68,0.22); }
.pos-checkout-qty[b-olfxnh7dq9] { font-weight: 700; color: var(--rg-text-primary); min-width: 16px; text-align: center; font-size: .8rem; }

.pos-checkout-totals[b-olfxnh7dq9] { border-top: 2px solid var(--rg-text-primary); padding: 10px 0 2px; background: var(--rg-bg-subtle); border-radius: 0 0 6px 6px; flex-shrink: 0; padding: 10px 16px; }
.pos-checkout-total-row[b-olfxnh7dq9] { display: flex; justify-content: space-between; align-items: baseline; padding: 2px 0; font-size: 12px; color: var(--rg-text-secondary); }
.pos-checkout-grand[b-olfxnh7dq9] { border-top: 1px solid var(--rg-border); margin-top: 5px; padding-top: 6px; }
.pos-checkout-grand span:first-child[b-olfxnh7dq9] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rg-text-primary); }

.pos-checkout-footer[b-olfxnh7dq9] { padding: 12px 16px; border-top: 1px solid var(--rg-border); display: flex; gap: 8px; flex-shrink: 0; background: var(--rg-bg-card); }
.pos-checkout-confirm[b-olfxnh7dq9] {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 12px; border: none; border-radius: 6px; font-size: 14px; font-weight: 700;
    cursor: pointer; color: #fff; transition: opacity .15s;
}
.pos-checkout-confirm.cot[b-olfxnh7dq9] { background: #e85d00; }
.pos-checkout-confirm.fac[b-olfxnh7dq9] { background: var(--rg-primary); }
.pos-checkout-confirm:disabled[b-olfxnh7dq9] { opacity: .45; cursor: default; }
.pos-checkout-confirm:hover:not(:disabled)[b-olfxnh7dq9] { opacity: .9; }

/* ── Responsive móvil ── */
@media (max-width: 768px) {
    .pos-main[b-olfxnh7dq9]              { grid-template-columns: 1fr; grid-template-rows: 60vh auto; }
    .pos-right[b-olfxnh7dq9]             { border-top: 2px solid var(--rg-border); }
    .pos-docheader-grid[b-olfxnh7dq9]    { grid-template-columns: 1fr 1fr; }
    .pos-doc-num-wrap[b-olfxnh7dq9]      { grid-column: 1 / -1; }
    .pos-cardgrid[b-olfxnh7dq9]          { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
    .pos-wrapper[b-olfxnh7dq9]           { height: calc(100vh - 60px - 2rem); }
    .pos-fab-container[b-olfxnh7dq9]     { bottom: 12px; right: 12px; }
    .pos-inp-mini[b-olfxnh7dq9]          { width: 58px; }

    /* Botón × de eliminar línea — target táctil mínimo 44px */
    .pos-btn-rm[b-olfxnh7dq9] {
        width: 36px;
        height: 36px;
        font-size: 18px;
        border: 1px solid rgba(239, 68, 68, .35);
        border-radius: 6px;
        color: #dc2626;
        background: rgba(239, 68, 68, .07);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
}

/* ── NCF resuelto (checkout drawer) ───────────────────────────────────── */
.pos-ncf-badge[b-olfxnh7dq9] {
    display: inline-flex; align-items: center; gap: 3px;
    font-size: .65rem; font-weight: 700; padding: 2px 7px;
    border-radius: 1rem; text-transform: uppercase; letter-spacing: .04em;
}
.pos-ncf-badge.pos-ncf-ecf[b-olfxnh7dq9] {
    background: rgba(34,197,94,.13); color: #15803d;
    border: 1px solid rgba(34,197,94,.3);
}
[data-mode="dark"] .pos-ncf-badge.pos-ncf-ecf[b-olfxnh7dq9] { color: #86efac; }

.pos-ncf-resolved[b-olfxnh7dq9] {
    display: flex; align-items: baseline; gap: .5rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: .4rem; padding: .45rem .65rem; margin-top: .25rem;
}
.pos-ncf-prefijo[b-olfxnh7dq9] {
    font-family: monospace; font-size: .95rem; font-weight: 700;
    color: var(--rg-primary); letter-spacing: .06em;
}
.pos-ncf-desc[b-olfxnh7dq9] {
    font-size: .75rem; color: var(--rg-text-secondary); flex: 1;
}

/* ── Totales: filas de descuento e informativas ────────────────────────── */
.pos-total-desc[b-olfxnh7dq9] {
    color: var(--rg-success);
}
.pos-total-info[b-olfxnh7dq9] {
    font-size: .72rem;
    color: var(--rg-text-muted);
    border-top: 1px dashed var(--rg-border);
    padding-top: .2rem;
    margin-top: .1rem;
}

/* Checkout drawer — fila de descuento */
.pos-checkout-desc-row[b-olfxnh7dq9] {
    color: var(--rg-success);
}

/* Checkout drawer — base gravable neta (subtítulo intermedio) */
.pos-checkout-base-neta-row[b-olfxnh7dq9] {
    font-weight: 600;
    border-top: 1px solid var(--rg-border);
    padding-top: .35rem;
    margin-top: .1rem;
    color: var(--rg-text-primary);
}

/* Checkout drawer — desglose fiscal (bajo el TOTAL) */
.pos-checkout-fiscal-info[b-olfxnh7dq9] {
    border-top: 1px dashed var(--rg-border);
    margin-top: .4rem;
    padding-top: .35rem;
}
.pos-checkout-fiscal-row[b-olfxnh7dq9] {
    display: flex;
    justify-content: space-between;
    font-size: .72rem;
    color: var(--rg-text-muted);
    padding: .1rem 0;
}
.pos-checkout-fiscal-itbis[b-olfxnh7dq9] {
    color: var(--rg-warning);
    font-weight: 600;
}

/* Checkout drawer — fila ITBIS */
.pos-checkout-itbis-row[b-olfxnh7dq9] {
    color: var(--rg-text-secondary);
}
.pos-checkout-itbis-hint[b-olfxnh7dq9] {
    font-size: .68rem;
    color: var(--rg-text-muted);
    margin-left: .3rem;
    font-weight: 400;
}

/* ── Nota conflicto descuentos ─────────────────────────────────────────── */
.pos-discount-conflict-note[b-olfxnh7dq9] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    color: var(--rg-warning);
    background: rgba(217,119,6,.08);
    border: 1px solid rgba(217,119,6,.25);
    border-radius: .4rem;
    padding: .3rem .55rem;
    margin-bottom: .4rem;
}

/* ── Forma de Pago (checkout drawer) ──────────────────────────────────── */
.pos-checkout-section-fp[b-olfxnh7dq9] { padding-top: .5rem; }
.pos-fp-tipos[b-olfxnh7dq9] { display: flex; gap: .3rem; flex-wrap: wrap; margin-top: .4rem; }
.pos-fp-tipo-btn[b-olfxnh7dq9] { flex: 1; min-width: 58px; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: .45rem .3rem; border: 1px solid var(--rg-border); border-radius: .4rem; background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-size: .72rem; font-weight: 500; cursor: pointer; transition: all .12s; font-family: inherit; }
.pos-fp-tipo-btn:hover[b-olfxnh7dq9] { background: var(--rg-bg-hover); color: var(--rg-primary); border-color: var(--rg-primary); }
.pos-fp-tipo-btn i[b-olfxnh7dq9] { font-size: 1rem; }
.pos-fp-input-row[b-olfxnh7dq9] { display: flex; gap: .3rem; align-items: center; margin-top: .4rem; flex-wrap: wrap; }
.pos-fp-input-row .pos-inp[b-olfxnh7dq9] { flex: 1; min-width: 80px; }
.pos-fp-chip-rm[b-olfxnh7dq9] { border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; padding: 0 .15rem; font-size: .85rem; line-height: 1; margin-left: auto; }
.pos-fp-chip-rm:hover[b-olfxnh7dq9] { color: var(--rg-danger); }
.pos-fp-list[b-olfxnh7dq9] { display: flex; flex-direction: column; gap: .35rem; margin-top: .4rem; }
.pos-fp-chip[b-olfxnh7dq9] { display: flex; align-items: center; gap: .5rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .45rem; padding: .35rem .6rem; font-size: .8rem; }
.pos-fp-chip-tipo[b-olfxnh7dq9]  { font-weight: 600; color: var(--rg-text-primary); flex: 1; }
.pos-fp-chip-ref[b-olfxnh7dq9]   { color: var(--rg-text-secondary); font-size: .72rem; }
.pos-fp-chip-monto[b-olfxnh7dq9] { font-weight: 700; color: var(--rg-primary); white-space: nowrap; }
.pos-fp-diferencia[b-olfxnh7dq9] { display: flex; align-items: center; gap: .35rem; margin-top: .4rem; font-size: .78rem; padding: .3rem .5rem; border-radius: .4rem; }
.pos-fp-diferencia.falta[b-olfxnh7dq9]  { background: rgba(220,38,38,0.08); color: var(--rg-danger); border: 1px solid rgba(220,38,38,0.25); }
.pos-fp-diferencia.cambio[b-olfxnh7dq9] { background: rgba(22,163,74,0.08);  color: var(--rg-success); border: 1px solid rgba(22,163,74,0.25); }
.pos-fp-empty[b-olfxnh7dq9] { font-size: .78rem; color: var(--rg-text-muted); font-style: italic; }

/* ── Evidencia Fotográfica (checkout drawer) ───────────────────────────── */
.pos-checkout-section-label[b-olfxnh7dq9] { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pos-evid-btns[b-olfxnh7dq9] { display: flex; gap: .3rem; margin-left: auto; }
.pos-evid-btn[b-olfxnh7dq9] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: .4rem; cursor: pointer;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    color: var(--rg-text-secondary); font-size: .9rem; transition: background .15s;
}
.pos-evid-btn:hover:not(.uploading)[b-olfxnh7dq9]  { background: var(--rg-bg-hover); color: var(--rg-primary); }
.pos-evid-btn.uploading[b-olfxnh7dq9] { opacity: .6; cursor: wait; }
.pos-evid-hint[b-olfxnh7dq9] { font-size: .73rem; color: var(--rg-text-muted); margin-top: .25rem; display: block; }

@keyframes rg-spin-b-olfxnh7dq9 { to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Pages/Frutas/Frmfru_reimpresiondocumentos.razor.rz.scp.css */
/* ============================================================
   Frmfru_reimpresiondocumentos — Reimpresión Frutas v2
   Copiado y adaptado de Frmoptreimpresiondocumentos.razor.css
   ============================================================ */

.crud-container[b-skwhbat8n5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-skwhbat8n5 0.3s ease-out; }
@keyframes slideUp-b-skwhbat8n5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-skwhbat8n5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-skwhbat8n5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-skwhbat8n5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-skwhbat8n5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-skwhbat8n5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-skwhbat8n5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-skwhbat8n5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-skwhbat8n5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-skwhbat8n5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-skwhbat8n5] { filter: brightness(1.1); }
.btn-outline[b-skwhbat8n5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-skwhbat8n5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-skwhbat8n5] { background: var(--rg-danger, #ef4444); color: #fff; }
.btn-danger:hover:not(:disabled)[b-skwhbat8n5] { filter: brightness(1.1); }
.btn-icon[b-skwhbat8n5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-pdf[b-skwhbat8n5] { color: #ef4444; }
.btn-pdf:hover[b-skwhbat8n5] { background: rgba(239,68,68,0.1); }
.btn-send[b-skwhbat8n5] { color: var(--rg-primary, #1a3a5c); }
.btn-send:hover[b-skwhbat8n5] { background: rgba(26,58,92,0.1); }
.btn-delete[b-skwhbat8n5] { color: #ef4444; }
.btn-delete:hover[b-skwhbat8n5] { background: rgba(239,68,68,0.1); }
.btn-info[b-skwhbat8n5] { color: var(--rg-accent, #4f46e5); }
.btn-info:hover[b-skwhbat8n5] { background: rgba(79,70,229,0.1); }

/* Alert */
.crud-alert[b-skwhbat8n5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-skwhbat8n5] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-skwhbat8n5] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-skwhbat8n5] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-skwhbat8n5] { color: #fca5a5; }
.crud-alert-close[b-skwhbat8n5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tabs */
.cat-tabs[b-skwhbat8n5] { display: flex; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.cat-tab[b-skwhbat8n5] { background: none; border: none; padding: 0.6rem 1.1rem; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.4rem; }
.cat-tab:hover[b-skwhbat8n5] { color: var(--rg-text-primary, #1e293b); }
.cat-tab.active[b-skwhbat8n5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Filtros — sin label, select + searchbar en fila */
.filter-row[b-skwhbat8n5] { display: flex; gap: 0.75rem; align-items: center; margin-bottom: 0.75rem; flex-wrap: wrap; }
.flt-select[b-skwhbat8n5] { padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; min-width: 180px; max-width: 220px; }
.flt-select:focus[b-skwhbat8n5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.crud-search-bar[b-skwhbat8n5] { display: flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-skwhbat8n5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-skwhbat8n5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); min-width: 0; }
.crud-search-clear[b-skwhbat8n5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-skwhbat8n5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-skwhbat8n5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 300px); }
.crud-table[b-skwhbat8n5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-skwhbat8n5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-skwhbat8n5] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-skwhbat8n5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-skwhbat8n5] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tbody tr.row-anulada[b-skwhbat8n5] { opacity: 0.5; }
.col-actions[b-skwhbat8n5] { width: 90px; text-align: center; }
.text-right[b-skwhbat8n5] { text-align: right; }
.text-center[b-skwhbat8n5] { text-align: center; }

/* Badges */
.badge[b-skwhbat8n5] { display: inline-flex; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-skwhbat8n5] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-skwhbat8n5] { background: var(--rg-bg-subtle, #f1f5f9); color: #64748b; }
.badge-pending[b-skwhbat8n5] { background: rgba(234,179,8,0.15); color: #854d0e; }
.badge-anulada[b-skwhbat8n5] { background: rgba(239,68,68,0.12); color: #991b1b; }
[data-mode="dark"] .badge-yes[b-skwhbat8n5] { color: #86efac; }
[data-mode="dark"] .badge-anulada[b-skwhbat8n5] { color: #fca5a5; }
[data-mode="dark"] .badge-pending[b-skwhbat8n5] { color: #fde68a; }

/* Utilities */
.font-mono[b-skwhbat8n5] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-skwhbat8n5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-skwhbat8n5], .crud-empty-state[b-skwhbat8n5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-skwhbat8n5] { font-size: 2rem; }
.crud-spinner[b-skwhbat8n5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-skwhbat8n5 0.6s linear infinite; }
@keyframes spin-b-skwhbat8n5 { to { transform: rotate(360deg); } }
.spin[b-skwhbat8n5] { animation: spin-b-skwhbat8n5 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-skwhbat8n5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-skwhbat8n5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-skwhbat8n5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 860px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-pdf[b-skwhbat8n5] { max-width: 800px; }
.modal-sm[b-skwhbat8n5] { max-width: 460px; }
.modal-lg[b-skwhbat8n5] { max-width: 780px; }
.modal-header[b-skwhbat8n5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-skwhbat8n5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-skwhbat8n5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-skwhbat8n5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-skwhbat8n5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Nested modals */
.modal-backdrop-nested[b-skwhbat8n5]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-skwhbat8n5] { z-index: 2001 !important; }

/* Send / anular form fields */
.envio-form-group[b-skwhbat8n5] { display: flex; flex-direction: column; gap: .25rem; margin-bottom: .75rem; }
.envio-label[b-skwhbat8n5] { font-size: .72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: .04em; display: flex; align-items: center; gap: .35rem; }
.envio-input[b-skwhbat8n5] { background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 6px; padding: .45rem .65rem; font-size: .82rem; outline: none; width: 100%; box-sizing: border-box; }
.envio-input:focus[b-skwhbat8n5] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* Document info panel inside send modal */
.ps-recibo-info[b-skwhbat8n5] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .75rem; flex-wrap: wrap; }
.ps-label[b-skwhbat8n5] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.ps-value[b-skwhbat8n5] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }

@media (max-width: 768px) {
    .crud-container[b-skwhbat8n5] { padding: 0.75rem; }
    .filter-row[b-skwhbat8n5] { flex-direction: column; align-items: stretch; }
    .flt-select[b-skwhbat8n5] { max-width: 100%; }
    .cat-tabs[b-skwhbat8n5] { overflow-x: auto; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Frmparametrossultidora.razor.rz.scp.css */
/* ================================================================
   Frmparametrossultidora.razor.css
   Parámetros Surtidora — Categorías / Tasas ITBIS / Empaques /
   Ajuste Masivo de Precios
   ================================================================ */

/* ── Base CRUD ─────────────────────────────────────────────────── */
.crud-container[b-2z4jyighzs] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2z4jyighzs 0.3s ease-out; }
@keyframes slideUp-b-2z4jyighzs { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-2z4jyighzs] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2z4jyighzs] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2z4jyighzs] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-2z4jyighzs] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-header-actions[b-2z4jyighzs] { display: flex; gap: 0.5rem; }

.btn-crud[b-2z4jyighzs] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2z4jyighzs] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2z4jyighzs] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2z4jyighzs] { filter: brightness(1.1); }
.btn-outline[b-2z4jyighzs] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-2z4jyighzs] { background: var(--rg-bg-hover); }
.btn-danger[b-2z4jyighzs] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-2z4jyighzs] { filter: brightness(1.1); }
.btn-sm[b-2z4jyighzs] { padding: 0.35rem 0.7rem; font-size: 0.75rem; }
.btn-icon[b-2z4jyighzs] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2z4jyighzs]  { color: var(--rg-accent); }
.btn-edit:hover[b-2z4jyighzs]  { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2z4jyighzs] { color: var(--rg-danger); }
.btn-delete:hover[b-2z4jyighzs] { background: rgba(239, 68, 68, 0.1); }

.crud-alert[b-2z4jyighzs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2z4jyighzs] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-2z4jyighzs]   { background: rgba(239,68,68,0.1);  color: #991b1b;  border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-2z4jyighzs] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-2z4jyighzs]   { color: #fca5a5; }
.crud-alert-close[b-2z4jyighzs] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-search-bar[b-2z4jyighzs] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card); }
.crud-search-bar i[b-2z4jyighzs] { color: var(--rg-text-muted); }
.crud-search-bar input[b-2z4jyighzs] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-search-clear[b-2z4jyighzs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); }
.crud-count[b-2z4jyighzs] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }
.crud-search-btn[b-2z4jyighzs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); padding: 0.25rem; }

.crud-grid-wrapper[b-2z4jyighzs] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 320px); }
.crud-table[b-2z4jyighzs] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2z4jyighzs] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2z4jyighzs] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2z4jyighzs] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-2z4jyighzs] { background: var(--rg-bg-hover); }
.col-actions[b-2z4jyighzs] { width: 80px; text-align: center; white-space: nowrap; }
.text-right[b-2z4jyighzs] { text-align: right; }
.text-muted[b-2z4jyighzs] { color: var(--rg-text-muted); }
.font-mono[b-2z4jyighzs]  { font-family: 'Cascadia Code', 'Fira Code', monospace; }

.crud-loading[b-2z4jyighzs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 3rem; color: var(--rg-text-muted); }
.crud-spinner[b-2z4jyighzs] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent); border-radius: 50%; animation: spin-b-2z4jyighzs 0.8s linear infinite; }
.crud-empty-state[b-2z4jyighzs] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 3rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-2z4jyighzs] { font-size: 2.5rem; opacity: 0.4; }
.crud-empty-state p[b-2z4jyighzs] { font-size: 0.85rem; }
@keyframes spin-b-2z4jyighzs { to { transform: rotate(360deg); } }
.spin[b-2z4jyighzs] { animation: spin-b-2z4jyighzs 0.8s linear infinite; }

/* ── Tabs de navegación ────────────────────────────────────────── */
.param-tabs[b-2z4jyighzs] {
    display: flex;
    gap: 0.25rem;
    margin-bottom: 0.875rem;
    border-bottom: 2px solid var(--rg-border);
    padding-bottom: 0;
}

.param-tab[b-2z4jyighzs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    border: none;
    background: transparent;
    color: var(--rg-text-muted);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.15s;
    border-radius: 0.375rem 0.375rem 0 0;
}

.param-tab:hover[b-2z4jyighzs] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }

.param-tab.active[b-2z4jyighzs] {
    color: var(--rg-accent);
    border-bottom-color: var(--rg-accent);
    background: transparent;
}

/* ── Modales ───────────────────────────────────────────────────── */
.modal-backdrop[b-2z4jyighzs] { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1000; }
.modal-container[b-2z4jyighzs] { position: fixed; inset: 0; z-index: 1001; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.modal-dialog[b-2z4jyighzs] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.75rem; display: flex; flex-direction: column; max-height: 90vh; box-shadow: 0 20px 60px rgba(0,0,0,0.3); pointer-events: auto; }
.modal-sm[b-2z4jyighzs] { width: 100%; max-width: 420px; }
.pm-dialog[b-2z4jyighzs] { max-width: 420px; }
.modal-header[b-2z4jyighzs] { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-2z4jyighzs] { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; display: flex; align-items: center; gap: 0.4rem; }
.modal-close[b-2z4jyighzs] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2z4jyighzs] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-2z4jyighzs] { padding: 1.25rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.modal-body p[b-2z4jyighzs] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.modal-footer[b-2z4jyighzs] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }

/* ── Formulario campos ─────────────────────────────────────────── */
.form-group[b-2z4jyighzs] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-group label[b-2z4jyighzs] { font-size: 0.75rem; font-weight: 600; color: var(--rg-text-secondary); }
.form-input[b-2z4jyighzs], .form-select[b-2z4jyighzs] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    padding: 0.45rem 0.65rem;
    font-size: 0.82rem;
    outline: none;
    width: 100%;
    transition: border-color 0.15s;
}
.form-input:focus[b-2z4jyighzs], .form-select:focus[b-2z4jyighzs] { border-color: var(--rg-accent); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.form-input:disabled[b-2z4jyighzs], .form-select:disabled[b-2z4jyighzs] { opacity: 0.65; cursor: not-allowed; }

.input-pct[b-2z4jyighzs] { display: flex; align-items: center; border: 1px solid var(--rg-border); border-radius: 0.375rem; overflow: hidden; background: var(--rg-bg-input); }
.input-pct input[b-2z4jyighzs] { border: none; flex: 1; background: transparent; color: var(--rg-text-primary); padding: 0.45rem 0.65rem; font-size: 0.82rem; outline: none; }
.input-pct:focus-within[b-2z4jyighzs] { border-color: var(--rg-accent); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.pct-suffix[b-2z4jyighzs] { padding: 0 0.6rem; font-size: 0.82rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); border-left: 1px solid var(--rg-border); }

/* ── Panel de Ajuste de Precios ────────────────────────────────── */
.ajuste-panel[b-2z4jyighzs] { display: flex; flex-direction: column; gap: 0.875rem; }

.ajuste-controls[b-2z4jyighzs] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.625rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.ajuste-ctrl-row[b-2z4jyighzs] {
    display: flex;
    align-items: flex-end;
    gap: 0.875rem;
    flex-wrap: wrap;
}

.ajuste-ctrl-row .form-group[b-2z4jyighzs] { flex: 1; min-width: 160px; }
.ajuste-ctrl-row .form-group-sm[b-2z4jyighzs] { max-width: 140px; }

.ajuste-btns[b-2z4jyighzs] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-end;
    flex-shrink: 0;
    padding-bottom: 0.1rem;
}

.ajuste-ok-badge[b-2z4jyighzs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(34,197,94,0.1);
    border: 1px solid rgba(34,197,94,0.3);
    border-radius: 0.5rem;
    padding: 0.625rem 0.875rem;
    font-size: 0.82rem;
    font-weight: 500;
    color: #166534;
}
[data-mode="dark"] .ajuste-ok-badge[b-2z4jyighzs] { color: #86efac; }

.ajuste-resumen[b-2z4jyighzs] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.875rem;
}
.ajuste-resumen-label[b-2z4jyighzs] { font-size: 0.78rem; color: var(--rg-text-secondary); }

.ajuste-hint[b-2z4jyighzs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem;
    border: 2px dashed var(--rg-border);
    border-radius: 0.625rem;
    color: var(--rg-text-muted);
    font-size: 0.82rem;
    text-align: center;
    justify-content: center;
}

/* Precios coloreados en preview */
.precio-up[b-2z4jyighzs]   { color: #16a34a; font-weight: 600; }
.precio-down[b-2z4jyighzs] { color: var(--rg-danger); font-weight: 600; }
[data-mode="dark"] .precio-up[b-2z4jyighzs]   { color: #86efac; }
[data-mode="dark"] .precio-down[b-2z4jyighzs] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_ajuste.razor.rz.scp.css */
/* Frmfru_ajuste — Ajuste de Inventario */

.crud-container[b-a7iqk28wyo] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-a7iqk28wyo 0.3s ease-out; }
@keyframes slideUp-b-a7iqk28wyo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-a7iqk28wyo] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-a7iqk28wyo] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-a7iqk28wyo] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-a7iqk28wyo] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-a7iqk28wyo] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-a7iqk28wyo] { display: flex; gap: 0.5rem; }

.btn-crud[b-a7iqk28wyo] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-a7iqk28wyo] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-a7iqk28wyo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-a7iqk28wyo] { filter: brightness(1.1); }
.btn-outline[b-a7iqk28wyo] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-a7iqk28wyo] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-a7iqk28wyo] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-a7iqk28wyo] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-a7iqk28wyo] { background: rgba(79, 70, 229, 0.1); }

.crud-alert[b-a7iqk28wyo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-a7iqk28wyo] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-a7iqk28wyo] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-a7iqk28wyo] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-a7iqk28wyo] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-a7iqk28wyo]   { color: #fca5a5; }

.comp-card[b-a7iqk28wyo] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem; }
.comp-card-title[b-a7iqk28wyo] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.75rem; }

.form-row[b-a7iqk28wyo] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-a7iqk28wyo] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-a7iqk28wyo] { flex: 2; }
.form-group label[b-a7iqk28wyo] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-a7iqk28wyo], .form-group select[b-a7iqk28wyo] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-a7iqk28wyo], .form-group select:focus[b-a7iqk28wyo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* Celda producto */
.comp-prod-cell[b-a7iqk28wyo] { display: flex; gap: 0.35rem; align-items: center; flex-wrap: wrap; }
.comp-prod-input[b-a7iqk28wyo] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }
.comp-prod-nombre[b-a7iqk28wyo] { font-size: 0.8rem; color: var(--rg-text-secondary,#475569); font-weight: 500; }

/* Badge indicador de tipo */
.ajuste-tipo-badge[b-a7iqk28wyo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-radius: 0.5rem; font-size: 0.82rem; font-weight: 600; margin-top: 0.5rem; }
.ajuste-tipo-badge.entrada[b-a7iqk28wyo] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.ajuste-tipo-badge.salida[b-a7iqk28wyo]  { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .ajuste-tipo-badge.entrada[b-a7iqk28wyo] { color: #86efac; }
[data-mode="dark"] .ajuste-tipo-badge.salida[b-a7iqk28wyo]  { color: #fca5a5; }

/* Search bar */
.crud-search-bar[b-a7iqk28wyo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-a7iqk28wyo] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-a7iqk28wyo], .crud-search-btn[b-a7iqk28wyo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }

.crud-grid-wrapper[b-a7iqk28wyo] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-a7iqk28wyo] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-a7iqk28wyo] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-a7iqk28wyo] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; }
.crud-table td[b-a7iqk28wyo] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-a7iqk28wyo] { background: var(--rg-bg-hover, #f8fafc); }

.crud-loading[b-a7iqk28wyo], .crud-empty-state[b-a7iqk28wyo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-a7iqk28wyo] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-a7iqk28wyo 0.6s linear infinite; }
@keyframes spin-b-a7iqk28wyo { to { transform: rotate(360deg); } }
.spin[b-a7iqk28wyo] { animation: spin-b-a7iqk28wyo 0.8s linear infinite; }

.modal-backdrop[b-a7iqk28wyo] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-a7iqk28wyo] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-a7iqk28wyo] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-a7iqk28wyo] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-header[b-a7iqk28wyo] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-a7iqk28wyo] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-a7iqk28wyo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-a7iqk28wyo] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-a7iqk28wyo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.font-mono[b-a7iqk28wyo] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-right[b-a7iqk28wyo] { text-align: right !important; }

@media (max-width: 768px) {
    .crud-container[b-a7iqk28wyo] { padding: 0.75rem; }
    .form-row[b-a7iqk28wyo] { flex-direction: column; }
    .btn-text[b-a7iqk28wyo] { display: none; }
    .modal-dialog[b-a7iqk28wyo] { width: 98%; }
    .modal-lg[b-a7iqk28wyo] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_compra.razor.rz.scp.css */
/* ============================================================
   Frmfru_compra — Entrada de Mercancía / Compra a proveedor
   CSS isolation Blazor — estilos auto-contenidos.
   Basado en Frmclientes.razor.css + extensiones del módulo.
   ============================================================ */

.crud-container[b-i65otf2io1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-i65otf2io1 0.3s ease-out; }
@keyframes slideUp-b-i65otf2io1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-i65otf2io1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-i65otf2io1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-i65otf2io1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-i65otf2io1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-i65otf2io1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-i65otf2io1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-i65otf2io1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-i65otf2io1] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.disabled[b-i65otf2io1] { opacity: 0.6; pointer-events: none; }
.btn-primary[b-i65otf2io1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-i65otf2io1] { filter: brightness(1.1); }
.btn-outline[b-i65otf2io1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-i65otf2io1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-i65otf2io1] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-i65otf2io1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-i65otf2io1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-i65otf2io1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-i65otf2io1] { color: #ef4444; }
.btn-delete:hover[b-i65otf2io1] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-i65otf2io1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-i65otf2io1] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-i65otf2io1] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-i65otf2io1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-i65otf2io1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-i65otf2io1]   { color: #fca5a5; }

/* Tarjeta de sección */
.comp-card[b-i65otf2io1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem; }
.comp-card-title[b-i65otf2io1] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.75rem; }

/* Form */
.form-row[b-i65otf2io1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-i65otf2io1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-i65otf2io1] { flex: 2; }
.form-group label[b-i65otf2io1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-i65otf2io1], .form-group select[b-i65otf2io1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-i65otf2io1], .form-group select:focus[b-i65otf2io1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* Grid de líneas */
.crud-grid-wrapper[b-i65otf2io1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-i65otf2io1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-i65otf2io1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-i65otf2io1] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-i65otf2io1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-i65otf2io1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-i65otf2io1] { width: 60px; text-align: center; }
.text-right[b-i65otf2io1] { text-align: right !important; }

/* Celda producto con botón lupa */
.comp-prod-cell[b-i65otf2io1] { display: flex; gap: 0.25rem; align-items: center; }
.comp-prod-input[b-i65otf2io1] { width: 90px; padding: 0.25rem 0.4rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.25rem; font-size: 0.75rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }
.comp-desc-input[b-i65otf2io1] { width: 100%; padding: 0.25rem 0.4rem; border: 1px solid transparent; border-radius: 0.25rem; font-size: 0.75rem; background: transparent; color: var(--rg-text-secondary,#475569); }
.comp-num-input[b-i65otf2io1] { width: 100%; padding: 0.25rem 0.4rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.25rem; font-size: 0.75rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }

/* Totales */
.comp-totales[b-i65otf2io1] { display: flex; justify-content: flex-end; gap: 2rem; padding: .75rem .75rem 0; border-top: 1px solid var(--rg-border,#e2e8f0); margin-top: .5rem; }
.comp-total-row[b-i65otf2io1] { display: flex; gap: .5rem; align-items: baseline; font-size: .8rem; color: var(--rg-text-secondary,#475569); }
.comp-total-row strong[b-i65otf2io1] { font-size: .95rem; color: var(--rg-text-primary,#1e293b); }

/* Vacío */
.comp-empty[b-i65otf2io1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 2rem; color: var(--rg-text-muted,#94a3b8); font-size: 0.82rem; }
.comp-empty i[b-i65otf2io1] { font-size: 1.75rem; }

/* Fotos */
.comp-fotos-badge[b-i65otf2io1] { display: flex; align-items: center; gap: 0.5rem; padding: .5rem .75rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }

/* Search bar picker */
.crud-search-bar[b-i65otf2io1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-i65otf2io1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-i65otf2io1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-btn[b-i65otf2io1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }

/* Loading/empty */
.crud-loading[b-i65otf2io1], .crud-empty-state[b-i65otf2io1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-i65otf2io1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-i65otf2io1 0.6s linear infinite; }
@keyframes spin-b-i65otf2io1 { to { transform: rotate(360deg); } }
.spin[b-i65otf2io1] { animation: spin-b-i65otf2io1 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-i65otf2io1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-i65otf2io1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-i65otf2io1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-i65otf2io1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-header[b-i65otf2io1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-i65otf2io1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-i65otf2io1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-i65otf2io1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-i65otf2io1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Utilities */
.font-mono[b-i65otf2io1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-i65otf2io1] { padding: 0.75rem; }
    .form-row[b-i65otf2io1] { flex-direction: column; }
    .btn-text[b-i65otf2io1] { display: none; }
    .modal-dialog[b-i65otf2io1] { width: 98%; }
    .modal-lg[b-i65otf2io1] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_dano.razor.rz.scp.css */
/* Frmfru_dano — Daño/Merma de Inventario */

.crud-container[b-avgi56l80a] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-avgi56l80a 0.3s ease-out; }
@keyframes slideUp-b-avgi56l80a { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-avgi56l80a] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-avgi56l80a] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-avgi56l80a] { font-size: 1.75rem; }
.crud-title[b-avgi56l80a] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-avgi56l80a] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-avgi56l80a] { display: flex; gap: 0.5rem; }

.btn-crud[b-avgi56l80a] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-avgi56l80a] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.disabled[b-avgi56l80a] { opacity: 0.6; pointer-events: none; }
.btn-primary[b-avgi56l80a] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-avgi56l80a] { filter: brightness(1.1); }
.btn-outline[b-avgi56l80a] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-avgi56l80a] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-avgi56l80a] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-avgi56l80a] { filter: brightness(1.1); }
.btn-sm[b-avgi56l80a] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-avgi56l80a] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-avgi56l80a] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-avgi56l80a] { background: rgba(79, 70, 229, 0.1); }

.crud-alert[b-avgi56l80a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-avgi56l80a] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-avgi56l80a] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-avgi56l80a] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-avgi56l80a] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-avgi56l80a]   { color: #fca5a5; }

.comp-card[b-avgi56l80a] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem; }
.comp-card-title[b-avgi56l80a] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.75rem; }

/* Tarjeta de evidencia con borde rojo */
.dano-evidencia-card[b-avgi56l80a] { border-color: rgba(239,68,68,0.4); }

/* Badge "OBLIGATORIA" */
.badge-obligatorio[b-avgi56l80a] { background: rgba(239,68,68,0.15); color: #dc2626; border: 1px solid rgba(239,68,68,0.3); font-size: 0.6rem; font-weight: 700; text-transform: uppercase; padding: 0.1rem 0.4rem; border-radius: 0.25rem; letter-spacing: 0.05em; }
[data-mode="dark"] .badge-obligatorio[b-avgi56l80a] { color: #fca5a5; }

.form-row[b-avgi56l80a] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-avgi56l80a] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-avgi56l80a] { flex: 2; }
.form-group label[b-avgi56l80a] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-avgi56l80a], .form-group select[b-avgi56l80a] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-avgi56l80a], .form-group select:focus[b-avgi56l80a] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

.comp-prod-cell[b-avgi56l80a] { display: flex; gap: 0.35rem; align-items: center; flex-wrap: wrap; }
.comp-prod-input[b-avgi56l80a] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }
.comp-prod-nombre[b-avgi56l80a] { font-size: 0.8rem; color: var(--rg-text-secondary,#475569); font-weight: 500; }

.comp-empty[b-avgi56l80a] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 2rem; color: var(--rg-text-muted,#94a3b8); font-size: 0.82rem; text-align: center; }
.dano-empty-fotos[b-avgi56l80a] { color: #dc2626; background: rgba(239,68,68,0.05); border-radius: 0.5rem; }
[data-mode="dark"] .dano-empty-fotos[b-avgi56l80a] { color: #fca5a5; }

.comp-fotos-badge[b-avgi56l80a] { display: flex; align-items: center; gap: 0.5rem; padding: .5rem .75rem; font-size: .82rem; }

.crud-search-bar[b-avgi56l80a] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-avgi56l80a] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-avgi56l80a], .crud-search-btn[b-avgi56l80a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }

.crud-grid-wrapper[b-avgi56l80a] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-avgi56l80a] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-avgi56l80a] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-avgi56l80a] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; }
.crud-table td[b-avgi56l80a] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-avgi56l80a] { background: var(--rg-bg-hover, #f8fafc); }

.crud-loading[b-avgi56l80a], .crud-empty-state[b-avgi56l80a] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-avgi56l80a] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-avgi56l80a 0.6s linear infinite; }
@keyframes spin-b-avgi56l80a { to { transform: rotate(360deg); } }
.spin[b-avgi56l80a] { animation: spin-b-avgi56l80a 0.8s linear infinite; }

.modal-backdrop[b-avgi56l80a] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-avgi56l80a] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-avgi56l80a] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-avgi56l80a] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-header[b-avgi56l80a] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-avgi56l80a] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-avgi56l80a] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-avgi56l80a] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-avgi56l80a] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.font-mono[b-avgi56l80a] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-right[b-avgi56l80a] { text-align: right !important; }

@media (max-width: 768px) {
    .crud-container[b-avgi56l80a] { padding: 0.75rem; }
    .form-row[b-avgi56l80a] { flex-direction: column; }
    .btn-text[b-avgi56l80a] { display: none; }
    .modal-dialog[b-avgi56l80a] { width: 98%; }
    .modal-lg[b-avgi56l80a] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_dgii_606.razor.rz.scp.css */
/* Frmfru_dgii_606 — DGII 606 Compras — Frutas/Urimat */

.crud-container[b-ph837kmveb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ph837kmveb 0.3s ease-out; }
@keyframes slideUp-b-ph837kmveb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-ph837kmveb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ph837kmveb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ph837kmveb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ph837kmveb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ph837kmveb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ph837kmveb] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.btn-crud[b-ph837kmveb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ph837kmveb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ph837kmveb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ph837kmveb] { filter: brightness(1.1); }
.btn-outline[b-ph837kmveb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ph837kmveb] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-ph837kmveb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ph837kmveb] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-ph837kmveb]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-ph837kmveb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-ph837kmveb] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-ph837kmveb]   { color: #fca5a5; }

/* Filtros */
.dgii-filters[b-ph837kmveb] { display: flex; align-items: flex-end; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-ph837kmveb] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-ph837kmveb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ph837kmveb], .form-group select[b-ph837kmveb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-ph837kmveb], .form-group select:focus[b-ph837kmveb] { border-color: var(--rg-accent, #4f46e5); }

/* Resumen */
.dgii-resumen[b-ph837kmveb] { display: flex; gap: 1.5rem; flex-wrap: wrap; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .65rem 1rem; margin-bottom: .75rem; }
.dgii-res-item[b-ph837kmveb] { display: flex; gap: .4rem; align-items: baseline; font-size: .82rem; color: var(--rg-text-secondary, #475569); }
.dgii-res-item strong[b-ph837kmveb] { color: var(--rg-text-primary, #1e293b); font-weight: 700; }

/* Grid */
.crud-grid-wrapper[b-ph837kmveb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-ph837kmveb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ph837kmveb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ph837kmveb] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ph837kmveb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ph837kmveb] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tfoot td[b-ph837kmveb] { padding: 0.5rem 0.75rem; border-top: 2px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); }
.text-right[b-ph837kmveb] { text-align: right !important; }
.text-center[b-ph837kmveb] { text-align: center !important; }

/* Total row */
.dgii-tfoot[b-ph837kmveb] { background: var(--rg-bg-subtle, #f8fafc) !important; }
.dgii-tfoot td[b-ph837kmveb] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }

/* Badges */
.badge[b-ph837kmveb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-ncf[b-ph837kmveb] { background: rgba(99,102,241,0.12); color: #3730a3; border: 1px solid rgba(99,102,241,0.25); }
.badge-tipo[b-ph837kmveb] { background: rgba(14,165,233,0.12); color: #0369a1; }
[data-mode="dark"] .badge-ncf[b-ph837kmveb] { color: #c7d2fe; }
[data-mode="dark"] .badge-tipo[b-ph837kmveb] { color: #7dd3fc; }

.dgii-sin-ncf[b-ph837kmveb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); font-style: italic; }

/* Loading/empty */
.crud-loading[b-ph837kmveb], .crud-empty-state[b-ph837kmveb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ph837kmveb] { font-size: 2.5rem; }
.crud-spinner[b-ph837kmveb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ph837kmveb 0.6s linear infinite; }
@keyframes spin-b-ph837kmveb { to { transform: rotate(360deg); } }
.spin[b-ph837kmveb] { animation: spin-b-ph837kmveb 0.8s linear infinite; }

.font-mono[b-ph837kmveb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

@media (max-width: 768px) {
    .crud-container[b-ph837kmveb] { padding: 0.75rem; }
    .dgii-filters[b-ph837kmveb] { flex-direction: column; align-items: stretch; }
    .btn-text[b-ph837kmveb] { display: none; }
    .dgii-resumen[b-ph837kmveb] { gap: .75rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_dgii_607.razor.rz.scp.css */
/* Frmfru_dgii_607 — DGII 607 Ventas — Frutas/Urimat */

.crud-container[b-doulaxyvai] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-doulaxyvai 0.3s ease-out; }
@keyframes slideUp-b-doulaxyvai { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-doulaxyvai] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-doulaxyvai] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-doulaxyvai] { font-size: 1.75rem; color: var(--rg-success, #22c55e); }
.crud-title[b-doulaxyvai] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-doulaxyvai] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-doulaxyvai] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

.btn-crud[b-doulaxyvai] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-doulaxyvai] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-doulaxyvai] { background: var(--rg-success, #22c55e); color: #fff; }
.btn-primary:hover:not(:disabled)[b-doulaxyvai] { filter: brightness(1.1); }
.btn-outline[b-doulaxyvai] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-doulaxyvai] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-doulaxyvai] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-doulaxyvai] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-doulaxyvai]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-doulaxyvai] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-doulaxyvai] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-doulaxyvai]   { color: #fca5a5; }

/* Filtros */
.dgii-filters[b-doulaxyvai] { display: flex; align-items: flex-end; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-doulaxyvai] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-doulaxyvai] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-doulaxyvai], .form-group select[b-doulaxyvai] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-doulaxyvai], .form-group select:focus[b-doulaxyvai] { border-color: var(--rg-success, #22c55e); }

/* Resumen */
.dgii-resumen[b-doulaxyvai] { display: flex; gap: 1.5rem; flex-wrap: wrap; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .65rem 1rem; margin-bottom: .75rem; }
.dgii-res-item[b-doulaxyvai] { display: flex; gap: .4rem; align-items: baseline; font-size: .82rem; color: var(--rg-text-secondary, #475569); }
.dgii-res-item strong[b-doulaxyvai] { color: var(--rg-text-primary, #1e293b); font-weight: 700; }

/* Grid */
.crud-grid-wrapper[b-doulaxyvai] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-doulaxyvai] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-doulaxyvai] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-doulaxyvai] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-doulaxyvai] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-doulaxyvai] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tfoot td[b-doulaxyvai] { padding: 0.5rem 0.75rem; border-top: 2px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); }
.text-right[b-doulaxyvai] { text-align: right !important; }
.text-center[b-doulaxyvai] { text-align: center !important; }

/* Total row */
.dgii-tfoot[b-doulaxyvai] { background: var(--rg-bg-subtle, #f8fafc) !important; }
.dgii-tfoot td[b-doulaxyvai] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }

/* Badges */
.badge[b-doulaxyvai] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-ncf[b-doulaxyvai] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.25); }
[data-mode="dark"] .badge-ncf[b-doulaxyvai] { color: #86efac; }

.dgii-sin-ncf[b-doulaxyvai] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); font-style: italic; }

/* ITBIS */
.text-itbis[b-doulaxyvai] { color: #0369a1 !important; font-weight: 600; }
[data-mode="dark"] .text-itbis[b-doulaxyvai] { color: #7dd3fc !important; }

/* Loading/empty */
.crud-loading[b-doulaxyvai], .crud-empty-state[b-doulaxyvai] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-doulaxyvai] { font-size: 2.5rem; }
.crud-spinner[b-doulaxyvai] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-success, #22c55e); border-radius: 50%; animation: spin-b-doulaxyvai 0.6s linear infinite; }
@keyframes spin-b-doulaxyvai { to { transform: rotate(360deg); } }
.spin[b-doulaxyvai] { animation: spin-b-doulaxyvai 0.8s linear infinite; }

.font-mono[b-doulaxyvai] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

@media (max-width: 768px) {
    .crud-container[b-doulaxyvai] { padding: 0.75rem; }
    .dgii-filters[b-doulaxyvai] { flex-direction: column; align-items: stretch; }
    .btn-text[b-doulaxyvai] { display: none; }
    .dgii-resumen[b-doulaxyvai] { gap: .75rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_kardex.razor.rz.scp.css */
/* Frmfru_kardex — Kardex de Inventario Frutas */

.crud-container[b-z5scdpv0wf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-z5scdpv0wf 0.3s ease-out; }
@keyframes slideUp-b-z5scdpv0wf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-z5scdpv0wf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-z5scdpv0wf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-z5scdpv0wf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-z5scdpv0wf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-z5scdpv0wf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-z5scdpv0wf] { display: flex; gap: 0.5rem; }

.btn-crud[b-z5scdpv0wf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-z5scdpv0wf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-z5scdpv0wf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-z5scdpv0wf] { filter: brightness(1.1); }
.btn-outline[b-z5scdpv0wf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-z5scdpv0wf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-z5scdpv0wf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-z5scdpv0wf] { filter: brightness(1.1); }
.btn-icon[b-z5scdpv0wf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-z5scdpv0wf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-z5scdpv0wf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-z5scdpv0wf] { color: #ef4444; }
.btn-delete:hover[b-z5scdpv0wf] { background: rgba(239, 68, 68, 0.1); }

.crud-alert[b-z5scdpv0wf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-z5scdpv0wf] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-z5scdpv0wf] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-z5scdpv0wf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-z5scdpv0wf] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-z5scdpv0wf]   { color: #fca5a5; }

/* Filtros */
.kdx-filters[b-z5scdpv0wf] { display: flex; align-items: flex-end; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-z5scdpv0wf] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-z5scdpv0wf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-z5scdpv0wf], .form-group select[b-z5scdpv0wf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-z5scdpv0wf], .form-group select:focus[b-z5scdpv0wf] { border-color: var(--rg-accent, #4f46e5); }

/* Producto cell */
.comp-prod-cell[b-z5scdpv0wf] { display: flex; gap: 0.35rem; align-items: center; flex-wrap: wrap; }
.comp-prod-input[b-z5scdpv0wf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); width: 140px; }
.comp-prod-nombre[b-z5scdpv0wf] { font-size: 0.8rem; color: var(--rg-text-secondary,#475569); font-weight: 500; }

/* Resumen rápido */
.kdx-resumen[b-z5scdpv0wf] { display: flex; gap: 1.5rem; flex-wrap: wrap; background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: .5rem; padding: .65rem 1rem; margin-bottom: .75rem; }
.kdx-res-item[b-z5scdpv0wf] { display: flex; gap: .4rem; align-items: baseline; font-size: .8rem; color: var(--rg-text-secondary,#475569); }
.kdx-res-item strong[b-z5scdpv0wf] { color: var(--rg-text-primary,#1e293b); }

/* Grid */
.crud-grid-wrapper[b-z5scdpv0wf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 340px); }
.crud-table[b-z5scdpv0wf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-z5scdpv0wf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-z5scdpv0wf] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-z5scdpv0wf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-z5scdpv0wf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-z5scdpv0wf] { width: 60px; text-align: center; }
.text-right[b-z5scdpv0wf] { text-align: right !important; }

/* Filas anuladas */
.kdx-anulada td[b-z5scdpv0wf] { opacity: 0.45; text-decoration: line-through; }

/* Badges de tipo */
.badge[b-z5scdpv0wf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-entrada[b-z5scdpv0wf]  { background: rgba(34,197,94,0.12); color: #166534; }
.badge-salida[b-z5scdpv0wf]   { background: rgba(239,68,68,0.12); color: #991b1b; }
.badge-ajuste[b-z5scdpv0wf]   { background: rgba(99,102,241,0.12); color: #3730a3; }
.badge-anulada[b-z5scdpv0wf]  { background: rgba(148,163,184,0.2); color: #64748b; }
[data-mode="dark"] .badge-entrada[b-z5scdpv0wf]  { color: #86efac; }
[data-mode="dark"] .badge-salida[b-z5scdpv0wf]   { color: #fca5a5; }
[data-mode="dark"] .badge-ajuste[b-z5scdpv0wf]   { color: #c7d2fe; }

/* Colores de cantidades signadas */
.text-entrada[b-z5scdpv0wf] { color: #16a34a !important; font-weight: 600; }
.text-salida[b-z5scdpv0wf]  { color: #dc2626 !important; font-weight: 600; }
[data-mode="dark"] .text-entrada[b-z5scdpv0wf] { color: #4ade80 !important; }
[data-mode="dark"] .text-salida[b-z5scdpv0wf]  { color: #f87171 !important; }

/* Search */
.crud-search-bar[b-z5scdpv0wf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-z5scdpv0wf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-z5scdpv0wf], .crud-search-btn[b-z5scdpv0wf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }

/* Loading/empty */
.crud-loading[b-z5scdpv0wf], .crud-empty-state[b-z5scdpv0wf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-z5scdpv0wf] { font-size: 2rem; }
.crud-spinner[b-z5scdpv0wf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-z5scdpv0wf 0.6s linear infinite; }
@keyframes spin-b-z5scdpv0wf { to { transform: rotate(360deg); } }
.spin[b-z5scdpv0wf] { animation: spin-b-z5scdpv0wf 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-z5scdpv0wf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-z5scdpv0wf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-z5scdpv0wf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-z5scdpv0wf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-sm[b-z5scdpv0wf] { max-width: 420px; }
.modal-header[b-z5scdpv0wf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-z5scdpv0wf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-z5scdpv0wf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-z5scdpv0wf] { color: #dc2626; }
.modal-close[b-z5scdpv0wf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-z5scdpv0wf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-z5scdpv0wf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.font-mono[b-z5scdpv0wf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

@media (max-width: 768px) {
    .crud-container[b-z5scdpv0wf] { padding: 0.75rem; }
    .kdx-filters[b-z5scdpv0wf] { flex-direction: column; align-items: stretch; }
    .btn-text[b-z5scdpv0wf] { display: none; }
    .modal-dialog[b-z5scdpv0wf] { width: 98%; }
    .modal-lg[b-z5scdpv0wf] { width: 98vw; height: 95vh; max-height: 95vh; }
    .kdx-resumen[b-z5scdpv0wf] { gap: .75rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_stock.razor.rz.scp.css */
/* Frmfru_stock — Stock de Inventario Frutas */

.crud-container[b-zfrwi1pezy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zfrwi1pezy 0.3s ease-out; }
@keyframes slideUp-b-zfrwi1pezy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-zfrwi1pezy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zfrwi1pezy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zfrwi1pezy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zfrwi1pezy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zfrwi1pezy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zfrwi1pezy] { display: flex; gap: 0.5rem; }

.btn-crud[b-zfrwi1pezy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zfrwi1pezy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zfrwi1pezy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zfrwi1pezy] { filter: brightness(1.1); }
.btn-outline[b-zfrwi1pezy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zfrwi1pezy] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-alert[b-zfrwi1pezy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zfrwi1pezy] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-zfrwi1pezy] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-zfrwi1pezy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-zfrwi1pezy] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-zfrwi1pezy]   { color: #fca5a5; }

/* Filtros */
.stock-filters[b-zfrwi1pezy] { display: flex; align-items: flex-end; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-zfrwi1pezy] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-zfrwi1pezy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group select[b-zfrwi1pezy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }

/* Search */
.crud-search-bar[b-zfrwi1pezy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-zfrwi1pezy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zfrwi1pezy], .crud-search-btn[b-zfrwi1pezy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }
.crud-count[b-zfrwi1pezy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; align-self: center; }

/* Grid */
.crud-grid-wrapper[b-zfrwi1pezy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zfrwi1pezy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zfrwi1pezy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zfrwi1pezy] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zfrwi1pezy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zfrwi1pezy] { background: var(--rg-bg-hover, #f8fafc); }
.text-right[b-zfrwi1pezy] { text-align: right !important; }

/* Fila stock cero */
.stock-cero td[b-zfrwi1pezy] { opacity: 0.55; }
.text-danger[b-zfrwi1pezy] { color: #dc2626 !important; }
[data-mode="dark"] .text-danger[b-zfrwi1pezy] { color: #f87171 !important; }

/* Fila de totales */
tfoot .stock-total-row[b-zfrwi1pezy] { background: var(--rg-bg-subtle, #f8fafc); }
tfoot .stock-total-row td[b-zfrwi1pezy] { padding: 0.625rem 0.75rem; border-top: 2px solid var(--rg-border, #e2e8f0); border-bottom: none; font-size: 0.78rem; }

/* Loading / empty */
.crud-loading[b-zfrwi1pezy], .crud-empty-state[b-zfrwi1pezy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zfrwi1pezy] { font-size: 2rem; }
.crud-spinner[b-zfrwi1pezy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zfrwi1pezy 0.6s linear infinite; }
@keyframes spin-b-zfrwi1pezy { to { transform: rotate(360deg); } }
.spin[b-zfrwi1pezy] { animation: spin-b-zfrwi1pezy 0.8s linear infinite; }

.font-mono[b-zfrwi1pezy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

@media (max-width: 768px) {
    .crud-container[b-zfrwi1pezy] { padding: 0.75rem; }
    .stock-filters[b-zfrwi1pezy] { flex-direction: column; align-items: stretch; }
    .btn-text[b-zfrwi1pezy] { display: none; }
}
/* _content/Rgclouds.Web/Components/Pages/Frutas/Inventario/Frmfru_transferencia.razor.rz.scp.css */
/* ============================================================
   Frmfru_compra — Entrada de Mercancía / Compra a proveedor
   CSS isolation Blazor — estilos auto-contenidos.
   Basado en Frmclientes.razor.css + extensiones del módulo.
   ============================================================ */

.crud-container[b-oecqx74bpa] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-oecqx74bpa 0.3s ease-out; }
@keyframes slideUp-b-oecqx74bpa { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-oecqx74bpa] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-oecqx74bpa] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-oecqx74bpa] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-oecqx74bpa] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-oecqx74bpa] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-oecqx74bpa] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-oecqx74bpa] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-oecqx74bpa] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.disabled[b-oecqx74bpa] { opacity: 0.6; pointer-events: none; }
.btn-primary[b-oecqx74bpa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-oecqx74bpa] { filter: brightness(1.1); }
.btn-outline[b-oecqx74bpa] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-oecqx74bpa] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-oecqx74bpa] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-oecqx74bpa] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-oecqx74bpa] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-oecqx74bpa] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-oecqx74bpa] { color: #ef4444; }
.btn-delete:hover[b-oecqx74bpa] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-oecqx74bpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-oecqx74bpa] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-oecqx74bpa] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-oecqx74bpa] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-oecqx74bpa] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-oecqx74bpa]   { color: #fca5a5; }

/* Tarjeta de sección */
.comp-card[b-oecqx74bpa] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem; }
.comp-card-title[b-oecqx74bpa] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.75rem; }

/* Form */
.form-row[b-oecqx74bpa] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-oecqx74bpa] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-oecqx74bpa] { flex: 2; }
.form-group label[b-oecqx74bpa] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-oecqx74bpa], .form-group select[b-oecqx74bpa] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-oecqx74bpa], .form-group select:focus[b-oecqx74bpa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* Grid de líneas */
.crud-grid-wrapper[b-oecqx74bpa] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-oecqx74bpa] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-oecqx74bpa] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-oecqx74bpa] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-oecqx74bpa] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-oecqx74bpa] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-oecqx74bpa] { width: 60px; text-align: center; }
.text-right[b-oecqx74bpa] { text-align: right !important; }

/* Celda producto con botón lupa */
.comp-prod-cell[b-oecqx74bpa] { display: flex; gap: 0.25rem; align-items: center; }
.comp-prod-input[b-oecqx74bpa] { width: 90px; padding: 0.25rem 0.4rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.25rem; font-size: 0.75rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }
.comp-desc-input[b-oecqx74bpa] { width: 100%; padding: 0.25rem 0.4rem; border: 1px solid transparent; border-radius: 0.25rem; font-size: 0.75rem; background: transparent; color: var(--rg-text-secondary,#475569); }
.comp-num-input[b-oecqx74bpa] { width: 100%; padding: 0.25rem 0.4rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.25rem; font-size: 0.75rem; background: var(--rg-bg-input,#fff); color: var(--rg-text-primary,#1e293b); }

/* Totales */
.comp-totales[b-oecqx74bpa] { display: flex; justify-content: flex-end; gap: 2rem; padding: .75rem .75rem 0; border-top: 1px solid var(--rg-border,#e2e8f0); margin-top: .5rem; }
.comp-total-row[b-oecqx74bpa] { display: flex; gap: .5rem; align-items: baseline; font-size: .8rem; color: var(--rg-text-secondary,#475569); }
.comp-total-row strong[b-oecqx74bpa] { font-size: .95rem; color: var(--rg-text-primary,#1e293b); }

/* Vacío */
.comp-empty[b-oecqx74bpa] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 2rem; color: var(--rg-text-muted,#94a3b8); font-size: 0.82rem; }
.comp-empty i[b-oecqx74bpa] { font-size: 1.75rem; }

/* Fotos */
.comp-fotos-badge[b-oecqx74bpa] { display: flex; align-items: center; gap: 0.5rem; padding: .5rem .75rem; font-size: .82rem; color: var(--rg-text-secondary,#475569); }

/* Search bar picker */
.crud-search-bar[b-oecqx74bpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar input[b-oecqx74bpa] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-oecqx74bpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-btn[b-oecqx74bpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; }

/* Loading/empty */
.crud-loading[b-oecqx74bpa], .crud-empty-state[b-oecqx74bpa] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-oecqx74bpa] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-oecqx74bpa 0.6s linear infinite; }
@keyframes spin-b-oecqx74bpa { to { transform: rotate(360deg); } }
.spin[b-oecqx74bpa] { animation: spin-b-oecqx74bpa 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-oecqx74bpa] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-oecqx74bpa] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-oecqx74bpa] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-oecqx74bpa] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-header[b-oecqx74bpa] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-oecqx74bpa] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-oecqx74bpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-oecqx74bpa] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-oecqx74bpa] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Utilities */
.font-mono[b-oecqx74bpa] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-oecqx74bpa] { padding: 0.75rem; }
    .form-row[b-oecqx74bpa] { flex-direction: column; }
    .btn-text[b-oecqx74bpa] { display: none; }
    .modal-dialog[b-oecqx74bpa] { width: 98%; }
    .modal-lg[b-oecqx74bpa] { width: 98vw; height: 95vh; max-height: 95vh; }
}
/* _content/Rgclouds.Web/Components/Pages/Graficos/Frmimpresiongraficos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6xgqh35puj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6xgqh35puj 0.3s ease-out; }
@keyframes slideUp-b-6xgqh35puj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6xgqh35puj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6xgqh35puj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6xgqh35puj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6xgqh35puj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6xgqh35puj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6xgqh35puj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6xgqh35puj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6xgqh35puj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6xgqh35puj] { filter: brightness(1.1); }
.btn-outline[b-6xgqh35puj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6xgqh35puj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6xgqh35puj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6xgqh35puj] { filter: brightness(1.1); }
.btn-icon[b-6xgqh35puj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6xgqh35puj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6xgqh35puj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6xgqh35puj] { color: #ef4444; }
.btn-delete:hover[b-6xgqh35puj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6xgqh35puj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6xgqh35puj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6xgqh35puj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6xgqh35puj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6xgqh35puj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6xgqh35puj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6xgqh35puj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6xgqh35puj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6xgqh35puj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6xgqh35puj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6xgqh35puj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6xgqh35puj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6xgqh35puj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6xgqh35puj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6xgqh35puj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6xgqh35puj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6xgqh35puj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6xgqh35puj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6xgqh35puj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6xgqh35puj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6xgqh35puj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6xgqh35puj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6xgqh35puj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6xgqh35puj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6xgqh35puj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6xgqh35puj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6xgqh35puj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6xgqh35puj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6xgqh35puj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6xgqh35puj] { display: block; }
.hide-on-cards[b-6xgqh35puj] { display: none !important; }
.show-on-cards[b-6xgqh35puj] { display: grid; }
.hide-on-grid[b-6xgqh35puj] { display: none !important; }

/* Badges */
.badge[b-6xgqh35puj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6xgqh35puj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6xgqh35puj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6xgqh35puj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6xgqh35puj] { text-align: center; }
.text-muted[b-6xgqh35puj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6xgqh35puj], .crud-empty-state[b-6xgqh35puj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6xgqh35puj] { font-size: 2rem; }
.crud-spinner[b-6xgqh35puj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6xgqh35puj 0.6s linear infinite; }
.crud-spinner-sm[b-6xgqh35puj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6xgqh35puj 0.6s linear infinite; }
@keyframes spin-b-6xgqh35puj { to { transform: rotate(360deg); } }
.spin[b-6xgqh35puj] { animation: spin-b-6xgqh35puj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6xgqh35puj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6xgqh35puj 0.15s ease-out; }
.modal-container[b-6xgqh35puj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6xgqh35puj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6xgqh35puj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6xgqh35puj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6xgqh35puj] { max-width: 420px; }
@keyframes fadeIn-b-6xgqh35puj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6xgqh35puj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6xgqh35puj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6xgqh35puj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6xgqh35puj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6xgqh35puj] { color: #dc2626; }
.modal-close[b-6xgqh35puj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6xgqh35puj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6xgqh35puj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6xgqh35puj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6xgqh35puj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6xgqh35puj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6xgqh35puj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6xgqh35puj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6xgqh35puj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6xgqh35puj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6xgqh35puj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6xgqh35puj] { flex: 2; }
.form-group label[b-6xgqh35puj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6xgqh35puj], .form-group select[b-6xgqh35puj], .form-textarea[b-6xgqh35puj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6xgqh35puj], .form-group select:focus[b-6xgqh35puj], .form-textarea:focus[b-6xgqh35puj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6xgqh35puj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6xgqh35puj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6xgqh35puj] { flex: 1; display: flex; align-items: center; }
.form-check[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6xgqh35puj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6xgqh35puj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6xgqh35puj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6xgqh35puj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6xgqh35puj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6xgqh35puj] { font-size: 3rem; }
.photo-placeholder span[b-6xgqh35puj] { font-size: 0.78rem; }
.photo-actions[b-6xgqh35puj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6xgqh35puj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6xgqh35puj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6xgqh35puj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6xgqh35puj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6xgqh35puj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6xgqh35puj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6xgqh35puj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6xgqh35puj] { filter: brightness(1.15); transform: scale(1.05); }
[b-6xgqh35puj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6xgqh35puj] { padding: 0.75rem; }
    .crud-header[b-6xgqh35puj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6xgqh35puj] { font-size: 1.1rem; }
    .btn-text[b-6xgqh35puj] { display: none; }
    .form-row[b-6xgqh35puj] { flex-direction: column; }
    .form-row-4[b-6xgqh35puj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6xgqh35puj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6xgqh35puj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6xgqh35puj] { padding: 0.75rem; }
    .modal-tabs[b-6xgqh35puj] { overflow-x: auto; }
    .modal-tab[b-6xgqh35puj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6xgqh35puj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6xgqh35puj] { display: grid !important; }
    .crud-cards-wrapper[b-6xgqh35puj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6xgqh35puj] { grid-template-columns: 1fr; }
    .card-details[b-6xgqh35puj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6xgqh35puj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6xgqh35puj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6xgqh35puj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6xgqh35puj] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Graficos/Frmmantenimientografico.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-bilvutsb0h] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-bilvutsb0h 0.3s ease-out; }
@keyframes slideUp-b-bilvutsb0h { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-bilvutsb0h] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-bilvutsb0h] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-bilvutsb0h] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-bilvutsb0h] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-bilvutsb0h] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-bilvutsb0h] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-bilvutsb0h] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-bilvutsb0h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-bilvutsb0h] { filter: brightness(1.1); }
.btn-outline[b-bilvutsb0h] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-bilvutsb0h] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-bilvutsb0h] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-bilvutsb0h] { filter: brightness(1.1); }
.btn-icon[b-bilvutsb0h] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-bilvutsb0h] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-bilvutsb0h] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-bilvutsb0h] { color: #ef4444; }
.btn-delete:hover[b-bilvutsb0h] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-bilvutsb0h] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-bilvutsb0h] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-bilvutsb0h] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-bilvutsb0h] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-bilvutsb0h] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-bilvutsb0h] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-bilvutsb0h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-bilvutsb0h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-bilvutsb0h] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-bilvutsb0h] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-bilvutsb0h] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-bilvutsb0h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-bilvutsb0h] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-bilvutsb0h] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-bilvutsb0h] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-bilvutsb0h] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-bilvutsb0h] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-bilvutsb0h] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-bilvutsb0h] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-bilvutsb0h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-bilvutsb0h] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-bilvutsb0h] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-bilvutsb0h] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-bilvutsb0h] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-bilvutsb0h] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-bilvutsb0h] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-bilvutsb0h] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-bilvutsb0h] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-bilvutsb0h] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-bilvutsb0h] { display: block; }
.hide-on-cards[b-bilvutsb0h] { display: none !important; }
.show-on-cards[b-bilvutsb0h] { display: grid; }
.hide-on-grid[b-bilvutsb0h] { display: none !important; }

/* Badges */
.badge[b-bilvutsb0h] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-bilvutsb0h] { background: #ecfdf5; color: #065f46; }
.badge-no[b-bilvutsb0h] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-bilvutsb0h] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-bilvutsb0h] { text-align: center; }
.text-muted[b-bilvutsb0h] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-bilvutsb0h], .crud-empty-state[b-bilvutsb0h] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-bilvutsb0h] { font-size: 2rem; }
.crud-spinner[b-bilvutsb0h] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-bilvutsb0h 0.6s linear infinite; }
.crud-spinner-sm[b-bilvutsb0h] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-bilvutsb0h 0.6s linear infinite; }
@keyframes spin-b-bilvutsb0h { to { transform: rotate(360deg); } }
.spin[b-bilvutsb0h] { animation: spin-b-bilvutsb0h 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-bilvutsb0h] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-bilvutsb0h 0.15s ease-out; }
.modal-container[b-bilvutsb0h] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-bilvutsb0h] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-bilvutsb0h 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-bilvutsb0h] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-bilvutsb0h] { max-width: 420px; }
@keyframes fadeIn-b-bilvutsb0h { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-bilvutsb0h { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-bilvutsb0h] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-bilvutsb0h] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-bilvutsb0h] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-bilvutsb0h] { color: #dc2626; }
.modal-close[b-bilvutsb0h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-bilvutsb0h] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-bilvutsb0h] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-bilvutsb0h] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-bilvutsb0h] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-bilvutsb0h] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-bilvutsb0h] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-bilvutsb0h] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-bilvutsb0h] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-bilvutsb0h] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-bilvutsb0h] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-bilvutsb0h] { flex: 2; }
.form-group label[b-bilvutsb0h] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-bilvutsb0h], .form-group select[b-bilvutsb0h], .form-textarea[b-bilvutsb0h] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-bilvutsb0h], .form-group select:focus[b-bilvutsb0h], .form-textarea:focus[b-bilvutsb0h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-bilvutsb0h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-bilvutsb0h] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-bilvutsb0h] { flex: 1; display: flex; align-items: center; }
.form-check[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-bilvutsb0h] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-bilvutsb0h] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-bilvutsb0h] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-bilvutsb0h] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-bilvutsb0h] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-bilvutsb0h] { font-size: 3rem; }
.photo-placeholder span[b-bilvutsb0h] { font-size: 0.78rem; }
.photo-actions[b-bilvutsb0h] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-bilvutsb0h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-bilvutsb0h] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-bilvutsb0h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-bilvutsb0h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-bilvutsb0h] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-bilvutsb0h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-bilvutsb0h] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-bilvutsb0h] { filter: brightness(1.15); transform: scale(1.05); }
[b-bilvutsb0h] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-bilvutsb0h] { padding: 0.75rem; }
    .crud-header[b-bilvutsb0h] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-bilvutsb0h] { font-size: 1.1rem; }
    .btn-text[b-bilvutsb0h] { display: none; }
    .form-row[b-bilvutsb0h] { flex-direction: column; }
    .form-row-4[b-bilvutsb0h] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-bilvutsb0h] { width: 98%; max-height: 95vh; }
    .modal-lg[b-bilvutsb0h] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-bilvutsb0h] { padding: 0.75rem; }
    .modal-tabs[b-bilvutsb0h] { overflow-x: auto; }
    .modal-tab[b-bilvutsb0h] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-bilvutsb0h] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-bilvutsb0h] { display: grid !important; }
    .crud-cards-wrapper[b-bilvutsb0h] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-bilvutsb0h] { grid-template-columns: 1fr; }
    .card-details[b-bilvutsb0h] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-bilvutsb0h] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-bilvutsb0h] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-bilvutsb0h] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-bilvutsb0h] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Graficos/Frmmergestores.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-epqsxqk75x] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-epqsxqk75x 0.3s ease-out; }
@keyframes slideUp-b-epqsxqk75x { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-epqsxqk75x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-epqsxqk75x] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-epqsxqk75x] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-epqsxqk75x] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-epqsxqk75x] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-epqsxqk75x] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-epqsxqk75x] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-epqsxqk75x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-epqsxqk75x] { filter: brightness(1.1); }
.btn-outline[b-epqsxqk75x] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-epqsxqk75x] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-epqsxqk75x] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-epqsxqk75x] { filter: brightness(1.1); }
.btn-icon[b-epqsxqk75x] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-epqsxqk75x] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-epqsxqk75x] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-epqsxqk75x] { color: #ef4444; }
.btn-delete:hover[b-epqsxqk75x] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-epqsxqk75x] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-epqsxqk75x] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-epqsxqk75x] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-epqsxqk75x] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-epqsxqk75x] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-epqsxqk75x] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-epqsxqk75x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-epqsxqk75x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-epqsxqk75x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-epqsxqk75x] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-epqsxqk75x] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-epqsxqk75x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-epqsxqk75x] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-epqsxqk75x] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-epqsxqk75x] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-epqsxqk75x] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-epqsxqk75x] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-epqsxqk75x] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-epqsxqk75x] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-epqsxqk75x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-epqsxqk75x] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-epqsxqk75x] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-epqsxqk75x] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-epqsxqk75x] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-epqsxqk75x] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-epqsxqk75x] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-epqsxqk75x] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-epqsxqk75x] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-epqsxqk75x] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-epqsxqk75x] { display: block; }
.hide-on-cards[b-epqsxqk75x] { display: none !important; }
.show-on-cards[b-epqsxqk75x] { display: grid; }
.hide-on-grid[b-epqsxqk75x] { display: none !important; }

/* Badges */
.badge[b-epqsxqk75x] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-epqsxqk75x] { background: #ecfdf5; color: #065f46; }
.badge-no[b-epqsxqk75x] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-epqsxqk75x] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-epqsxqk75x] { text-align: center; }
.text-muted[b-epqsxqk75x] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-epqsxqk75x], .crud-empty-state[b-epqsxqk75x] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-epqsxqk75x] { font-size: 2rem; }
.crud-spinner[b-epqsxqk75x] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-epqsxqk75x 0.6s linear infinite; }
.crud-spinner-sm[b-epqsxqk75x] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-epqsxqk75x 0.6s linear infinite; }
@keyframes spin-b-epqsxqk75x { to { transform: rotate(360deg); } }
.spin[b-epqsxqk75x] { animation: spin-b-epqsxqk75x 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-epqsxqk75x] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-epqsxqk75x 0.15s ease-out; }
.modal-container[b-epqsxqk75x] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-epqsxqk75x] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-epqsxqk75x 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-epqsxqk75x] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-epqsxqk75x] { max-width: 420px; }
@keyframes fadeIn-b-epqsxqk75x { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-epqsxqk75x { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-epqsxqk75x] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-epqsxqk75x] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-epqsxqk75x] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-epqsxqk75x] { color: #dc2626; }
.modal-close[b-epqsxqk75x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-epqsxqk75x] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-epqsxqk75x] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-epqsxqk75x] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-epqsxqk75x] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-epqsxqk75x] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-epqsxqk75x] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-epqsxqk75x] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-epqsxqk75x] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-epqsxqk75x] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-epqsxqk75x] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-epqsxqk75x] { flex: 2; }
.form-group label[b-epqsxqk75x] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-epqsxqk75x], .form-group select[b-epqsxqk75x], .form-textarea[b-epqsxqk75x] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-epqsxqk75x], .form-group select:focus[b-epqsxqk75x], .form-textarea:focus[b-epqsxqk75x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-epqsxqk75x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-epqsxqk75x] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-epqsxqk75x] { flex: 1; display: flex; align-items: center; }
.form-check[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-epqsxqk75x] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-epqsxqk75x] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-epqsxqk75x] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-epqsxqk75x] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-epqsxqk75x] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-epqsxqk75x] { font-size: 3rem; }
.photo-placeholder span[b-epqsxqk75x] { font-size: 0.78rem; }
.photo-actions[b-epqsxqk75x] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-epqsxqk75x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-epqsxqk75x] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-epqsxqk75x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-epqsxqk75x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-epqsxqk75x] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-epqsxqk75x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-epqsxqk75x] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-epqsxqk75x] { filter: brightness(1.15); transform: scale(1.05); }
[b-epqsxqk75x] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-epqsxqk75x] { padding: 0.75rem; }
    .crud-header[b-epqsxqk75x] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-epqsxqk75x] { font-size: 1.1rem; }
    .btn-text[b-epqsxqk75x] { display: none; }
    .form-row[b-epqsxqk75x] { flex-direction: column; }
    .form-row-4[b-epqsxqk75x] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-epqsxqk75x] { width: 98%; max-height: 95vh; }
    .modal-lg[b-epqsxqk75x] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-epqsxqk75x] { padding: 0.75rem; }
    .modal-tabs[b-epqsxqk75x] { overflow-x: auto; }
    .modal-tab[b-epqsxqk75x] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-epqsxqk75x] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-epqsxqk75x] { display: grid !important; }
    .crud-cards-wrapper[b-epqsxqk75x] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-epqsxqk75x] { grid-template-columns: 1fr; }
    .card-details[b-epqsxqk75x] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-epqsxqk75x] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-epqsxqk75x] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-epqsxqk75x] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-epqsxqk75x] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Graficos/Miclase_class1_frmyomismo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ajyjoynled] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ajyjoynled 0.3s ease-out; }
@keyframes slideUp-b-ajyjoynled { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ajyjoynled] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ajyjoynled] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ajyjoynled] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ajyjoynled] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ajyjoynled] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ajyjoynled] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ajyjoynled] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ajyjoynled] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ajyjoynled] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ajyjoynled] { filter: brightness(1.1); }
.btn-outline[b-ajyjoynled] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ajyjoynled] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ajyjoynled] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ajyjoynled] { filter: brightness(1.1); }
.btn-icon[b-ajyjoynled] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ajyjoynled] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ajyjoynled] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ajyjoynled] { color: #ef4444; }
.btn-delete:hover[b-ajyjoynled] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ajyjoynled] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ajyjoynled] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ajyjoynled] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ajyjoynled] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ajyjoynled] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ajyjoynled] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ajyjoynled] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ajyjoynled] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ajyjoynled] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ajyjoynled] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ajyjoynled] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ajyjoynled] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ajyjoynled] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ajyjoynled] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ajyjoynled] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ajyjoynled] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ajyjoynled] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ajyjoynled] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ajyjoynled] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ajyjoynled] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ajyjoynled] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ajyjoynled] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ajyjoynled] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ajyjoynled] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ajyjoynled] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ajyjoynled] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ajyjoynled] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ajyjoynled] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ajyjoynled] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ajyjoynled] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ajyjoynled] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ajyjoynled] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ajyjoynled] { display: block; }
.hide-on-cards[b-ajyjoynled] { display: none !important; }
.show-on-cards[b-ajyjoynled] { display: grid; }
.hide-on-grid[b-ajyjoynled] { display: none !important; }

/* Badges */
.badge[b-ajyjoynled] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ajyjoynled] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ajyjoynled] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ajyjoynled] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ajyjoynled] { text-align: center; }
.text-muted[b-ajyjoynled] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ajyjoynled], .crud-empty-state[b-ajyjoynled] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ajyjoynled] { font-size: 2rem; }
.crud-spinner[b-ajyjoynled] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ajyjoynled 0.6s linear infinite; }
.crud-spinner-sm[b-ajyjoynled] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ajyjoynled 0.6s linear infinite; }
@keyframes spin-b-ajyjoynled { to { transform: rotate(360deg); } }
.spin[b-ajyjoynled] { animation: spin-b-ajyjoynled 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ajyjoynled] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ajyjoynled 0.15s ease-out; }
.modal-container[b-ajyjoynled] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ajyjoynled] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ajyjoynled 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ajyjoynled] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ajyjoynled] { max-width: 420px; }
@keyframes fadeIn-b-ajyjoynled { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ajyjoynled { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ajyjoynled] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ajyjoynled] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ajyjoynled] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ajyjoynled] { color: #dc2626; }
.modal-close[b-ajyjoynled] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ajyjoynled] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ajyjoynled] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ajyjoynled] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ajyjoynled] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ajyjoynled] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ajyjoynled] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ajyjoynled] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ajyjoynled] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ajyjoynled] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ajyjoynled] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ajyjoynled] { flex: 2; }
.form-group label[b-ajyjoynled] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ajyjoynled], .form-group select[b-ajyjoynled], .form-textarea[b-ajyjoynled] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ajyjoynled], .form-group select:focus[b-ajyjoynled], .form-textarea:focus[b-ajyjoynled] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ajyjoynled] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ajyjoynled] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ajyjoynled] { flex: 1; display: flex; align-items: center; }
.form-check[b-ajyjoynled] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ajyjoynled] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ajyjoynled] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ajyjoynled] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ajyjoynled] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ajyjoynled] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ajyjoynled] { font-size: 3rem; }
.photo-placeholder span[b-ajyjoynled] { font-size: 0.78rem; }
.photo-actions[b-ajyjoynled] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ajyjoynled] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ajyjoynled] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ajyjoynled] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ajyjoynled] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ajyjoynled] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ajyjoynled] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ajyjoynled] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ajyjoynled] { filter: brightness(1.15); transform: scale(1.05); }
[b-ajyjoynled] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ajyjoynled] { padding: 0.75rem; }
    .crud-header[b-ajyjoynled] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ajyjoynled] { font-size: 1.1rem; }
    .btn-text[b-ajyjoynled] { display: none; }
    .form-row[b-ajyjoynled] { flex-direction: column; }
    .form-row-4[b-ajyjoynled] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ajyjoynled] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ajyjoynled] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ajyjoynled] { padding: 0.75rem; }
    .modal-tabs[b-ajyjoynled] { overflow-x: auto; }
    .modal-tab[b-ajyjoynled] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ajyjoynled] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ajyjoynled] { display: grid !important; }
    .crud-cards-wrapper[b-ajyjoynled] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ajyjoynled] { grid-template-columns: 1fr; }
    .card-details[b-ajyjoynled] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ajyjoynled] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ajyjoynled] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ajyjoynled] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ajyjoynled] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Crinmantiguedasaldov2_mrx.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ircgrx6xzb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ircgrx6xzb 0.3s ease-out; }
@keyframes slideUp-b-ircgrx6xzb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ircgrx6xzb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ircgrx6xzb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ircgrx6xzb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ircgrx6xzb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ircgrx6xzb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ircgrx6xzb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ircgrx6xzb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ircgrx6xzb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ircgrx6xzb] { filter: brightness(1.1); }
.btn-outline[b-ircgrx6xzb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ircgrx6xzb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ircgrx6xzb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ircgrx6xzb] { filter: brightness(1.1); }
.btn-icon[b-ircgrx6xzb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ircgrx6xzb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ircgrx6xzb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ircgrx6xzb] { color: #ef4444; }
.btn-delete:hover[b-ircgrx6xzb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ircgrx6xzb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ircgrx6xzb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ircgrx6xzb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ircgrx6xzb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ircgrx6xzb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ircgrx6xzb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ircgrx6xzb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ircgrx6xzb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ircgrx6xzb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ircgrx6xzb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ircgrx6xzb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ircgrx6xzb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ircgrx6xzb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ircgrx6xzb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ircgrx6xzb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ircgrx6xzb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ircgrx6xzb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ircgrx6xzb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ircgrx6xzb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ircgrx6xzb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ircgrx6xzb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ircgrx6xzb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ircgrx6xzb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ircgrx6xzb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ircgrx6xzb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ircgrx6xzb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ircgrx6xzb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ircgrx6xzb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ircgrx6xzb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ircgrx6xzb] { display: block; }
.hide-on-cards[b-ircgrx6xzb] { display: none !important; }
.show-on-cards[b-ircgrx6xzb] { display: grid; }
.hide-on-grid[b-ircgrx6xzb] { display: none !important; }

/* Badges */
.badge[b-ircgrx6xzb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ircgrx6xzb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ircgrx6xzb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ircgrx6xzb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ircgrx6xzb] { text-align: center; }
.text-muted[b-ircgrx6xzb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ircgrx6xzb], .crud-empty-state[b-ircgrx6xzb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ircgrx6xzb] { font-size: 2rem; }
.crud-spinner[b-ircgrx6xzb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ircgrx6xzb 0.6s linear infinite; }
.crud-spinner-sm[b-ircgrx6xzb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ircgrx6xzb 0.6s linear infinite; }
@keyframes spin-b-ircgrx6xzb { to { transform: rotate(360deg); } }
.spin[b-ircgrx6xzb] { animation: spin-b-ircgrx6xzb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ircgrx6xzb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ircgrx6xzb 0.15s ease-out; }
.modal-container[b-ircgrx6xzb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ircgrx6xzb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ircgrx6xzb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ircgrx6xzb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ircgrx6xzb] { max-width: 420px; }
@keyframes fadeIn-b-ircgrx6xzb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ircgrx6xzb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ircgrx6xzb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ircgrx6xzb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ircgrx6xzb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ircgrx6xzb] { color: #dc2626; }
.modal-close[b-ircgrx6xzb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ircgrx6xzb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ircgrx6xzb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ircgrx6xzb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ircgrx6xzb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ircgrx6xzb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ircgrx6xzb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ircgrx6xzb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ircgrx6xzb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ircgrx6xzb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ircgrx6xzb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ircgrx6xzb] { flex: 2; }
.form-group label[b-ircgrx6xzb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ircgrx6xzb], .form-group select[b-ircgrx6xzb], .form-textarea[b-ircgrx6xzb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ircgrx6xzb], .form-group select:focus[b-ircgrx6xzb], .form-textarea:focus[b-ircgrx6xzb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ircgrx6xzb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ircgrx6xzb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ircgrx6xzb] { flex: 1; display: flex; align-items: center; }
.form-check[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ircgrx6xzb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ircgrx6xzb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ircgrx6xzb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ircgrx6xzb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ircgrx6xzb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ircgrx6xzb] { font-size: 3rem; }
.photo-placeholder span[b-ircgrx6xzb] { font-size: 0.78rem; }
.photo-actions[b-ircgrx6xzb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ircgrx6xzb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ircgrx6xzb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ircgrx6xzb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ircgrx6xzb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ircgrx6xzb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ircgrx6xzb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ircgrx6xzb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ircgrx6xzb] { filter: brightness(1.15); transform: scale(1.05); }
[b-ircgrx6xzb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ircgrx6xzb] { padding: 0.75rem; }
    .crud-header[b-ircgrx6xzb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ircgrx6xzb] { font-size: 1.1rem; }
    .btn-text[b-ircgrx6xzb] { display: none; }
    .form-row[b-ircgrx6xzb] { flex-direction: column; }
    .form-row-4[b-ircgrx6xzb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ircgrx6xzb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ircgrx6xzb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ircgrx6xzb] { padding: 0.75rem; }
    .modal-tabs[b-ircgrx6xzb] { overflow-x: auto; }
    .modal-tab[b-ircgrx6xzb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ircgrx6xzb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ircgrx6xzb] { display: grid !important; }
    .crud-cards-wrapper[b-ircgrx6xzb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ircgrx6xzb] { grid-template-columns: 1fr; }
    .card-details[b-ircgrx6xzb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ircgrx6xzb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ircgrx6xzb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ircgrx6xzb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ircgrx6xzb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Crinm_listadoinmobiliariav2_mrt.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2dyz3toiuc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2dyz3toiuc 0.3s ease-out; }
@keyframes slideUp-b-2dyz3toiuc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2dyz3toiuc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2dyz3toiuc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2dyz3toiuc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2dyz3toiuc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2dyz3toiuc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2dyz3toiuc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2dyz3toiuc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2dyz3toiuc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2dyz3toiuc] { filter: brightness(1.1); }
.btn-outline[b-2dyz3toiuc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2dyz3toiuc] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2dyz3toiuc] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2dyz3toiuc] { filter: brightness(1.1); }
.btn-icon[b-2dyz3toiuc] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2dyz3toiuc] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2dyz3toiuc] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2dyz3toiuc] { color: #ef4444; }
.btn-delete:hover[b-2dyz3toiuc] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2dyz3toiuc] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2dyz3toiuc] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2dyz3toiuc] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2dyz3toiuc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2dyz3toiuc] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2dyz3toiuc] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2dyz3toiuc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2dyz3toiuc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2dyz3toiuc] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2dyz3toiuc] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2dyz3toiuc] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2dyz3toiuc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2dyz3toiuc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2dyz3toiuc] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2dyz3toiuc] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2dyz3toiuc] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2dyz3toiuc] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2dyz3toiuc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2dyz3toiuc] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2dyz3toiuc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2dyz3toiuc] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2dyz3toiuc] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2dyz3toiuc] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2dyz3toiuc] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2dyz3toiuc] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2dyz3toiuc] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2dyz3toiuc] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2dyz3toiuc] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2dyz3toiuc] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2dyz3toiuc] { display: block; }
.hide-on-cards[b-2dyz3toiuc] { display: none !important; }
.show-on-cards[b-2dyz3toiuc] { display: grid; }
.hide-on-grid[b-2dyz3toiuc] { display: none !important; }

/* Badges */
.badge[b-2dyz3toiuc] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2dyz3toiuc] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2dyz3toiuc] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2dyz3toiuc] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2dyz3toiuc] { text-align: center; }
.text-muted[b-2dyz3toiuc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2dyz3toiuc], .crud-empty-state[b-2dyz3toiuc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2dyz3toiuc] { font-size: 2rem; }
.crud-spinner[b-2dyz3toiuc] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2dyz3toiuc 0.6s linear infinite; }
.crud-spinner-sm[b-2dyz3toiuc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2dyz3toiuc 0.6s linear infinite; }
@keyframes spin-b-2dyz3toiuc { to { transform: rotate(360deg); } }
.spin[b-2dyz3toiuc] { animation: spin-b-2dyz3toiuc 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2dyz3toiuc] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2dyz3toiuc 0.15s ease-out; }
.modal-container[b-2dyz3toiuc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2dyz3toiuc] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2dyz3toiuc 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2dyz3toiuc] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2dyz3toiuc] { max-width: 420px; }
@keyframes fadeIn-b-2dyz3toiuc { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2dyz3toiuc { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2dyz3toiuc] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2dyz3toiuc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2dyz3toiuc] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2dyz3toiuc] { color: #dc2626; }
.modal-close[b-2dyz3toiuc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2dyz3toiuc] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2dyz3toiuc] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2dyz3toiuc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2dyz3toiuc] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2dyz3toiuc] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2dyz3toiuc] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2dyz3toiuc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2dyz3toiuc] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2dyz3toiuc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2dyz3toiuc] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2dyz3toiuc] { flex: 2; }
.form-group label[b-2dyz3toiuc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2dyz3toiuc], .form-group select[b-2dyz3toiuc], .form-textarea[b-2dyz3toiuc] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2dyz3toiuc], .form-group select:focus[b-2dyz3toiuc], .form-textarea:focus[b-2dyz3toiuc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2dyz3toiuc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2dyz3toiuc] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2dyz3toiuc] { flex: 1; display: flex; align-items: center; }
.form-check[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2dyz3toiuc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2dyz3toiuc] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2dyz3toiuc] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2dyz3toiuc] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2dyz3toiuc] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2dyz3toiuc] { font-size: 3rem; }
.photo-placeholder span[b-2dyz3toiuc] { font-size: 0.78rem; }
.photo-actions[b-2dyz3toiuc] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2dyz3toiuc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2dyz3toiuc] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2dyz3toiuc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2dyz3toiuc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2dyz3toiuc] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2dyz3toiuc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2dyz3toiuc] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2dyz3toiuc] { filter: brightness(1.15); transform: scale(1.05); }
[b-2dyz3toiuc] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2dyz3toiuc] { padding: 0.75rem; }
    .crud-header[b-2dyz3toiuc] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2dyz3toiuc] { font-size: 1.1rem; }
    .btn-text[b-2dyz3toiuc] { display: none; }
    .form-row[b-2dyz3toiuc] { flex-direction: column; }
    .form-row-4[b-2dyz3toiuc] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2dyz3toiuc] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2dyz3toiuc] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2dyz3toiuc] { padding: 0.75rem; }
    .modal-tabs[b-2dyz3toiuc] { overflow-x: auto; }
    .modal-tab[b-2dyz3toiuc] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2dyz3toiuc] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2dyz3toiuc] { display: grid !important; }
    .crud-cards-wrapper[b-2dyz3toiuc] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2dyz3toiuc] { grid-template-columns: 1fr; }
    .card-details[b-2dyz3toiuc] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2dyz3toiuc] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2dyz3toiuc] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2dyz3toiuc] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2dyz3toiuc] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmcobrorealizadosinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kjpwzg3w6g] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kjpwzg3w6g 0.3s ease-out; }
@keyframes slideUp-b-kjpwzg3w6g { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kjpwzg3w6g] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kjpwzg3w6g] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kjpwzg3w6g] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kjpwzg3w6g] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kjpwzg3w6g] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kjpwzg3w6g] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kjpwzg3w6g] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kjpwzg3w6g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kjpwzg3w6g] { filter: brightness(1.1); }
.btn-outline[b-kjpwzg3w6g] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kjpwzg3w6g] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kjpwzg3w6g] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kjpwzg3w6g] { filter: brightness(1.1); }
.btn-icon[b-kjpwzg3w6g] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kjpwzg3w6g] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kjpwzg3w6g] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kjpwzg3w6g] { color: #ef4444; }
.btn-delete:hover[b-kjpwzg3w6g] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kjpwzg3w6g] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kjpwzg3w6g] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kjpwzg3w6g] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kjpwzg3w6g] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kjpwzg3w6g] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kjpwzg3w6g] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kjpwzg3w6g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kjpwzg3w6g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kjpwzg3w6g] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kjpwzg3w6g] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kjpwzg3w6g] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kjpwzg3w6g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kjpwzg3w6g] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kjpwzg3w6g] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kjpwzg3w6g] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kjpwzg3w6g] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kjpwzg3w6g] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kjpwzg3w6g] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kjpwzg3w6g] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kjpwzg3w6g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kjpwzg3w6g] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kjpwzg3w6g] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kjpwzg3w6g] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kjpwzg3w6g] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kjpwzg3w6g] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kjpwzg3w6g] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kjpwzg3w6g] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kjpwzg3w6g] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kjpwzg3w6g] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kjpwzg3w6g] { display: block; }
.hide-on-cards[b-kjpwzg3w6g] { display: none !important; }
.show-on-cards[b-kjpwzg3w6g] { display: grid; }
.hide-on-grid[b-kjpwzg3w6g] { display: none !important; }

/* Badges */
.badge[b-kjpwzg3w6g] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kjpwzg3w6g] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kjpwzg3w6g] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kjpwzg3w6g] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kjpwzg3w6g] { text-align: center; }
.text-muted[b-kjpwzg3w6g] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kjpwzg3w6g], .crud-empty-state[b-kjpwzg3w6g] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kjpwzg3w6g] { font-size: 2rem; }
.crud-spinner[b-kjpwzg3w6g] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kjpwzg3w6g 0.6s linear infinite; }
.crud-spinner-sm[b-kjpwzg3w6g] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kjpwzg3w6g 0.6s linear infinite; }
@keyframes spin-b-kjpwzg3w6g { to { transform: rotate(360deg); } }
.spin[b-kjpwzg3w6g] { animation: spin-b-kjpwzg3w6g 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kjpwzg3w6g] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kjpwzg3w6g 0.15s ease-out; }
.modal-container[b-kjpwzg3w6g] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kjpwzg3w6g] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kjpwzg3w6g 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kjpwzg3w6g] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kjpwzg3w6g] { max-width: 420px; }
@keyframes fadeIn-b-kjpwzg3w6g { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kjpwzg3w6g { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kjpwzg3w6g] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kjpwzg3w6g] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kjpwzg3w6g] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kjpwzg3w6g] { color: #dc2626; }
.modal-close[b-kjpwzg3w6g] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kjpwzg3w6g] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kjpwzg3w6g] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kjpwzg3w6g] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kjpwzg3w6g] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kjpwzg3w6g] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kjpwzg3w6g] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kjpwzg3w6g] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kjpwzg3w6g] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kjpwzg3w6g] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kjpwzg3w6g] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kjpwzg3w6g] { flex: 2; }
.form-group label[b-kjpwzg3w6g] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kjpwzg3w6g], .form-group select[b-kjpwzg3w6g], .form-textarea[b-kjpwzg3w6g] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kjpwzg3w6g], .form-group select:focus[b-kjpwzg3w6g], .form-textarea:focus[b-kjpwzg3w6g] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kjpwzg3w6g] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kjpwzg3w6g] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kjpwzg3w6g] { flex: 1; display: flex; align-items: center; }
.form-check[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kjpwzg3w6g] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kjpwzg3w6g] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kjpwzg3w6g] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kjpwzg3w6g] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kjpwzg3w6g] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kjpwzg3w6g] { font-size: 3rem; }
.photo-placeholder span[b-kjpwzg3w6g] { font-size: 0.78rem; }
.photo-actions[b-kjpwzg3w6g] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kjpwzg3w6g] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kjpwzg3w6g] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kjpwzg3w6g] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kjpwzg3w6g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kjpwzg3w6g] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kjpwzg3w6g] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kjpwzg3w6g] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kjpwzg3w6g] { filter: brightness(1.15); transform: scale(1.05); }
[b-kjpwzg3w6g] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kjpwzg3w6g] { padding: 0.75rem; }
    .crud-header[b-kjpwzg3w6g] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kjpwzg3w6g] { font-size: 1.1rem; }
    .btn-text[b-kjpwzg3w6g] { display: none; }
    .form-row[b-kjpwzg3w6g] { flex-direction: column; }
    .form-row-4[b-kjpwzg3w6g] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kjpwzg3w6g] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kjpwzg3w6g] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kjpwzg3w6g] { padding: 0.75rem; }
    .modal-tabs[b-kjpwzg3w6g] { overflow-x: auto; }
    .modal-tab[b-kjpwzg3w6g] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kjpwzg3w6g] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kjpwzg3w6g] { display: grid !important; }
    .crud-cards-wrapper[b-kjpwzg3w6g] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kjpwzg3w6g] { grid-template-columns: 1fr; }
    .card-details[b-kjpwzg3w6g] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kjpwzg3w6g] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kjpwzg3w6g] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kjpwzg3w6g] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kjpwzg3w6g] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmcobrosinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7gcduof65x] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7gcduof65x 0.3s ease-out; }
@keyframes slideUp-b-7gcduof65x { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7gcduof65x] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7gcduof65x] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7gcduof65x] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7gcduof65x] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7gcduof65x] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7gcduof65x] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7gcduof65x] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7gcduof65x] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7gcduof65x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7gcduof65x] { filter: brightness(1.1); }
.btn-outline[b-7gcduof65x] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7gcduof65x] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7gcduof65x] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7gcduof65x] { filter: brightness(1.1); }
.btn-icon[b-7gcduof65x] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7gcduof65x] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7gcduof65x] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7gcduof65x] { color: #ef4444; }
.btn-delete:hover[b-7gcduof65x] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7gcduof65x] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7gcduof65x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7gcduof65x] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7gcduof65x] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7gcduof65x] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7gcduof65x] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7gcduof65x] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7gcduof65x] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7gcduof65x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7gcduof65x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7gcduof65x] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7gcduof65x] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7gcduof65x] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7gcduof65x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7gcduof65x] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7gcduof65x] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7gcduof65x] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7gcduof65x] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7gcduof65x] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7gcduof65x] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7gcduof65x] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7gcduof65x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7gcduof65x] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7gcduof65x] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7gcduof65x] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7gcduof65x] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7gcduof65x] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7gcduof65x] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7gcduof65x] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7gcduof65x] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7gcduof65x] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7gcduof65x] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7gcduof65x] { display: block; }
.hide-on-cards[b-7gcduof65x] { display: none !important; }
.show-on-cards[b-7gcduof65x] { display: grid; }
.hide-on-grid[b-7gcduof65x] { display: none !important; }

/* Badges */
.badge[b-7gcduof65x] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7gcduof65x] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7gcduof65x] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7gcduof65x] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7gcduof65x] { text-align: center; }
.text-muted[b-7gcduof65x] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7gcduof65x], .crud-empty-state[b-7gcduof65x] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7gcduof65x] { font-size: 2rem; }
.crud-spinner[b-7gcduof65x] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7gcduof65x 0.6s linear infinite; }
.crud-spinner-sm[b-7gcduof65x] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7gcduof65x 0.6s linear infinite; }
@keyframes spin-b-7gcduof65x { to { transform: rotate(360deg); } }
.spin[b-7gcduof65x] { animation: spin-b-7gcduof65x 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7gcduof65x] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7gcduof65x 0.15s ease-out; }
.modal-container[b-7gcduof65x] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7gcduof65x] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7gcduof65x 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7gcduof65x] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7gcduof65x] { max-width: 420px; }
@keyframes fadeIn-b-7gcduof65x { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7gcduof65x { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7gcduof65x] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7gcduof65x] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7gcduof65x] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7gcduof65x] { color: #dc2626; }
.modal-close[b-7gcduof65x] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7gcduof65x] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7gcduof65x] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7gcduof65x] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7gcduof65x] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7gcduof65x] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7gcduof65x] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7gcduof65x] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7gcduof65x] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7gcduof65x] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7gcduof65x] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7gcduof65x] { flex: 2; }
.form-group label[b-7gcduof65x] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7gcduof65x], .form-group select[b-7gcduof65x], .form-textarea[b-7gcduof65x] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7gcduof65x], .form-group select:focus[b-7gcduof65x], .form-textarea:focus[b-7gcduof65x] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7gcduof65x] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7gcduof65x] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7gcduof65x] { flex: 1; display: flex; align-items: center; }
.form-check[b-7gcduof65x] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7gcduof65x] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7gcduof65x] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7gcduof65x] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7gcduof65x] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7gcduof65x] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7gcduof65x] { font-size: 3rem; }
.photo-placeholder span[b-7gcduof65x] { font-size: 0.78rem; }
.photo-actions[b-7gcduof65x] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7gcduof65x] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7gcduof65x] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7gcduof65x] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7gcduof65x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7gcduof65x] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7gcduof65x] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7gcduof65x] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7gcduof65x] { filter: brightness(1.15); transform: scale(1.05); }
[b-7gcduof65x] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7gcduof65x] { padding: 0.75rem; }
    .crud-header[b-7gcduof65x] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7gcduof65x] { font-size: 1.1rem; }
    .btn-text[b-7gcduof65x] { display: none; }
    .form-row[b-7gcduof65x] { flex-direction: column; }
    .form-row-4[b-7gcduof65x] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7gcduof65x] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7gcduof65x] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7gcduof65x] { padding: 0.75rem; }
    .modal-tabs[b-7gcduof65x] { overflow-x: auto; }
    .modal-tab[b-7gcduof65x] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7gcduof65x] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7gcduof65x] { display: grid !important; }
    .crud-cards-wrapper[b-7gcduof65x] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7gcduof65x] { grid-template-columns: 1fr; }
    .card-details[b-7gcduof65x] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7gcduof65x] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7gcduof65x] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7gcduof65x] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7gcduof65x] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmcreacargosinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6g2ym6wm9e] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6g2ym6wm9e 0.3s ease-out; }
@keyframes slideUp-b-6g2ym6wm9e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6g2ym6wm9e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6g2ym6wm9e] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6g2ym6wm9e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6g2ym6wm9e] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6g2ym6wm9e] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6g2ym6wm9e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6g2ym6wm9e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6g2ym6wm9e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6g2ym6wm9e] { filter: brightness(1.1); }
.btn-outline[b-6g2ym6wm9e] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6g2ym6wm9e] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6g2ym6wm9e] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6g2ym6wm9e] { filter: brightness(1.1); }
.btn-icon[b-6g2ym6wm9e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6g2ym6wm9e] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6g2ym6wm9e] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6g2ym6wm9e] { color: #ef4444; }
.btn-delete:hover[b-6g2ym6wm9e] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6g2ym6wm9e] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6g2ym6wm9e] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6g2ym6wm9e] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6g2ym6wm9e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6g2ym6wm9e] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6g2ym6wm9e] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6g2ym6wm9e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6g2ym6wm9e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6g2ym6wm9e] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6g2ym6wm9e] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6g2ym6wm9e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6g2ym6wm9e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6g2ym6wm9e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6g2ym6wm9e] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6g2ym6wm9e] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6g2ym6wm9e] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6g2ym6wm9e] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6g2ym6wm9e] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6g2ym6wm9e] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6g2ym6wm9e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6g2ym6wm9e] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6g2ym6wm9e] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6g2ym6wm9e] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6g2ym6wm9e] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6g2ym6wm9e] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6g2ym6wm9e] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6g2ym6wm9e] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6g2ym6wm9e] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6g2ym6wm9e] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6g2ym6wm9e] { display: block; }
.hide-on-cards[b-6g2ym6wm9e] { display: none !important; }
.show-on-cards[b-6g2ym6wm9e] { display: grid; }
.hide-on-grid[b-6g2ym6wm9e] { display: none !important; }

/* Badges */
.badge[b-6g2ym6wm9e] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6g2ym6wm9e] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6g2ym6wm9e] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6g2ym6wm9e] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6g2ym6wm9e] { text-align: center; }
.text-muted[b-6g2ym6wm9e] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6g2ym6wm9e], .crud-empty-state[b-6g2ym6wm9e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6g2ym6wm9e] { font-size: 2rem; }
.crud-spinner[b-6g2ym6wm9e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6g2ym6wm9e 0.6s linear infinite; }
.crud-spinner-sm[b-6g2ym6wm9e] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6g2ym6wm9e 0.6s linear infinite; }
@keyframes spin-b-6g2ym6wm9e { to { transform: rotate(360deg); } }
.spin[b-6g2ym6wm9e] { animation: spin-b-6g2ym6wm9e 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6g2ym6wm9e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6g2ym6wm9e 0.15s ease-out; }
.modal-container[b-6g2ym6wm9e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6g2ym6wm9e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6g2ym6wm9e 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6g2ym6wm9e] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6g2ym6wm9e] { max-width: 420px; }
@keyframes fadeIn-b-6g2ym6wm9e { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6g2ym6wm9e { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6g2ym6wm9e] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6g2ym6wm9e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6g2ym6wm9e] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6g2ym6wm9e] { color: #dc2626; }
.modal-close[b-6g2ym6wm9e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6g2ym6wm9e] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6g2ym6wm9e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6g2ym6wm9e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6g2ym6wm9e] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6g2ym6wm9e] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6g2ym6wm9e] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6g2ym6wm9e] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6g2ym6wm9e] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6g2ym6wm9e] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6g2ym6wm9e] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6g2ym6wm9e] { flex: 2; }
.form-group label[b-6g2ym6wm9e] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6g2ym6wm9e], .form-group select[b-6g2ym6wm9e], .form-textarea[b-6g2ym6wm9e] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6g2ym6wm9e], .form-group select:focus[b-6g2ym6wm9e], .form-textarea:focus[b-6g2ym6wm9e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6g2ym6wm9e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6g2ym6wm9e] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6g2ym6wm9e] { flex: 1; display: flex; align-items: center; }
.form-check[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6g2ym6wm9e] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6g2ym6wm9e] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6g2ym6wm9e] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6g2ym6wm9e] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6g2ym6wm9e] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6g2ym6wm9e] { font-size: 3rem; }
.photo-placeholder span[b-6g2ym6wm9e] { font-size: 0.78rem; }
.photo-actions[b-6g2ym6wm9e] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6g2ym6wm9e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6g2ym6wm9e] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6g2ym6wm9e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6g2ym6wm9e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6g2ym6wm9e] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6g2ym6wm9e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6g2ym6wm9e] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6g2ym6wm9e] { filter: brightness(1.15); transform: scale(1.05); }
[b-6g2ym6wm9e] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6g2ym6wm9e] { padding: 0.75rem; }
    .crud-header[b-6g2ym6wm9e] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6g2ym6wm9e] { font-size: 1.1rem; }
    .btn-text[b-6g2ym6wm9e] { display: none; }
    .form-row[b-6g2ym6wm9e] { flex-direction: column; }
    .form-row-4[b-6g2ym6wm9e] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6g2ym6wm9e] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6g2ym6wm9e] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6g2ym6wm9e] { padding: 0.75rem; }
    .modal-tabs[b-6g2ym6wm9e] { overflow-x: auto; }
    .modal-tab[b-6g2ym6wm9e] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6g2ym6wm9e] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6g2ym6wm9e] { display: grid !important; }
    .crud-cards-wrapper[b-6g2ym6wm9e] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6g2ym6wm9e] { grid-template-columns: 1fr; }
    .card-details[b-6g2ym6wm9e] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6g2ym6wm9e] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6g2ym6wm9e] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6g2ym6wm9e] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6g2ym6wm9e] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmcutasvencidasypendientesinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-c4uy2j16oy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c4uy2j16oy 0.3s ease-out; }
@keyframes slideUp-b-c4uy2j16oy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-c4uy2j16oy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c4uy2j16oy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c4uy2j16oy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c4uy2j16oy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c4uy2j16oy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-c4uy2j16oy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c4uy2j16oy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c4uy2j16oy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c4uy2j16oy] { filter: brightness(1.1); }
.btn-outline[b-c4uy2j16oy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c4uy2j16oy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-c4uy2j16oy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-c4uy2j16oy] { filter: brightness(1.1); }
.btn-icon[b-c4uy2j16oy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-c4uy2j16oy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-c4uy2j16oy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-c4uy2j16oy] { color: #ef4444; }
.btn-delete:hover[b-c4uy2j16oy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-c4uy2j16oy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c4uy2j16oy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-c4uy2j16oy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-c4uy2j16oy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-c4uy2j16oy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-c4uy2j16oy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-c4uy2j16oy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-c4uy2j16oy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-c4uy2j16oy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-c4uy2j16oy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c4uy2j16oy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c4uy2j16oy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-c4uy2j16oy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c4uy2j16oy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-c4uy2j16oy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-c4uy2j16oy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-c4uy2j16oy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-c4uy2j16oy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-c4uy2j16oy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-c4uy2j16oy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-c4uy2j16oy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-c4uy2j16oy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-c4uy2j16oy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-c4uy2j16oy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-c4uy2j16oy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-c4uy2j16oy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-c4uy2j16oy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-c4uy2j16oy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-c4uy2j16oy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-c4uy2j16oy] { display: block; }
.hide-on-cards[b-c4uy2j16oy] { display: none !important; }
.show-on-cards[b-c4uy2j16oy] { display: grid; }
.hide-on-grid[b-c4uy2j16oy] { display: none !important; }

/* Badges */
.badge[b-c4uy2j16oy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-c4uy2j16oy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-c4uy2j16oy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-c4uy2j16oy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-c4uy2j16oy] { text-align: center; }
.text-muted[b-c4uy2j16oy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-c4uy2j16oy], .crud-empty-state[b-c4uy2j16oy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c4uy2j16oy] { font-size: 2rem; }
.crud-spinner[b-c4uy2j16oy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-c4uy2j16oy 0.6s linear infinite; }
.crud-spinner-sm[b-c4uy2j16oy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-c4uy2j16oy 0.6s linear infinite; }
@keyframes spin-b-c4uy2j16oy { to { transform: rotate(360deg); } }
.spin[b-c4uy2j16oy] { animation: spin-b-c4uy2j16oy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-c4uy2j16oy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-c4uy2j16oy 0.15s ease-out; }
.modal-container[b-c4uy2j16oy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-c4uy2j16oy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-c4uy2j16oy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-c4uy2j16oy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-c4uy2j16oy] { max-width: 420px; }
@keyframes fadeIn-b-c4uy2j16oy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-c4uy2j16oy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-c4uy2j16oy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-c4uy2j16oy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-c4uy2j16oy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-c4uy2j16oy] { color: #dc2626; }
.modal-close[b-c4uy2j16oy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-c4uy2j16oy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-c4uy2j16oy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-c4uy2j16oy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-c4uy2j16oy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-c4uy2j16oy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-c4uy2j16oy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-c4uy2j16oy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-c4uy2j16oy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-c4uy2j16oy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-c4uy2j16oy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-c4uy2j16oy] { flex: 2; }
.form-group label[b-c4uy2j16oy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-c4uy2j16oy], .form-group select[b-c4uy2j16oy], .form-textarea[b-c4uy2j16oy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-c4uy2j16oy], .form-group select:focus[b-c4uy2j16oy], .form-textarea:focus[b-c4uy2j16oy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-c4uy2j16oy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-c4uy2j16oy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-c4uy2j16oy] { flex: 1; display: flex; align-items: center; }
.form-check[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-c4uy2j16oy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-c4uy2j16oy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-c4uy2j16oy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-c4uy2j16oy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-c4uy2j16oy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-c4uy2j16oy] { font-size: 3rem; }
.photo-placeholder span[b-c4uy2j16oy] { font-size: 0.78rem; }
.photo-actions[b-c4uy2j16oy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-c4uy2j16oy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-c4uy2j16oy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-c4uy2j16oy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-c4uy2j16oy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-c4uy2j16oy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-c4uy2j16oy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-c4uy2j16oy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-c4uy2j16oy] { filter: brightness(1.15); transform: scale(1.05); }
[b-c4uy2j16oy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-c4uy2j16oy] { padding: 0.75rem; }
    .crud-header[b-c4uy2j16oy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-c4uy2j16oy] { font-size: 1.1rem; }
    .btn-text[b-c4uy2j16oy] { display: none; }
    .form-row[b-c4uy2j16oy] { flex-direction: column; }
    .form-row-4[b-c4uy2j16oy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-c4uy2j16oy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-c4uy2j16oy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-c4uy2j16oy] { padding: 0.75rem; }
    .modal-tabs[b-c4uy2j16oy] { overflow-x: auto; }
    .modal-tab[b-c4uy2j16oy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-c4uy2j16oy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-c4uy2j16oy] { display: grid !important; }
    .crud-cards-wrapper[b-c4uy2j16oy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-c4uy2j16oy] { grid-template-columns: 1fr; }
    .card-details[b-c4uy2j16oy] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-c4uy2j16oy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-c4uy2j16oy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-c4uy2j16oy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-c4uy2j16oy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmestadocuentainmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-y475bpay9z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-y475bpay9z 0.3s ease-out; }
@keyframes slideUp-b-y475bpay9z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-y475bpay9z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-y475bpay9z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-y475bpay9z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-y475bpay9z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-y475bpay9z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-y475bpay9z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-y475bpay9z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-y475bpay9z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-y475bpay9z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-y475bpay9z] { filter: brightness(1.1); }
.btn-outline[b-y475bpay9z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-y475bpay9z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-y475bpay9z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-y475bpay9z] { filter: brightness(1.1); }
.btn-icon[b-y475bpay9z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-y475bpay9z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-y475bpay9z] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-y475bpay9z] { color: #ef4444; }
.btn-delete:hover[b-y475bpay9z] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-y475bpay9z] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-y475bpay9z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-y475bpay9z] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-y475bpay9z] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-y475bpay9z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-y475bpay9z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-y475bpay9z] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-y475bpay9z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-y475bpay9z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-y475bpay9z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-y475bpay9z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-y475bpay9z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-y475bpay9z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-y475bpay9z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-y475bpay9z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-y475bpay9z] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-y475bpay9z] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-y475bpay9z] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-y475bpay9z] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-y475bpay9z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-y475bpay9z] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-y475bpay9z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-y475bpay9z] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-y475bpay9z] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-y475bpay9z] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-y475bpay9z] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-y475bpay9z] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-y475bpay9z] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-y475bpay9z] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-y475bpay9z] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-y475bpay9z] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-y475bpay9z] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-y475bpay9z] { display: block; }
.hide-on-cards[b-y475bpay9z] { display: none !important; }
.show-on-cards[b-y475bpay9z] { display: grid; }
.hide-on-grid[b-y475bpay9z] { display: none !important; }

/* Badges */
.badge[b-y475bpay9z] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-y475bpay9z] { background: #ecfdf5; color: #065f46; }
.badge-no[b-y475bpay9z] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-y475bpay9z] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-y475bpay9z] { text-align: center; }
.text-muted[b-y475bpay9z] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-y475bpay9z], .crud-empty-state[b-y475bpay9z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-y475bpay9z] { font-size: 2rem; }
.crud-spinner[b-y475bpay9z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-y475bpay9z 0.6s linear infinite; }
.crud-spinner-sm[b-y475bpay9z] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-y475bpay9z 0.6s linear infinite; }
@keyframes spin-b-y475bpay9z { to { transform: rotate(360deg); } }
.spin[b-y475bpay9z] { animation: spin-b-y475bpay9z 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-y475bpay9z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-y475bpay9z 0.15s ease-out; }
.modal-container[b-y475bpay9z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-y475bpay9z] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-y475bpay9z 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-y475bpay9z] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-y475bpay9z] { max-width: 420px; }
@keyframes fadeIn-b-y475bpay9z { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-y475bpay9z { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-y475bpay9z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-y475bpay9z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-y475bpay9z] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-y475bpay9z] { color: #dc2626; }
.modal-close[b-y475bpay9z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-y475bpay9z] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-y475bpay9z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-y475bpay9z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-y475bpay9z] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-y475bpay9z] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-y475bpay9z] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-y475bpay9z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-y475bpay9z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-y475bpay9z] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-y475bpay9z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-y475bpay9z] { flex: 2; }
.form-group label[b-y475bpay9z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-y475bpay9z], .form-group select[b-y475bpay9z], .form-textarea[b-y475bpay9z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-y475bpay9z], .form-group select:focus[b-y475bpay9z], .form-textarea:focus[b-y475bpay9z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-y475bpay9z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-y475bpay9z] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-y475bpay9z] { flex: 1; display: flex; align-items: center; }
.form-check[b-y475bpay9z] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-y475bpay9z] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-y475bpay9z] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-y475bpay9z] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-y475bpay9z] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-y475bpay9z] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-y475bpay9z] { font-size: 3rem; }
.photo-placeholder span[b-y475bpay9z] { font-size: 0.78rem; }
.photo-actions[b-y475bpay9z] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-y475bpay9z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-y475bpay9z] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-y475bpay9z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-y475bpay9z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-y475bpay9z] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-y475bpay9z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-y475bpay9z] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-y475bpay9z] { filter: brightness(1.15); transform: scale(1.05); }
[b-y475bpay9z] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-y475bpay9z] { padding: 0.75rem; }
    .crud-header[b-y475bpay9z] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-y475bpay9z] { font-size: 1.1rem; }
    .btn-text[b-y475bpay9z] { display: none; }
    .form-row[b-y475bpay9z] { flex-direction: column; }
    .form-row-4[b-y475bpay9z] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-y475bpay9z] { width: 98%; max-height: 95vh; }
    .modal-lg[b-y475bpay9z] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-y475bpay9z] { padding: 0.75rem; }
    .modal-tabs[b-y475bpay9z] { overflow-x: auto; }
    .modal-tab[b-y475bpay9z] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-y475bpay9z] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-y475bpay9z] { display: grid !important; }
    .crud-cards-wrapper[b-y475bpay9z] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-y475bpay9z] { grid-template-columns: 1fr; }
    .card-details[b-y475bpay9z] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-y475bpay9z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-y475bpay9z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-y475bpay9z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-y475bpay9z] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frminm_edificioproyectos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6iqgtyv4a6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6iqgtyv4a6 0.3s ease-out; }
@keyframes slideUp-b-6iqgtyv4a6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6iqgtyv4a6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6iqgtyv4a6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6iqgtyv4a6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6iqgtyv4a6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6iqgtyv4a6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6iqgtyv4a6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6iqgtyv4a6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6iqgtyv4a6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6iqgtyv4a6] { filter: brightness(1.1); }
.btn-outline[b-6iqgtyv4a6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6iqgtyv4a6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6iqgtyv4a6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6iqgtyv4a6] { filter: brightness(1.1); }
.btn-icon[b-6iqgtyv4a6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6iqgtyv4a6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6iqgtyv4a6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6iqgtyv4a6] { color: #ef4444; }
.btn-delete:hover[b-6iqgtyv4a6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6iqgtyv4a6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6iqgtyv4a6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6iqgtyv4a6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6iqgtyv4a6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6iqgtyv4a6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6iqgtyv4a6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6iqgtyv4a6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6iqgtyv4a6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6iqgtyv4a6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6iqgtyv4a6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6iqgtyv4a6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6iqgtyv4a6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6iqgtyv4a6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6iqgtyv4a6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6iqgtyv4a6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6iqgtyv4a6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6iqgtyv4a6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6iqgtyv4a6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6iqgtyv4a6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6iqgtyv4a6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6iqgtyv4a6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6iqgtyv4a6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6iqgtyv4a6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6iqgtyv4a6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6iqgtyv4a6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6iqgtyv4a6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6iqgtyv4a6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6iqgtyv4a6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6iqgtyv4a6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6iqgtyv4a6] { display: block; }
.hide-on-cards[b-6iqgtyv4a6] { display: none !important; }
.show-on-cards[b-6iqgtyv4a6] { display: grid; }
.hide-on-grid[b-6iqgtyv4a6] { display: none !important; }

/* Badges */
.badge[b-6iqgtyv4a6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6iqgtyv4a6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6iqgtyv4a6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6iqgtyv4a6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6iqgtyv4a6] { text-align: center; }
.text-muted[b-6iqgtyv4a6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6iqgtyv4a6], .crud-empty-state[b-6iqgtyv4a6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6iqgtyv4a6] { font-size: 2rem; }
.crud-spinner[b-6iqgtyv4a6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6iqgtyv4a6 0.6s linear infinite; }
.crud-spinner-sm[b-6iqgtyv4a6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6iqgtyv4a6 0.6s linear infinite; }
@keyframes spin-b-6iqgtyv4a6 { to { transform: rotate(360deg); } }
.spin[b-6iqgtyv4a6] { animation: spin-b-6iqgtyv4a6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6iqgtyv4a6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6iqgtyv4a6 0.15s ease-out; }
.modal-container[b-6iqgtyv4a6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6iqgtyv4a6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6iqgtyv4a6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6iqgtyv4a6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6iqgtyv4a6] { max-width: 420px; }
@keyframes fadeIn-b-6iqgtyv4a6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6iqgtyv4a6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6iqgtyv4a6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6iqgtyv4a6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6iqgtyv4a6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6iqgtyv4a6] { color: #dc2626; }
.modal-close[b-6iqgtyv4a6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6iqgtyv4a6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6iqgtyv4a6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6iqgtyv4a6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6iqgtyv4a6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6iqgtyv4a6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6iqgtyv4a6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6iqgtyv4a6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6iqgtyv4a6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6iqgtyv4a6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6iqgtyv4a6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6iqgtyv4a6] { flex: 2; }
.form-group label[b-6iqgtyv4a6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6iqgtyv4a6], .form-group select[b-6iqgtyv4a6], .form-textarea[b-6iqgtyv4a6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6iqgtyv4a6], .form-group select:focus[b-6iqgtyv4a6], .form-textarea:focus[b-6iqgtyv4a6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6iqgtyv4a6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6iqgtyv4a6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6iqgtyv4a6] { flex: 1; display: flex; align-items: center; }
.form-check[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6iqgtyv4a6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6iqgtyv4a6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6iqgtyv4a6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6iqgtyv4a6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6iqgtyv4a6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6iqgtyv4a6] { font-size: 3rem; }
.photo-placeholder span[b-6iqgtyv4a6] { font-size: 0.78rem; }
.photo-actions[b-6iqgtyv4a6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6iqgtyv4a6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6iqgtyv4a6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6iqgtyv4a6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6iqgtyv4a6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6iqgtyv4a6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6iqgtyv4a6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6iqgtyv4a6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6iqgtyv4a6] { filter: brightness(1.15); transform: scale(1.05); }
[b-6iqgtyv4a6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6iqgtyv4a6] { padding: 0.75rem; }
    .crud-header[b-6iqgtyv4a6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6iqgtyv4a6] { font-size: 1.1rem; }
    .btn-text[b-6iqgtyv4a6] { display: none; }
    .form-row[b-6iqgtyv4a6] { flex-direction: column; }
    .form-row-4[b-6iqgtyv4a6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6iqgtyv4a6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6iqgtyv4a6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6iqgtyv4a6] { padding: 0.75rem; }
    .modal-tabs[b-6iqgtyv4a6] { overflow-x: auto; }
    .modal-tab[b-6iqgtyv4a6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6iqgtyv4a6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6iqgtyv4a6] { display: grid !important; }
    .crud-cards-wrapper[b-6iqgtyv4a6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6iqgtyv4a6] { grid-template-columns: 1fr; }
    .card-details[b-6iqgtyv4a6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6iqgtyv4a6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6iqgtyv4a6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6iqgtyv4a6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6iqgtyv4a6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frminm_generaingreso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tef1gwt15m] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tef1gwt15m 0.3s ease-out; }
@keyframes slideUp-b-tef1gwt15m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tef1gwt15m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tef1gwt15m] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tef1gwt15m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tef1gwt15m] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tef1gwt15m] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tef1gwt15m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tef1gwt15m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tef1gwt15m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tef1gwt15m] { filter: brightness(1.1); }
.btn-outline[b-tef1gwt15m] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tef1gwt15m] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tef1gwt15m] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tef1gwt15m] { filter: brightness(1.1); }
.btn-icon[b-tef1gwt15m] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tef1gwt15m] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tef1gwt15m] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tef1gwt15m] { color: #ef4444; }
.btn-delete:hover[b-tef1gwt15m] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tef1gwt15m] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tef1gwt15m] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tef1gwt15m] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tef1gwt15m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tef1gwt15m] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tef1gwt15m] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tef1gwt15m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tef1gwt15m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tef1gwt15m] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tef1gwt15m] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tef1gwt15m] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tef1gwt15m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tef1gwt15m] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tef1gwt15m] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tef1gwt15m] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tef1gwt15m] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tef1gwt15m] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tef1gwt15m] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tef1gwt15m] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tef1gwt15m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tef1gwt15m] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tef1gwt15m] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tef1gwt15m] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tef1gwt15m] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tef1gwt15m] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tef1gwt15m] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tef1gwt15m] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tef1gwt15m] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tef1gwt15m] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tef1gwt15m] { display: block; }
.hide-on-cards[b-tef1gwt15m] { display: none !important; }
.show-on-cards[b-tef1gwt15m] { display: grid; }
.hide-on-grid[b-tef1gwt15m] { display: none !important; }

/* Badges */
.badge[b-tef1gwt15m] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tef1gwt15m] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tef1gwt15m] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tef1gwt15m] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tef1gwt15m] { text-align: center; }
.text-muted[b-tef1gwt15m] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tef1gwt15m], .crud-empty-state[b-tef1gwt15m] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tef1gwt15m] { font-size: 2rem; }
.crud-spinner[b-tef1gwt15m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tef1gwt15m 0.6s linear infinite; }
.crud-spinner-sm[b-tef1gwt15m] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tef1gwt15m 0.6s linear infinite; }
@keyframes spin-b-tef1gwt15m { to { transform: rotate(360deg); } }
.spin[b-tef1gwt15m] { animation: spin-b-tef1gwt15m 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tef1gwt15m] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tef1gwt15m 0.15s ease-out; }
.modal-container[b-tef1gwt15m] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tef1gwt15m] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tef1gwt15m 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tef1gwt15m] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tef1gwt15m] { max-width: 420px; }
@keyframes fadeIn-b-tef1gwt15m { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tef1gwt15m { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tef1gwt15m] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tef1gwt15m] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tef1gwt15m] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tef1gwt15m] { color: #dc2626; }
.modal-close[b-tef1gwt15m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tef1gwt15m] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tef1gwt15m] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tef1gwt15m] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tef1gwt15m] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tef1gwt15m] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tef1gwt15m] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tef1gwt15m] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tef1gwt15m] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tef1gwt15m] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tef1gwt15m] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tef1gwt15m] { flex: 2; }
.form-group label[b-tef1gwt15m] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tef1gwt15m], .form-group select[b-tef1gwt15m], .form-textarea[b-tef1gwt15m] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tef1gwt15m], .form-group select:focus[b-tef1gwt15m], .form-textarea:focus[b-tef1gwt15m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tef1gwt15m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tef1gwt15m] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tef1gwt15m] { flex: 1; display: flex; align-items: center; }
.form-check[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tef1gwt15m] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tef1gwt15m] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tef1gwt15m] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tef1gwt15m] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tef1gwt15m] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tef1gwt15m] { font-size: 3rem; }
.photo-placeholder span[b-tef1gwt15m] { font-size: 0.78rem; }
.photo-actions[b-tef1gwt15m] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tef1gwt15m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tef1gwt15m] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tef1gwt15m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tef1gwt15m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tef1gwt15m] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tef1gwt15m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tef1gwt15m] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tef1gwt15m] { filter: brightness(1.15); transform: scale(1.05); }
[b-tef1gwt15m] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tef1gwt15m] { padding: 0.75rem; }
    .crud-header[b-tef1gwt15m] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tef1gwt15m] { font-size: 1.1rem; }
    .btn-text[b-tef1gwt15m] { display: none; }
    .form-row[b-tef1gwt15m] { flex-direction: column; }
    .form-row-4[b-tef1gwt15m] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tef1gwt15m] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tef1gwt15m] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tef1gwt15m] { padding: 0.75rem; }
    .modal-tabs[b-tef1gwt15m] { overflow-x: auto; }
    .modal-tab[b-tef1gwt15m] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tef1gwt15m] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tef1gwt15m] { display: grid !important; }
    .crud-cards-wrapper[b-tef1gwt15m] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tef1gwt15m] { grid-template-columns: 1fr; }
    .card-details[b-tef1gwt15m] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tef1gwt15m] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tef1gwt15m] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tef1gwt15m] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tef1gwt15m] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frminm_inmueble.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-rcfrw9shvv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-rcfrw9shvv 0.3s ease-out; }
@keyframes slideUp-b-rcfrw9shvv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-rcfrw9shvv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-rcfrw9shvv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-rcfrw9shvv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-rcfrw9shvv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-rcfrw9shvv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-rcfrw9shvv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-rcfrw9shvv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-rcfrw9shvv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-rcfrw9shvv] { filter: brightness(1.1); }
.btn-outline[b-rcfrw9shvv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-rcfrw9shvv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-rcfrw9shvv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-rcfrw9shvv] { filter: brightness(1.1); }
.btn-icon[b-rcfrw9shvv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-rcfrw9shvv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-rcfrw9shvv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-rcfrw9shvv] { color: #ef4444; }
.btn-delete:hover[b-rcfrw9shvv] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-rcfrw9shvv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-rcfrw9shvv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-rcfrw9shvv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-rcfrw9shvv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-rcfrw9shvv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-rcfrw9shvv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-rcfrw9shvv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-rcfrw9shvv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-rcfrw9shvv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-rcfrw9shvv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-rcfrw9shvv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-rcfrw9shvv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-rcfrw9shvv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-rcfrw9shvv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-rcfrw9shvv] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-rcfrw9shvv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-rcfrw9shvv] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-rcfrw9shvv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-rcfrw9shvv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-rcfrw9shvv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-rcfrw9shvv] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-rcfrw9shvv] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-rcfrw9shvv] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-rcfrw9shvv] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-rcfrw9shvv] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-rcfrw9shvv] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-rcfrw9shvv] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-rcfrw9shvv] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-rcfrw9shvv] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-rcfrw9shvv] { display: block; }
.hide-on-cards[b-rcfrw9shvv] { display: none !important; }
.show-on-cards[b-rcfrw9shvv] { display: grid; }
.hide-on-grid[b-rcfrw9shvv] { display: none !important; }

/* Badges */
.badge[b-rcfrw9shvv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-rcfrw9shvv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-rcfrw9shvv] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-rcfrw9shvv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-rcfrw9shvv] { text-align: center; }
.text-muted[b-rcfrw9shvv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-rcfrw9shvv], .crud-empty-state[b-rcfrw9shvv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-rcfrw9shvv] { font-size: 2rem; }
.crud-spinner[b-rcfrw9shvv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-rcfrw9shvv 0.6s linear infinite; }
.crud-spinner-sm[b-rcfrw9shvv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-rcfrw9shvv 0.6s linear infinite; }
@keyframes spin-b-rcfrw9shvv { to { transform: rotate(360deg); } }
.spin[b-rcfrw9shvv] { animation: spin-b-rcfrw9shvv 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-rcfrw9shvv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-rcfrw9shvv 0.15s ease-out; }
.modal-container[b-rcfrw9shvv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-rcfrw9shvv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-rcfrw9shvv 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-rcfrw9shvv] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-rcfrw9shvv] { max-width: 420px; }
@keyframes fadeIn-b-rcfrw9shvv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-rcfrw9shvv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-rcfrw9shvv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-rcfrw9shvv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-rcfrw9shvv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-rcfrw9shvv] { color: #dc2626; }
.modal-close[b-rcfrw9shvv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-rcfrw9shvv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-rcfrw9shvv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-rcfrw9shvv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-rcfrw9shvv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-rcfrw9shvv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-rcfrw9shvv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-rcfrw9shvv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-rcfrw9shvv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-rcfrw9shvv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-rcfrw9shvv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-rcfrw9shvv] { flex: 2; }
.form-group label[b-rcfrw9shvv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-rcfrw9shvv], .form-group select[b-rcfrw9shvv], .form-textarea[b-rcfrw9shvv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-rcfrw9shvv], .form-group select:focus[b-rcfrw9shvv], .form-textarea:focus[b-rcfrw9shvv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-rcfrw9shvv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-rcfrw9shvv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-rcfrw9shvv] { flex: 1; display: flex; align-items: center; }
.form-check[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-rcfrw9shvv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-rcfrw9shvv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-rcfrw9shvv] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-rcfrw9shvv] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-rcfrw9shvv] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-rcfrw9shvv] { font-size: 3rem; }
.photo-placeholder span[b-rcfrw9shvv] { font-size: 0.78rem; }
.photo-actions[b-rcfrw9shvv] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-rcfrw9shvv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-rcfrw9shvv] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-rcfrw9shvv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-rcfrw9shvv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-rcfrw9shvv] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-rcfrw9shvv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-rcfrw9shvv] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-rcfrw9shvv] { filter: brightness(1.15); transform: scale(1.05); }
[b-rcfrw9shvv] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-rcfrw9shvv] { padding: 0.75rem; }
    .crud-header[b-rcfrw9shvv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-rcfrw9shvv] { font-size: 1.1rem; }
    .btn-text[b-rcfrw9shvv] { display: none; }
    .form-row[b-rcfrw9shvv] { flex-direction: column; }
    .form-row-4[b-rcfrw9shvv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-rcfrw9shvv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-rcfrw9shvv] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-rcfrw9shvv] { padding: 0.75rem; }
    .modal-tabs[b-rcfrw9shvv] { overflow-x: auto; }
    .modal-tab[b-rcfrw9shvv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-rcfrw9shvv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-rcfrw9shvv] { display: grid !important; }
    .crud-cards-wrapper[b-rcfrw9shvv] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-rcfrw9shvv] { grid-template-columns: 1fr; }
    .card-details[b-rcfrw9shvv] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-rcfrw9shvv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-rcfrw9shvv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-rcfrw9shvv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-rcfrw9shvv] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frminm_reformula_acuerdo_pago.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-my5vdf07ue] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-my5vdf07ue 0.3s ease-out; }
@keyframes slideUp-b-my5vdf07ue { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-my5vdf07ue] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-my5vdf07ue] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-my5vdf07ue] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-my5vdf07ue] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-my5vdf07ue] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-my5vdf07ue] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-my5vdf07ue] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-my5vdf07ue] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-my5vdf07ue] { filter: brightness(1.1); }
.btn-outline[b-my5vdf07ue] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-my5vdf07ue] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-my5vdf07ue] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-my5vdf07ue] { filter: brightness(1.1); }
.btn-icon[b-my5vdf07ue] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-my5vdf07ue] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-my5vdf07ue] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-my5vdf07ue] { color: #ef4444; }
.btn-delete:hover[b-my5vdf07ue] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-my5vdf07ue] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-my5vdf07ue] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-my5vdf07ue] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-my5vdf07ue] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-my5vdf07ue] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-my5vdf07ue] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-my5vdf07ue] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-my5vdf07ue] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-my5vdf07ue] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-my5vdf07ue] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-my5vdf07ue] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-my5vdf07ue] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-my5vdf07ue] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-my5vdf07ue] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-my5vdf07ue] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-my5vdf07ue] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-my5vdf07ue] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-my5vdf07ue] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-my5vdf07ue] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-my5vdf07ue] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-my5vdf07ue] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-my5vdf07ue] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-my5vdf07ue] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-my5vdf07ue] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-my5vdf07ue] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-my5vdf07ue] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-my5vdf07ue] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-my5vdf07ue] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-my5vdf07ue] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-my5vdf07ue] { display: block; }
.hide-on-cards[b-my5vdf07ue] { display: none !important; }
.show-on-cards[b-my5vdf07ue] { display: grid; }
.hide-on-grid[b-my5vdf07ue] { display: none !important; }

/* Badges */
.badge[b-my5vdf07ue] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-my5vdf07ue] { background: #ecfdf5; color: #065f46; }
.badge-no[b-my5vdf07ue] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-my5vdf07ue] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-my5vdf07ue] { text-align: center; }
.text-muted[b-my5vdf07ue] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-my5vdf07ue], .crud-empty-state[b-my5vdf07ue] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-my5vdf07ue] { font-size: 2rem; }
.crud-spinner[b-my5vdf07ue] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-my5vdf07ue 0.6s linear infinite; }
.crud-spinner-sm[b-my5vdf07ue] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-my5vdf07ue 0.6s linear infinite; }
@keyframes spin-b-my5vdf07ue { to { transform: rotate(360deg); } }
.spin[b-my5vdf07ue] { animation: spin-b-my5vdf07ue 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-my5vdf07ue] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-my5vdf07ue 0.15s ease-out; }
.modal-container[b-my5vdf07ue] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-my5vdf07ue] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-my5vdf07ue 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-my5vdf07ue] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-my5vdf07ue] { max-width: 420px; }
@keyframes fadeIn-b-my5vdf07ue { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-my5vdf07ue { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-my5vdf07ue] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-my5vdf07ue] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-my5vdf07ue] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-my5vdf07ue] { color: #dc2626; }
.modal-close[b-my5vdf07ue] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-my5vdf07ue] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-my5vdf07ue] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-my5vdf07ue] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-my5vdf07ue] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-my5vdf07ue] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-my5vdf07ue] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-my5vdf07ue] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-my5vdf07ue] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-my5vdf07ue] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-my5vdf07ue] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-my5vdf07ue] { flex: 2; }
.form-group label[b-my5vdf07ue] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-my5vdf07ue], .form-group select[b-my5vdf07ue], .form-textarea[b-my5vdf07ue] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-my5vdf07ue], .form-group select:focus[b-my5vdf07ue], .form-textarea:focus[b-my5vdf07ue] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-my5vdf07ue] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-my5vdf07ue] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-my5vdf07ue] { flex: 1; display: flex; align-items: center; }
.form-check[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-my5vdf07ue] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-my5vdf07ue] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-my5vdf07ue] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-my5vdf07ue] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-my5vdf07ue] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-my5vdf07ue] { font-size: 3rem; }
.photo-placeholder span[b-my5vdf07ue] { font-size: 0.78rem; }
.photo-actions[b-my5vdf07ue] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-my5vdf07ue] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-my5vdf07ue] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-my5vdf07ue] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-my5vdf07ue] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-my5vdf07ue] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-my5vdf07ue] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-my5vdf07ue] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-my5vdf07ue] { filter: brightness(1.15); transform: scale(1.05); }
[b-my5vdf07ue] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-my5vdf07ue] { padding: 0.75rem; }
    .crud-header[b-my5vdf07ue] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-my5vdf07ue] { font-size: 1.1rem; }
    .btn-text[b-my5vdf07ue] { display: none; }
    .form-row[b-my5vdf07ue] { flex-direction: column; }
    .form-row-4[b-my5vdf07ue] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-my5vdf07ue] { width: 98%; max-height: 95vh; }
    .modal-lg[b-my5vdf07ue] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-my5vdf07ue] { padding: 0.75rem; }
    .modal-tabs[b-my5vdf07ue] { overflow-x: auto; }
    .modal-tab[b-my5vdf07ue] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-my5vdf07ue] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-my5vdf07ue] { display: grid !important; }
    .crud-cards-wrapper[b-my5vdf07ue] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-my5vdf07ue] { grid-template-columns: 1fr; }
    .card-details[b-my5vdf07ue] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-my5vdf07ue] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-my5vdf07ue] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-my5vdf07ue] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-my5vdf07ue] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmmantenimiento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-clwtnh7m4b] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-clwtnh7m4b 0.3s ease-out; }
@keyframes slideUp-b-clwtnh7m4b { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-clwtnh7m4b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-clwtnh7m4b] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-clwtnh7m4b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-clwtnh7m4b] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-clwtnh7m4b] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-clwtnh7m4b] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-clwtnh7m4b] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-clwtnh7m4b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-clwtnh7m4b] { filter: brightness(1.1); }
.btn-outline[b-clwtnh7m4b] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-clwtnh7m4b] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-clwtnh7m4b] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-clwtnh7m4b] { filter: brightness(1.1); }
.btn-icon[b-clwtnh7m4b] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-clwtnh7m4b] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-clwtnh7m4b] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-clwtnh7m4b] { color: #ef4444; }
.btn-delete:hover[b-clwtnh7m4b] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-clwtnh7m4b] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-clwtnh7m4b] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-clwtnh7m4b] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-clwtnh7m4b] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-clwtnh7m4b] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-clwtnh7m4b] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-clwtnh7m4b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-clwtnh7m4b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-clwtnh7m4b] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-clwtnh7m4b] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-clwtnh7m4b] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-clwtnh7m4b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-clwtnh7m4b] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-clwtnh7m4b] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-clwtnh7m4b] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-clwtnh7m4b] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-clwtnh7m4b] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-clwtnh7m4b] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-clwtnh7m4b] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-clwtnh7m4b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-clwtnh7m4b] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-clwtnh7m4b] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-clwtnh7m4b] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-clwtnh7m4b] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-clwtnh7m4b] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-clwtnh7m4b] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-clwtnh7m4b] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-clwtnh7m4b] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-clwtnh7m4b] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-clwtnh7m4b] { display: block; }
.hide-on-cards[b-clwtnh7m4b] { display: none !important; }
.show-on-cards[b-clwtnh7m4b] { display: grid; }
.hide-on-grid[b-clwtnh7m4b] { display: none !important; }

/* Badges */
.badge[b-clwtnh7m4b] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-clwtnh7m4b] { background: #ecfdf5; color: #065f46; }
.badge-no[b-clwtnh7m4b] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-clwtnh7m4b] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-clwtnh7m4b] { text-align: center; }
.text-muted[b-clwtnh7m4b] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-clwtnh7m4b], .crud-empty-state[b-clwtnh7m4b] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-clwtnh7m4b] { font-size: 2rem; }
.crud-spinner[b-clwtnh7m4b] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-clwtnh7m4b 0.6s linear infinite; }
.crud-spinner-sm[b-clwtnh7m4b] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-clwtnh7m4b 0.6s linear infinite; }
@keyframes spin-b-clwtnh7m4b { to { transform: rotate(360deg); } }
.spin[b-clwtnh7m4b] { animation: spin-b-clwtnh7m4b 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-clwtnh7m4b] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-clwtnh7m4b 0.15s ease-out; }
.modal-container[b-clwtnh7m4b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-clwtnh7m4b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-clwtnh7m4b 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-clwtnh7m4b] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-clwtnh7m4b] { max-width: 420px; }
@keyframes fadeIn-b-clwtnh7m4b { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-clwtnh7m4b { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-clwtnh7m4b] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-clwtnh7m4b] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-clwtnh7m4b] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-clwtnh7m4b] { color: #dc2626; }
.modal-close[b-clwtnh7m4b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-clwtnh7m4b] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-clwtnh7m4b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-clwtnh7m4b] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-clwtnh7m4b] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-clwtnh7m4b] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-clwtnh7m4b] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-clwtnh7m4b] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-clwtnh7m4b] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-clwtnh7m4b] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-clwtnh7m4b] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-clwtnh7m4b] { flex: 2; }
.form-group label[b-clwtnh7m4b] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-clwtnh7m4b], .form-group select[b-clwtnh7m4b], .form-textarea[b-clwtnh7m4b] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-clwtnh7m4b], .form-group select:focus[b-clwtnh7m4b], .form-textarea:focus[b-clwtnh7m4b] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-clwtnh7m4b] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-clwtnh7m4b] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-clwtnh7m4b] { flex: 1; display: flex; align-items: center; }
.form-check[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-clwtnh7m4b] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-clwtnh7m4b] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-clwtnh7m4b] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-clwtnh7m4b] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-clwtnh7m4b] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-clwtnh7m4b] { font-size: 3rem; }
.photo-placeholder span[b-clwtnh7m4b] { font-size: 0.78rem; }
.photo-actions[b-clwtnh7m4b] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-clwtnh7m4b] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-clwtnh7m4b] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-clwtnh7m4b] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-clwtnh7m4b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-clwtnh7m4b] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-clwtnh7m4b] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-clwtnh7m4b] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-clwtnh7m4b] { filter: brightness(1.15); transform: scale(1.05); }
[b-clwtnh7m4b] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-clwtnh7m4b] { padding: 0.75rem; }
    .crud-header[b-clwtnh7m4b] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-clwtnh7m4b] { font-size: 1.1rem; }
    .btn-text[b-clwtnh7m4b] { display: none; }
    .form-row[b-clwtnh7m4b] { flex-direction: column; }
    .form-row-4[b-clwtnh7m4b] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-clwtnh7m4b] { width: 98%; max-height: 95vh; }
    .modal-lg[b-clwtnh7m4b] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-clwtnh7m4b] { padding: 0.75rem; }
    .modal-tabs[b-clwtnh7m4b] { overflow-x: auto; }
    .modal-tab[b-clwtnh7m4b] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-clwtnh7m4b] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-clwtnh7m4b] { display: grid !important; }
    .crud-cards-wrapper[b-clwtnh7m4b] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-clwtnh7m4b] { grid-template-columns: 1fr; }
    .card-details[b-clwtnh7m4b] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-clwtnh7m4b] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-clwtnh7m4b] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-clwtnh7m4b] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-clwtnh7m4b] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmmasterinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-crqvpewxot] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-crqvpewxot 0.3s ease-out; }
@keyframes slideUp-b-crqvpewxot { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-crqvpewxot] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-crqvpewxot] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-crqvpewxot] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-crqvpewxot] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-crqvpewxot] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-crqvpewxot] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-crqvpewxot] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-crqvpewxot] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-crqvpewxot] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-crqvpewxot] { filter: brightness(1.1); }
.btn-outline[b-crqvpewxot] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-crqvpewxot] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-crqvpewxot] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-crqvpewxot] { filter: brightness(1.1); }
.btn-icon[b-crqvpewxot] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-crqvpewxot] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-crqvpewxot] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-crqvpewxot] { color: #ef4444; }
.btn-delete:hover[b-crqvpewxot] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-crqvpewxot] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-crqvpewxot] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-crqvpewxot] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-crqvpewxot] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-crqvpewxot] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-crqvpewxot] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-crqvpewxot] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-crqvpewxot] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-crqvpewxot] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-crqvpewxot] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-crqvpewxot] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-crqvpewxot] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-crqvpewxot] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-crqvpewxot] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-crqvpewxot] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-crqvpewxot] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-crqvpewxot] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-crqvpewxot] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-crqvpewxot] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-crqvpewxot] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-crqvpewxot] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-crqvpewxot] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-crqvpewxot] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-crqvpewxot] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-crqvpewxot] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-crqvpewxot] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-crqvpewxot] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-crqvpewxot] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-crqvpewxot] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-crqvpewxot] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-crqvpewxot] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-crqvpewxot] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-crqvpewxot] { display: block; }
.hide-on-cards[b-crqvpewxot] { display: none !important; }
.show-on-cards[b-crqvpewxot] { display: grid; }
.hide-on-grid[b-crqvpewxot] { display: none !important; }

/* Badges */
.badge[b-crqvpewxot] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-crqvpewxot] { background: #ecfdf5; color: #065f46; }
.badge-no[b-crqvpewxot] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-crqvpewxot] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-crqvpewxot] { text-align: center; }
.text-muted[b-crqvpewxot] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-crqvpewxot], .crud-empty-state[b-crqvpewxot] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-crqvpewxot] { font-size: 2rem; }
.crud-spinner[b-crqvpewxot] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-crqvpewxot 0.6s linear infinite; }
.crud-spinner-sm[b-crqvpewxot] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-crqvpewxot 0.6s linear infinite; }
@keyframes spin-b-crqvpewxot { to { transform: rotate(360deg); } }
.spin[b-crqvpewxot] { animation: spin-b-crqvpewxot 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-crqvpewxot] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-crqvpewxot 0.15s ease-out; }
.modal-container[b-crqvpewxot] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-crqvpewxot] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-crqvpewxot 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-crqvpewxot] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-crqvpewxot] { max-width: 420px; }
@keyframes fadeIn-b-crqvpewxot { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-crqvpewxot { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-crqvpewxot] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-crqvpewxot] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-crqvpewxot] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-crqvpewxot] { color: #dc2626; }
.modal-close[b-crqvpewxot] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-crqvpewxot] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-crqvpewxot] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-crqvpewxot] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-crqvpewxot] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-crqvpewxot] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-crqvpewxot] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-crqvpewxot] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-crqvpewxot] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-crqvpewxot] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-crqvpewxot] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-crqvpewxot] { flex: 2; }
.form-group label[b-crqvpewxot] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-crqvpewxot], .form-group select[b-crqvpewxot], .form-textarea[b-crqvpewxot] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-crqvpewxot], .form-group select:focus[b-crqvpewxot], .form-textarea:focus[b-crqvpewxot] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-crqvpewxot] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-crqvpewxot] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-crqvpewxot] { flex: 1; display: flex; align-items: center; }
.form-check[b-crqvpewxot] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-crqvpewxot] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-crqvpewxot] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-crqvpewxot] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-crqvpewxot] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-crqvpewxot] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-crqvpewxot] { font-size: 3rem; }
.photo-placeholder span[b-crqvpewxot] { font-size: 0.78rem; }
.photo-actions[b-crqvpewxot] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-crqvpewxot] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-crqvpewxot] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-crqvpewxot] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-crqvpewxot] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-crqvpewxot] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-crqvpewxot] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-crqvpewxot] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-crqvpewxot] { filter: brightness(1.15); transform: scale(1.05); }
[b-crqvpewxot] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-crqvpewxot] { padding: 0.75rem; }
    .crud-header[b-crqvpewxot] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-crqvpewxot] { font-size: 1.1rem; }
    .btn-text[b-crqvpewxot] { display: none; }
    .form-row[b-crqvpewxot] { flex-direction: column; }
    .form-row-4[b-crqvpewxot] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-crqvpewxot] { width: 98%; max-height: 95vh; }
    .modal-lg[b-crqvpewxot] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-crqvpewxot] { padding: 0.75rem; }
    .modal-tabs[b-crqvpewxot] { overflow-x: auto; }
    .modal-tab[b-crqvpewxot] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-crqvpewxot] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-crqvpewxot] { display: grid !important; }
    .crud-cards-wrapper[b-crqvpewxot] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-crqvpewxot] { grid-template-columns: 1fr; }
    .card-details[b-crqvpewxot] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-crqvpewxot] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-crqvpewxot] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-crqvpewxot] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-crqvpewxot] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmmonedatasaopdeldia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tmf1b7x957] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tmf1b7x957 0.3s ease-out; }
@keyframes slideUp-b-tmf1b7x957 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tmf1b7x957] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tmf1b7x957] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tmf1b7x957] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tmf1b7x957] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tmf1b7x957] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tmf1b7x957] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tmf1b7x957] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tmf1b7x957] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tmf1b7x957] { filter: brightness(1.1); }
.btn-outline[b-tmf1b7x957] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tmf1b7x957] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tmf1b7x957] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tmf1b7x957] { filter: brightness(1.1); }
.btn-icon[b-tmf1b7x957] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tmf1b7x957] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tmf1b7x957] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tmf1b7x957] { color: #ef4444; }
.btn-delete:hover[b-tmf1b7x957] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tmf1b7x957] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tmf1b7x957] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tmf1b7x957] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tmf1b7x957] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tmf1b7x957] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tmf1b7x957] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tmf1b7x957] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tmf1b7x957] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tmf1b7x957] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tmf1b7x957] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tmf1b7x957] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tmf1b7x957] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tmf1b7x957] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tmf1b7x957] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tmf1b7x957] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tmf1b7x957] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tmf1b7x957] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tmf1b7x957] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tmf1b7x957] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tmf1b7x957] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tmf1b7x957] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tmf1b7x957] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tmf1b7x957] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tmf1b7x957] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tmf1b7x957] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tmf1b7x957] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tmf1b7x957] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tmf1b7x957] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tmf1b7x957] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tmf1b7x957] { display: block; }
.hide-on-cards[b-tmf1b7x957] { display: none !important; }
.show-on-cards[b-tmf1b7x957] { display: grid; }
.hide-on-grid[b-tmf1b7x957] { display: none !important; }

/* Badges */
.badge[b-tmf1b7x957] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tmf1b7x957] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tmf1b7x957] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tmf1b7x957] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tmf1b7x957] { text-align: center; }
.text-muted[b-tmf1b7x957] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tmf1b7x957], .crud-empty-state[b-tmf1b7x957] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tmf1b7x957] { font-size: 2rem; }
.crud-spinner[b-tmf1b7x957] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tmf1b7x957 0.6s linear infinite; }
.crud-spinner-sm[b-tmf1b7x957] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tmf1b7x957 0.6s linear infinite; }
@keyframes spin-b-tmf1b7x957 { to { transform: rotate(360deg); } }
.spin[b-tmf1b7x957] { animation: spin-b-tmf1b7x957 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tmf1b7x957] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tmf1b7x957 0.15s ease-out; }
.modal-container[b-tmf1b7x957] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tmf1b7x957] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tmf1b7x957 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tmf1b7x957] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tmf1b7x957] { max-width: 420px; }
@keyframes fadeIn-b-tmf1b7x957 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tmf1b7x957 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tmf1b7x957] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tmf1b7x957] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tmf1b7x957] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tmf1b7x957] { color: #dc2626; }
.modal-close[b-tmf1b7x957] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tmf1b7x957] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tmf1b7x957] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tmf1b7x957] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tmf1b7x957] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tmf1b7x957] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tmf1b7x957] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tmf1b7x957] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tmf1b7x957] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tmf1b7x957] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tmf1b7x957] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tmf1b7x957] { flex: 2; }
.form-group label[b-tmf1b7x957] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tmf1b7x957], .form-group select[b-tmf1b7x957], .form-textarea[b-tmf1b7x957] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tmf1b7x957], .form-group select:focus[b-tmf1b7x957], .form-textarea:focus[b-tmf1b7x957] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tmf1b7x957] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tmf1b7x957] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tmf1b7x957] { flex: 1; display: flex; align-items: center; }
.form-check[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tmf1b7x957] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tmf1b7x957] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tmf1b7x957] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tmf1b7x957] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tmf1b7x957] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tmf1b7x957] { font-size: 3rem; }
.photo-placeholder span[b-tmf1b7x957] { font-size: 0.78rem; }
.photo-actions[b-tmf1b7x957] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tmf1b7x957] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tmf1b7x957] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tmf1b7x957] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tmf1b7x957] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tmf1b7x957] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tmf1b7x957] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tmf1b7x957] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tmf1b7x957] { filter: brightness(1.15); transform: scale(1.05); }
[b-tmf1b7x957] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tmf1b7x957] { padding: 0.75rem; }
    .crud-header[b-tmf1b7x957] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tmf1b7x957] { font-size: 1.1rem; }
    .btn-text[b-tmf1b7x957] { display: none; }
    .form-row[b-tmf1b7x957] { flex-direction: column; }
    .form-row-4[b-tmf1b7x957] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tmf1b7x957] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tmf1b7x957] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tmf1b7x957] { padding: 0.75rem; }
    .modal-tabs[b-tmf1b7x957] { overflow-x: auto; }
    .modal-tab[b-tmf1b7x957] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tmf1b7x957] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tmf1b7x957] { display: grid !important; }
    .crud-cards-wrapper[b-tmf1b7x957] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tmf1b7x957] { grid-template-columns: 1fr; }
    .card-details[b-tmf1b7x957] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tmf1b7x957] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tmf1b7x957] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tmf1b7x957] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tmf1b7x957] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmprestamosinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lqlgyycfe2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lqlgyycfe2 0.3s ease-out; }
@keyframes slideUp-b-lqlgyycfe2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lqlgyycfe2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lqlgyycfe2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lqlgyycfe2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lqlgyycfe2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lqlgyycfe2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lqlgyycfe2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lqlgyycfe2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lqlgyycfe2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lqlgyycfe2] { filter: brightness(1.1); }
.btn-outline[b-lqlgyycfe2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lqlgyycfe2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lqlgyycfe2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lqlgyycfe2] { filter: brightness(1.1); }
.btn-icon[b-lqlgyycfe2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lqlgyycfe2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lqlgyycfe2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lqlgyycfe2] { color: #ef4444; }
.btn-delete:hover[b-lqlgyycfe2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lqlgyycfe2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lqlgyycfe2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lqlgyycfe2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lqlgyycfe2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lqlgyycfe2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lqlgyycfe2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lqlgyycfe2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lqlgyycfe2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lqlgyycfe2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lqlgyycfe2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lqlgyycfe2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lqlgyycfe2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lqlgyycfe2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lqlgyycfe2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lqlgyycfe2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lqlgyycfe2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lqlgyycfe2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lqlgyycfe2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lqlgyycfe2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lqlgyycfe2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lqlgyycfe2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lqlgyycfe2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lqlgyycfe2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lqlgyycfe2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lqlgyycfe2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lqlgyycfe2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lqlgyycfe2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lqlgyycfe2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lqlgyycfe2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lqlgyycfe2] { display: block; }
.hide-on-cards[b-lqlgyycfe2] { display: none !important; }
.show-on-cards[b-lqlgyycfe2] { display: grid; }
.hide-on-grid[b-lqlgyycfe2] { display: none !important; }

/* Badges */
.badge[b-lqlgyycfe2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lqlgyycfe2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lqlgyycfe2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lqlgyycfe2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lqlgyycfe2] { text-align: center; }
.text-muted[b-lqlgyycfe2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lqlgyycfe2], .crud-empty-state[b-lqlgyycfe2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lqlgyycfe2] { font-size: 2rem; }
.crud-spinner[b-lqlgyycfe2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lqlgyycfe2 0.6s linear infinite; }
.crud-spinner-sm[b-lqlgyycfe2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lqlgyycfe2 0.6s linear infinite; }
@keyframes spin-b-lqlgyycfe2 { to { transform: rotate(360deg); } }
.spin[b-lqlgyycfe2] { animation: spin-b-lqlgyycfe2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lqlgyycfe2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lqlgyycfe2 0.15s ease-out; }
.modal-container[b-lqlgyycfe2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lqlgyycfe2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lqlgyycfe2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lqlgyycfe2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lqlgyycfe2] { max-width: 420px; }
@keyframes fadeIn-b-lqlgyycfe2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lqlgyycfe2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lqlgyycfe2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lqlgyycfe2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lqlgyycfe2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lqlgyycfe2] { color: #dc2626; }
.modal-close[b-lqlgyycfe2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lqlgyycfe2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lqlgyycfe2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lqlgyycfe2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lqlgyycfe2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lqlgyycfe2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lqlgyycfe2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lqlgyycfe2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lqlgyycfe2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lqlgyycfe2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lqlgyycfe2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lqlgyycfe2] { flex: 2; }
.form-group label[b-lqlgyycfe2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lqlgyycfe2], .form-group select[b-lqlgyycfe2], .form-textarea[b-lqlgyycfe2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lqlgyycfe2], .form-group select:focus[b-lqlgyycfe2], .form-textarea:focus[b-lqlgyycfe2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lqlgyycfe2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lqlgyycfe2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lqlgyycfe2] { flex: 1; display: flex; align-items: center; }
.form-check[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lqlgyycfe2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lqlgyycfe2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lqlgyycfe2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lqlgyycfe2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lqlgyycfe2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lqlgyycfe2] { font-size: 3rem; }
.photo-placeholder span[b-lqlgyycfe2] { font-size: 0.78rem; }
.photo-actions[b-lqlgyycfe2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lqlgyycfe2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lqlgyycfe2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lqlgyycfe2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lqlgyycfe2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lqlgyycfe2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lqlgyycfe2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lqlgyycfe2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lqlgyycfe2] { filter: brightness(1.15); transform: scale(1.05); }
[b-lqlgyycfe2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lqlgyycfe2] { padding: 0.75rem; }
    .crud-header[b-lqlgyycfe2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lqlgyycfe2] { font-size: 1.1rem; }
    .btn-text[b-lqlgyycfe2] { display: none; }
    .form-row[b-lqlgyycfe2] { flex-direction: column; }
    .form-row-4[b-lqlgyycfe2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lqlgyycfe2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lqlgyycfe2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lqlgyycfe2] { padding: 0.75rem; }
    .modal-tabs[b-lqlgyycfe2] { overflow-x: auto; }
    .modal-tab[b-lqlgyycfe2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lqlgyycfe2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lqlgyycfe2] { display: grid !important; }
    .crud-cards-wrapper[b-lqlgyycfe2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lqlgyycfe2] { grid-template-columns: 1fr; }
    .card-details[b-lqlgyycfe2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lqlgyycfe2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lqlgyycfe2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lqlgyycfe2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lqlgyycfe2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmproductoinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7b5c806g8q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7b5c806g8q 0.3s ease-out; }
@keyframes slideUp-b-7b5c806g8q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7b5c806g8q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7b5c806g8q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7b5c806g8q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7b5c806g8q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7b5c806g8q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7b5c806g8q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7b5c806g8q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7b5c806g8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7b5c806g8q] { filter: brightness(1.1); }
.btn-outline[b-7b5c806g8q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7b5c806g8q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7b5c806g8q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7b5c806g8q] { filter: brightness(1.1); }
.btn-icon[b-7b5c806g8q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7b5c806g8q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7b5c806g8q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7b5c806g8q] { color: #ef4444; }
.btn-delete:hover[b-7b5c806g8q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7b5c806g8q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7b5c806g8q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7b5c806g8q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7b5c806g8q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7b5c806g8q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7b5c806g8q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7b5c806g8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7b5c806g8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7b5c806g8q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7b5c806g8q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7b5c806g8q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7b5c806g8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7b5c806g8q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7b5c806g8q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7b5c806g8q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7b5c806g8q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7b5c806g8q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7b5c806g8q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7b5c806g8q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7b5c806g8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7b5c806g8q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7b5c806g8q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7b5c806g8q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7b5c806g8q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7b5c806g8q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7b5c806g8q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7b5c806g8q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7b5c806g8q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7b5c806g8q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7b5c806g8q] { display: block; }
.hide-on-cards[b-7b5c806g8q] { display: none !important; }
.show-on-cards[b-7b5c806g8q] { display: grid; }
.hide-on-grid[b-7b5c806g8q] { display: none !important; }

/* Badges */
.badge[b-7b5c806g8q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7b5c806g8q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7b5c806g8q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7b5c806g8q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7b5c806g8q] { text-align: center; }
.text-muted[b-7b5c806g8q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7b5c806g8q], .crud-empty-state[b-7b5c806g8q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7b5c806g8q] { font-size: 2rem; }
.crud-spinner[b-7b5c806g8q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7b5c806g8q 0.6s linear infinite; }
.crud-spinner-sm[b-7b5c806g8q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7b5c806g8q 0.6s linear infinite; }
@keyframes spin-b-7b5c806g8q { to { transform: rotate(360deg); } }
.spin[b-7b5c806g8q] { animation: spin-b-7b5c806g8q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7b5c806g8q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7b5c806g8q 0.15s ease-out; }
.modal-container[b-7b5c806g8q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7b5c806g8q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7b5c806g8q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7b5c806g8q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7b5c806g8q] { max-width: 420px; }
@keyframes fadeIn-b-7b5c806g8q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7b5c806g8q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7b5c806g8q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7b5c806g8q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7b5c806g8q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7b5c806g8q] { color: #dc2626; }
.modal-close[b-7b5c806g8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7b5c806g8q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7b5c806g8q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7b5c806g8q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7b5c806g8q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7b5c806g8q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7b5c806g8q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7b5c806g8q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7b5c806g8q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7b5c806g8q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7b5c806g8q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7b5c806g8q] { flex: 2; }
.form-group label[b-7b5c806g8q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7b5c806g8q], .form-group select[b-7b5c806g8q], .form-textarea[b-7b5c806g8q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7b5c806g8q], .form-group select:focus[b-7b5c806g8q], .form-textarea:focus[b-7b5c806g8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7b5c806g8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7b5c806g8q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7b5c806g8q] { flex: 1; display: flex; align-items: center; }
.form-check[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7b5c806g8q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7b5c806g8q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7b5c806g8q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7b5c806g8q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7b5c806g8q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7b5c806g8q] { font-size: 3rem; }
.photo-placeholder span[b-7b5c806g8q] { font-size: 0.78rem; }
.photo-actions[b-7b5c806g8q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7b5c806g8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7b5c806g8q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7b5c806g8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7b5c806g8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7b5c806g8q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7b5c806g8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7b5c806g8q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7b5c806g8q] { filter: brightness(1.15); transform: scale(1.05); }
[b-7b5c806g8q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7b5c806g8q] { padding: 0.75rem; }
    .crud-header[b-7b5c806g8q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7b5c806g8q] { font-size: 1.1rem; }
    .btn-text[b-7b5c806g8q] { display: none; }
    .form-row[b-7b5c806g8q] { flex-direction: column; }
    .form-row-4[b-7b5c806g8q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7b5c806g8q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7b5c806g8q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7b5c806g8q] { padding: 0.75rem; }
    .modal-tabs[b-7b5c806g8q] { overflow-x: auto; }
    .modal-tab[b-7b5c806g8q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7b5c806g8q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7b5c806g8q] { display: grid !important; }
    .crud-cards-wrapper[b-7b5c806g8q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7b5c806g8q] { grid-template-columns: 1fr; }
    .card-details[b-7b5c806g8q] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7b5c806g8q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7b5c806g8q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7b5c806g8q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7b5c806g8q] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmregistracargoprestamoinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9yr00zb2am] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9yr00zb2am 0.3s ease-out; }
@keyframes slideUp-b-9yr00zb2am { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9yr00zb2am] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9yr00zb2am] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9yr00zb2am] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9yr00zb2am] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9yr00zb2am] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9yr00zb2am] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9yr00zb2am] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9yr00zb2am] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9yr00zb2am] { filter: brightness(1.1); }
.btn-outline[b-9yr00zb2am] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9yr00zb2am] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9yr00zb2am] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9yr00zb2am] { filter: brightness(1.1); }
.btn-icon[b-9yr00zb2am] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9yr00zb2am] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9yr00zb2am] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9yr00zb2am] { color: #ef4444; }
.btn-delete:hover[b-9yr00zb2am] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9yr00zb2am] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9yr00zb2am] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9yr00zb2am] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9yr00zb2am] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9yr00zb2am] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9yr00zb2am] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9yr00zb2am] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9yr00zb2am] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9yr00zb2am] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9yr00zb2am] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9yr00zb2am] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9yr00zb2am] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9yr00zb2am] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9yr00zb2am] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9yr00zb2am] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9yr00zb2am] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9yr00zb2am] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9yr00zb2am] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9yr00zb2am] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9yr00zb2am] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9yr00zb2am] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9yr00zb2am] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9yr00zb2am] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9yr00zb2am] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9yr00zb2am] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9yr00zb2am] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9yr00zb2am] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9yr00zb2am] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9yr00zb2am] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9yr00zb2am] { display: block; }
.hide-on-cards[b-9yr00zb2am] { display: none !important; }
.show-on-cards[b-9yr00zb2am] { display: grid; }
.hide-on-grid[b-9yr00zb2am] { display: none !important; }

/* Badges */
.badge[b-9yr00zb2am] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9yr00zb2am] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9yr00zb2am] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9yr00zb2am] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9yr00zb2am] { text-align: center; }
.text-muted[b-9yr00zb2am] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9yr00zb2am], .crud-empty-state[b-9yr00zb2am] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9yr00zb2am] { font-size: 2rem; }
.crud-spinner[b-9yr00zb2am] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9yr00zb2am 0.6s linear infinite; }
.crud-spinner-sm[b-9yr00zb2am] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9yr00zb2am 0.6s linear infinite; }
@keyframes spin-b-9yr00zb2am { to { transform: rotate(360deg); } }
.spin[b-9yr00zb2am] { animation: spin-b-9yr00zb2am 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9yr00zb2am] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9yr00zb2am 0.15s ease-out; }
.modal-container[b-9yr00zb2am] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9yr00zb2am] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9yr00zb2am 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9yr00zb2am] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9yr00zb2am] { max-width: 420px; }
@keyframes fadeIn-b-9yr00zb2am { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9yr00zb2am { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9yr00zb2am] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9yr00zb2am] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9yr00zb2am] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9yr00zb2am] { color: #dc2626; }
.modal-close[b-9yr00zb2am] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9yr00zb2am] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9yr00zb2am] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9yr00zb2am] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9yr00zb2am] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9yr00zb2am] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9yr00zb2am] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9yr00zb2am] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9yr00zb2am] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9yr00zb2am] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9yr00zb2am] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9yr00zb2am] { flex: 2; }
.form-group label[b-9yr00zb2am] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9yr00zb2am], .form-group select[b-9yr00zb2am], .form-textarea[b-9yr00zb2am] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9yr00zb2am], .form-group select:focus[b-9yr00zb2am], .form-textarea:focus[b-9yr00zb2am] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9yr00zb2am] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9yr00zb2am] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9yr00zb2am] { flex: 1; display: flex; align-items: center; }
.form-check[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9yr00zb2am] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9yr00zb2am] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9yr00zb2am] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9yr00zb2am] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9yr00zb2am] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9yr00zb2am] { font-size: 3rem; }
.photo-placeholder span[b-9yr00zb2am] { font-size: 0.78rem; }
.photo-actions[b-9yr00zb2am] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9yr00zb2am] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9yr00zb2am] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9yr00zb2am] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9yr00zb2am] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9yr00zb2am] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9yr00zb2am] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9yr00zb2am] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9yr00zb2am] { filter: brightness(1.15); transform: scale(1.05); }
[b-9yr00zb2am] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9yr00zb2am] { padding: 0.75rem; }
    .crud-header[b-9yr00zb2am] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9yr00zb2am] { font-size: 1.1rem; }
    .btn-text[b-9yr00zb2am] { display: none; }
    .form-row[b-9yr00zb2am] { flex-direction: column; }
    .form-row-4[b-9yr00zb2am] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9yr00zb2am] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9yr00zb2am] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9yr00zb2am] { padding: 0.75rem; }
    .modal-tabs[b-9yr00zb2am] { overflow-x: auto; }
    .modal-tab[b-9yr00zb2am] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9yr00zb2am] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9yr00zb2am] { display: grid !important; }
    .crud-cards-wrapper[b-9yr00zb2am] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9yr00zb2am] { grid-template-columns: 1fr; }
    .card-details[b-9yr00zb2am] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9yr00zb2am] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9yr00zb2am] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9yr00zb2am] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9yr00zb2am] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmregistragaranteinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xkjczd7ipb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xkjczd7ipb 0.3s ease-out; }
@keyframes slideUp-b-xkjczd7ipb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xkjczd7ipb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xkjczd7ipb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xkjczd7ipb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xkjczd7ipb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xkjczd7ipb] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xkjczd7ipb] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xkjczd7ipb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xkjczd7ipb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xkjczd7ipb] { filter: brightness(1.1); }
.btn-outline[b-xkjczd7ipb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xkjczd7ipb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xkjczd7ipb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xkjczd7ipb] { filter: brightness(1.1); }
.btn-icon[b-xkjczd7ipb] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xkjczd7ipb] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xkjczd7ipb] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xkjczd7ipb] { color: #ef4444; }
.btn-delete:hover[b-xkjczd7ipb] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xkjczd7ipb] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xkjczd7ipb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xkjczd7ipb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xkjczd7ipb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xkjczd7ipb] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xkjczd7ipb] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xkjczd7ipb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xkjczd7ipb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xkjczd7ipb] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xkjczd7ipb] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xkjczd7ipb] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xkjczd7ipb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xkjczd7ipb] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xkjczd7ipb] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xkjczd7ipb] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xkjczd7ipb] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xkjczd7ipb] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xkjczd7ipb] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xkjczd7ipb] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xkjczd7ipb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xkjczd7ipb] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xkjczd7ipb] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xkjczd7ipb] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xkjczd7ipb] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xkjczd7ipb] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xkjczd7ipb] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xkjczd7ipb] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xkjczd7ipb] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xkjczd7ipb] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xkjczd7ipb] { display: block; }
.hide-on-cards[b-xkjczd7ipb] { display: none !important; }
.show-on-cards[b-xkjczd7ipb] { display: grid; }
.hide-on-grid[b-xkjczd7ipb] { display: none !important; }

/* Badges */
.badge[b-xkjczd7ipb] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xkjczd7ipb] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xkjczd7ipb] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xkjczd7ipb] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xkjczd7ipb] { text-align: center; }
.text-muted[b-xkjczd7ipb] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xkjczd7ipb], .crud-empty-state[b-xkjczd7ipb] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xkjczd7ipb] { font-size: 2rem; }
.crud-spinner[b-xkjczd7ipb] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xkjczd7ipb 0.6s linear infinite; }
.crud-spinner-sm[b-xkjczd7ipb] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xkjczd7ipb 0.6s linear infinite; }
@keyframes spin-b-xkjczd7ipb { to { transform: rotate(360deg); } }
.spin[b-xkjczd7ipb] { animation: spin-b-xkjczd7ipb 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xkjczd7ipb] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xkjczd7ipb 0.15s ease-out; }
.modal-container[b-xkjczd7ipb] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xkjczd7ipb] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xkjczd7ipb 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xkjczd7ipb] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xkjczd7ipb] { max-width: 420px; }
@keyframes fadeIn-b-xkjczd7ipb { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xkjczd7ipb { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xkjczd7ipb] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xkjczd7ipb] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xkjczd7ipb] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xkjczd7ipb] { color: #dc2626; }
.modal-close[b-xkjczd7ipb] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xkjczd7ipb] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xkjczd7ipb] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xkjczd7ipb] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xkjczd7ipb] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xkjczd7ipb] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xkjczd7ipb] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xkjczd7ipb] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xkjczd7ipb] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xkjczd7ipb] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xkjczd7ipb] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xkjczd7ipb] { flex: 2; }
.form-group label[b-xkjczd7ipb] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xkjczd7ipb], .form-group select[b-xkjczd7ipb], .form-textarea[b-xkjczd7ipb] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xkjczd7ipb], .form-group select:focus[b-xkjczd7ipb], .form-textarea:focus[b-xkjczd7ipb] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xkjczd7ipb] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xkjczd7ipb] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xkjczd7ipb] { flex: 1; display: flex; align-items: center; }
.form-check[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xkjczd7ipb] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xkjczd7ipb] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xkjczd7ipb] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xkjczd7ipb] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xkjczd7ipb] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xkjczd7ipb] { font-size: 3rem; }
.photo-placeholder span[b-xkjczd7ipb] { font-size: 0.78rem; }
.photo-actions[b-xkjczd7ipb] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xkjczd7ipb] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xkjczd7ipb] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xkjczd7ipb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xkjczd7ipb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xkjczd7ipb] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xkjczd7ipb] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xkjczd7ipb] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xkjczd7ipb] { filter: brightness(1.15); transform: scale(1.05); }
[b-xkjczd7ipb] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xkjczd7ipb] { padding: 0.75rem; }
    .crud-header[b-xkjczd7ipb] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xkjczd7ipb] { font-size: 1.1rem; }
    .btn-text[b-xkjczd7ipb] { display: none; }
    .form-row[b-xkjczd7ipb] { flex-direction: column; }
    .form-row-4[b-xkjczd7ipb] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xkjczd7ipb] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xkjczd7ipb] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xkjczd7ipb] { padding: 0.75rem; }
    .modal-tabs[b-xkjczd7ipb] { overflow-x: auto; }
    .modal-tab[b-xkjczd7ipb] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xkjczd7ipb] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xkjczd7ipb] { display: grid !important; }
    .crud-cards-wrapper[b-xkjczd7ipb] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xkjczd7ipb] { grid-template-columns: 1fr; }
    .card-details[b-xkjczd7ipb] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xkjczd7ipb] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xkjczd7ipb] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xkjczd7ipb] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xkjczd7ipb] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inmobiliaria/Frmreimpresionrcinmobiliaria.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-sghys8f7o1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-sghys8f7o1 0.3s ease-out; }
@keyframes slideUp-b-sghys8f7o1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-sghys8f7o1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-sghys8f7o1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-sghys8f7o1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-sghys8f7o1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-sghys8f7o1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-sghys8f7o1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-sghys8f7o1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-sghys8f7o1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-sghys8f7o1] { filter: brightness(1.1); }
.btn-outline[b-sghys8f7o1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-sghys8f7o1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-sghys8f7o1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-sghys8f7o1] { filter: brightness(1.1); }
.btn-icon[b-sghys8f7o1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-sghys8f7o1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-sghys8f7o1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-sghys8f7o1] { color: #ef4444; }
.btn-delete:hover[b-sghys8f7o1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-sghys8f7o1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-sghys8f7o1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-sghys8f7o1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-sghys8f7o1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-sghys8f7o1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-sghys8f7o1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-sghys8f7o1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-sghys8f7o1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-sghys8f7o1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-sghys8f7o1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-sghys8f7o1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-sghys8f7o1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-sghys8f7o1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-sghys8f7o1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-sghys8f7o1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-sghys8f7o1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-sghys8f7o1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-sghys8f7o1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-sghys8f7o1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-sghys8f7o1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-sghys8f7o1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-sghys8f7o1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-sghys8f7o1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-sghys8f7o1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-sghys8f7o1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-sghys8f7o1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-sghys8f7o1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-sghys8f7o1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-sghys8f7o1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-sghys8f7o1] { display: block; }
.hide-on-cards[b-sghys8f7o1] { display: none !important; }
.show-on-cards[b-sghys8f7o1] { display: grid; }
.hide-on-grid[b-sghys8f7o1] { display: none !important; }

/* Badges */
.badge[b-sghys8f7o1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-sghys8f7o1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-sghys8f7o1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-sghys8f7o1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-sghys8f7o1] { text-align: center; }
.text-muted[b-sghys8f7o1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-sghys8f7o1], .crud-empty-state[b-sghys8f7o1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-sghys8f7o1] { font-size: 2rem; }
.crud-spinner[b-sghys8f7o1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-sghys8f7o1 0.6s linear infinite; }
.crud-spinner-sm[b-sghys8f7o1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-sghys8f7o1 0.6s linear infinite; }
@keyframes spin-b-sghys8f7o1 { to { transform: rotate(360deg); } }
.spin[b-sghys8f7o1] { animation: spin-b-sghys8f7o1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-sghys8f7o1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-sghys8f7o1 0.15s ease-out; }
.modal-container[b-sghys8f7o1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-sghys8f7o1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-sghys8f7o1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-sghys8f7o1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-sghys8f7o1] { max-width: 420px; }
@keyframes fadeIn-b-sghys8f7o1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-sghys8f7o1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-sghys8f7o1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-sghys8f7o1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-sghys8f7o1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-sghys8f7o1] { color: #dc2626; }
.modal-close[b-sghys8f7o1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-sghys8f7o1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-sghys8f7o1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-sghys8f7o1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-sghys8f7o1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-sghys8f7o1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-sghys8f7o1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-sghys8f7o1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-sghys8f7o1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-sghys8f7o1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-sghys8f7o1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-sghys8f7o1] { flex: 2; }
.form-group label[b-sghys8f7o1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-sghys8f7o1], .form-group select[b-sghys8f7o1], .form-textarea[b-sghys8f7o1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-sghys8f7o1], .form-group select:focus[b-sghys8f7o1], .form-textarea:focus[b-sghys8f7o1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-sghys8f7o1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-sghys8f7o1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-sghys8f7o1] { flex: 1; display: flex; align-items: center; }
.form-check[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-sghys8f7o1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-sghys8f7o1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-sghys8f7o1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-sghys8f7o1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-sghys8f7o1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-sghys8f7o1] { font-size: 3rem; }
.photo-placeholder span[b-sghys8f7o1] { font-size: 0.78rem; }
.photo-actions[b-sghys8f7o1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-sghys8f7o1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-sghys8f7o1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-sghys8f7o1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-sghys8f7o1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-sghys8f7o1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-sghys8f7o1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-sghys8f7o1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-sghys8f7o1] { filter: brightness(1.15); transform: scale(1.05); }
[b-sghys8f7o1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-sghys8f7o1] { padding: 0.75rem; }
    .crud-header[b-sghys8f7o1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-sghys8f7o1] { font-size: 1.1rem; }
    .btn-text[b-sghys8f7o1] { display: none; }
    .form-row[b-sghys8f7o1] { flex-direction: column; }
    .form-row-4[b-sghys8f7o1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-sghys8f7o1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-sghys8f7o1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-sghys8f7o1] { padding: 0.75rem; }
    .modal-tabs[b-sghys8f7o1] { overflow-x: auto; }
    .modal-tab[b-sghys8f7o1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-sghys8f7o1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-sghys8f7o1] { display: grid !important; }
    .crud-cards-wrapper[b-sghys8f7o1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-sghys8f7o1] { grid-template-columns: 1fr; }
    .card-details[b-sghys8f7o1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-sghys8f7o1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-sghys8f7o1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-sghys8f7o1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-sghys8f7o1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmconcesion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-i17h6d3wse] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-i17h6d3wse 0.3s ease-out; }
@keyframes slideUp-b-i17h6d3wse { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-i17h6d3wse] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-i17h6d3wse] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-i17h6d3wse] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-i17h6d3wse] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-i17h6d3wse] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-i17h6d3wse] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-i17h6d3wse] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-i17h6d3wse] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-i17h6d3wse] { filter: brightness(1.1); }
.btn-outline[b-i17h6d3wse] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-i17h6d3wse] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-i17h6d3wse] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-i17h6d3wse] { filter: brightness(1.1); }
.btn-icon[b-i17h6d3wse] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-i17h6d3wse] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-i17h6d3wse] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-i17h6d3wse] { color: #ef4444; }
.btn-delete:hover[b-i17h6d3wse] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-i17h6d3wse] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-i17h6d3wse] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-i17h6d3wse] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-i17h6d3wse] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-i17h6d3wse] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-i17h6d3wse] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-i17h6d3wse] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-i17h6d3wse] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-i17h6d3wse] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-i17h6d3wse] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-i17h6d3wse] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-i17h6d3wse] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-i17h6d3wse] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-i17h6d3wse] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-i17h6d3wse] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-i17h6d3wse] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-i17h6d3wse] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-i17h6d3wse] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-i17h6d3wse] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-i17h6d3wse] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-i17h6d3wse] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-i17h6d3wse] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-i17h6d3wse] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-i17h6d3wse] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-i17h6d3wse] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-i17h6d3wse] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-i17h6d3wse] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-i17h6d3wse] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-i17h6d3wse] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-i17h6d3wse] { display: block; }
.hide-on-cards[b-i17h6d3wse] { display: none !important; }
.show-on-cards[b-i17h6d3wse] { display: grid; }
.hide-on-grid[b-i17h6d3wse] { display: none !important; }

/* Badges */
.badge[b-i17h6d3wse] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-i17h6d3wse] { background: #ecfdf5; color: #065f46; }
.badge-no[b-i17h6d3wse] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-i17h6d3wse] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-i17h6d3wse] { text-align: center; }
.text-muted[b-i17h6d3wse] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-i17h6d3wse], .crud-empty-state[b-i17h6d3wse] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-i17h6d3wse] { font-size: 2rem; }
.crud-spinner[b-i17h6d3wse] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-i17h6d3wse 0.6s linear infinite; }
.crud-spinner-sm[b-i17h6d3wse] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-i17h6d3wse 0.6s linear infinite; }
@keyframes spin-b-i17h6d3wse { to { transform: rotate(360deg); } }
.spin[b-i17h6d3wse] { animation: spin-b-i17h6d3wse 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-i17h6d3wse] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-i17h6d3wse 0.15s ease-out; }
.modal-container[b-i17h6d3wse] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-i17h6d3wse] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-i17h6d3wse 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-i17h6d3wse] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-i17h6d3wse] { max-width: 420px; }
@keyframes fadeIn-b-i17h6d3wse { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-i17h6d3wse { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-i17h6d3wse] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-i17h6d3wse] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-i17h6d3wse] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-i17h6d3wse] { color: #dc2626; }
.modal-close[b-i17h6d3wse] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-i17h6d3wse] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-i17h6d3wse] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-i17h6d3wse] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-i17h6d3wse] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-i17h6d3wse] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-i17h6d3wse] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-i17h6d3wse] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-i17h6d3wse] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-i17h6d3wse] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-i17h6d3wse] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-i17h6d3wse] { flex: 2; }
.form-group label[b-i17h6d3wse] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-i17h6d3wse], .form-group select[b-i17h6d3wse], .form-textarea[b-i17h6d3wse] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-i17h6d3wse], .form-group select:focus[b-i17h6d3wse], .form-textarea:focus[b-i17h6d3wse] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-i17h6d3wse] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-i17h6d3wse] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-i17h6d3wse] { flex: 1; display: flex; align-items: center; }
.form-check[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-i17h6d3wse] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-i17h6d3wse] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-i17h6d3wse] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-i17h6d3wse] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-i17h6d3wse] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-i17h6d3wse] { font-size: 3rem; }
.photo-placeholder span[b-i17h6d3wse] { font-size: 0.78rem; }
.photo-actions[b-i17h6d3wse] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-i17h6d3wse] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-i17h6d3wse] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-i17h6d3wse] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-i17h6d3wse] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-i17h6d3wse] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-i17h6d3wse] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-i17h6d3wse] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-i17h6d3wse] { filter: brightness(1.15); transform: scale(1.05); }
[b-i17h6d3wse] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-i17h6d3wse] { padding: 0.75rem; }
    .crud-header[b-i17h6d3wse] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-i17h6d3wse] { font-size: 1.1rem; }
    .btn-text[b-i17h6d3wse] { display: none; }
    .form-row[b-i17h6d3wse] { flex-direction: column; }
    .form-row-4[b-i17h6d3wse] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-i17h6d3wse] { width: 98%; max-height: 95vh; }
    .modal-lg[b-i17h6d3wse] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-i17h6d3wse] { padding: 0.75rem; }
    .modal-tabs[b-i17h6d3wse] { overflow-x: auto; }
    .modal-tab[b-i17h6d3wse] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-i17h6d3wse] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-i17h6d3wse] { display: grid !important; }
    .crud-cards-wrapper[b-i17h6d3wse] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-i17h6d3wse] { grid-template-columns: 1fr; }
    .card-details[b-i17h6d3wse] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-i17h6d3wse] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-i17h6d3wse] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-i17h6d3wse] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-i17h6d3wse] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmcosto_beneficio.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-jry3zn0w2l] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jry3zn0w2l 0.3s ease-out; }
@keyframes slideUp-b-jry3zn0w2l { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jry3zn0w2l] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jry3zn0w2l] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jry3zn0w2l] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jry3zn0w2l] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jry3zn0w2l] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jry3zn0w2l] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jry3zn0w2l] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jry3zn0w2l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jry3zn0w2l] { filter: brightness(1.1); }
.btn-outline[b-jry3zn0w2l] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jry3zn0w2l] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jry3zn0w2l] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jry3zn0w2l] { filter: brightness(1.1); }
.btn-icon[b-jry3zn0w2l] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jry3zn0w2l] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jry3zn0w2l] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jry3zn0w2l] { color: #ef4444; }
.btn-delete:hover[b-jry3zn0w2l] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-jry3zn0w2l] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jry3zn0w2l] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jry3zn0w2l] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jry3zn0w2l] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jry3zn0w2l] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jry3zn0w2l] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-jry3zn0w2l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jry3zn0w2l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-jry3zn0w2l] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jry3zn0w2l] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jry3zn0w2l] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jry3zn0w2l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jry3zn0w2l] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jry3zn0w2l] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jry3zn0w2l] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-jry3zn0w2l] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-jry3zn0w2l] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-jry3zn0w2l] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-jry3zn0w2l] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-jry3zn0w2l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-jry3zn0w2l] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-jry3zn0w2l] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-jry3zn0w2l] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-jry3zn0w2l] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-jry3zn0w2l] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-jry3zn0w2l] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-jry3zn0w2l] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-jry3zn0w2l] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-jry3zn0w2l] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-jry3zn0w2l] { display: block; }
.hide-on-cards[b-jry3zn0w2l] { display: none !important; }
.show-on-cards[b-jry3zn0w2l] { display: grid; }
.hide-on-grid[b-jry3zn0w2l] { display: none !important; }

/* Badges */
.badge[b-jry3zn0w2l] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jry3zn0w2l] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jry3zn0w2l] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-jry3zn0w2l] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jry3zn0w2l] { text-align: center; }
.text-muted[b-jry3zn0w2l] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jry3zn0w2l], .crud-empty-state[b-jry3zn0w2l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jry3zn0w2l] { font-size: 2rem; }
.crud-spinner[b-jry3zn0w2l] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jry3zn0w2l 0.6s linear infinite; }
.crud-spinner-sm[b-jry3zn0w2l] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jry3zn0w2l 0.6s linear infinite; }
@keyframes spin-b-jry3zn0w2l { to { transform: rotate(360deg); } }
.spin[b-jry3zn0w2l] { animation: spin-b-jry3zn0w2l 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-jry3zn0w2l] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jry3zn0w2l 0.15s ease-out; }
.modal-container[b-jry3zn0w2l] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jry3zn0w2l] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jry3zn0w2l 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-jry3zn0w2l] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-jry3zn0w2l] { max-width: 420px; }
@keyframes fadeIn-b-jry3zn0w2l { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jry3zn0w2l { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jry3zn0w2l] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jry3zn0w2l] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-jry3zn0w2l] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-jry3zn0w2l] { color: #dc2626; }
.modal-close[b-jry3zn0w2l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jry3zn0w2l] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jry3zn0w2l] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jry3zn0w2l] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jry3zn0w2l] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-jry3zn0w2l] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jry3zn0w2l] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jry3zn0w2l] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jry3zn0w2l] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jry3zn0w2l] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jry3zn0w2l] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jry3zn0w2l] { flex: 2; }
.form-group label[b-jry3zn0w2l] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jry3zn0w2l], .form-group select[b-jry3zn0w2l], .form-textarea[b-jry3zn0w2l] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jry3zn0w2l], .form-group select:focus[b-jry3zn0w2l], .form-textarea:focus[b-jry3zn0w2l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jry3zn0w2l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jry3zn0w2l] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jry3zn0w2l] { flex: 1; display: flex; align-items: center; }
.form-check[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jry3zn0w2l] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-jry3zn0w2l] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-jry3zn0w2l] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-jry3zn0w2l] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-jry3zn0w2l] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-jry3zn0w2l] { font-size: 3rem; }
.photo-placeholder span[b-jry3zn0w2l] { font-size: 0.78rem; }
.photo-actions[b-jry3zn0w2l] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-jry3zn0w2l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-jry3zn0w2l] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-jry3zn0w2l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-jry3zn0w2l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-jry3zn0w2l] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-jry3zn0w2l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-jry3zn0w2l] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-jry3zn0w2l] { filter: brightness(1.15); transform: scale(1.05); }
[b-jry3zn0w2l] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jry3zn0w2l] { padding: 0.75rem; }
    .crud-header[b-jry3zn0w2l] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jry3zn0w2l] { font-size: 1.1rem; }
    .btn-text[b-jry3zn0w2l] { display: none; }
    .form-row[b-jry3zn0w2l] { flex-direction: column; }
    .form-row-4[b-jry3zn0w2l] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jry3zn0w2l] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jry3zn0w2l] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-jry3zn0w2l] { padding: 0.75rem; }
    .modal-tabs[b-jry3zn0w2l] { overflow-x: auto; }
    .modal-tab[b-jry3zn0w2l] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-jry3zn0w2l] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-jry3zn0w2l] { display: grid !important; }
    .crud-cards-wrapper[b-jry3zn0w2l] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-jry3zn0w2l] { grid-template-columns: 1fr; }
    .card-details[b-jry3zn0w2l] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-jry3zn0w2l] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jry3zn0w2l] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jry3zn0w2l] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jry3zn0w2l] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmcotizacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-hqhgrdwnql] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-hqhgrdwnql 0.3s ease-out; }
@keyframes slideUp-b-hqhgrdwnql { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-hqhgrdwnql] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-hqhgrdwnql] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-hqhgrdwnql] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-hqhgrdwnql] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-hqhgrdwnql] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-hqhgrdwnql] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-hqhgrdwnql] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-hqhgrdwnql] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-hqhgrdwnql] { filter: brightness(1.1); }
.btn-outline[b-hqhgrdwnql] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-hqhgrdwnql] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-hqhgrdwnql] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-hqhgrdwnql] { filter: brightness(1.1); }
.btn-icon[b-hqhgrdwnql] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-hqhgrdwnql] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-hqhgrdwnql] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-hqhgrdwnql] { color: #ef4444; }
.btn-delete:hover[b-hqhgrdwnql] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-hqhgrdwnql] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-hqhgrdwnql] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-hqhgrdwnql] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-hqhgrdwnql] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-hqhgrdwnql] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-hqhgrdwnql] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-hqhgrdwnql] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-hqhgrdwnql] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-hqhgrdwnql] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-hqhgrdwnql] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-hqhgrdwnql] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-hqhgrdwnql] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-hqhgrdwnql] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-hqhgrdwnql] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-hqhgrdwnql] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-hqhgrdwnql] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-hqhgrdwnql] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-hqhgrdwnql] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-hqhgrdwnql] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-hqhgrdwnql] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-hqhgrdwnql] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-hqhgrdwnql] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-hqhgrdwnql] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-hqhgrdwnql] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-hqhgrdwnql] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-hqhgrdwnql] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-hqhgrdwnql] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-hqhgrdwnql] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-hqhgrdwnql] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-hqhgrdwnql] { display: block; }
.hide-on-cards[b-hqhgrdwnql] { display: none !important; }
.show-on-cards[b-hqhgrdwnql] { display: grid; }
.hide-on-grid[b-hqhgrdwnql] { display: none !important; }

/* Badges */
.badge[b-hqhgrdwnql] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-hqhgrdwnql] { background: #ecfdf5; color: #065f46; }
.badge-no[b-hqhgrdwnql] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-hqhgrdwnql] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-hqhgrdwnql] { text-align: center; }
.text-muted[b-hqhgrdwnql] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-hqhgrdwnql], .crud-empty-state[b-hqhgrdwnql] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-hqhgrdwnql] { font-size: 2rem; }
.crud-spinner[b-hqhgrdwnql] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-hqhgrdwnql 0.6s linear infinite; }
.crud-spinner-sm[b-hqhgrdwnql] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-hqhgrdwnql 0.6s linear infinite; }
@keyframes spin-b-hqhgrdwnql { to { transform: rotate(360deg); } }
.spin[b-hqhgrdwnql] { animation: spin-b-hqhgrdwnql 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-hqhgrdwnql] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-hqhgrdwnql 0.15s ease-out; }
.modal-container[b-hqhgrdwnql] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-hqhgrdwnql] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-hqhgrdwnql 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-hqhgrdwnql] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-hqhgrdwnql] { max-width: 420px; }
@keyframes fadeIn-b-hqhgrdwnql { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-hqhgrdwnql { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-hqhgrdwnql] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-hqhgrdwnql] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-hqhgrdwnql] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-hqhgrdwnql] { color: #dc2626; }
.modal-close[b-hqhgrdwnql] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-hqhgrdwnql] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-hqhgrdwnql] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-hqhgrdwnql] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-hqhgrdwnql] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-hqhgrdwnql] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-hqhgrdwnql] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-hqhgrdwnql] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-hqhgrdwnql] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-hqhgrdwnql] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-hqhgrdwnql] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-hqhgrdwnql] { flex: 2; }
.form-group label[b-hqhgrdwnql] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-hqhgrdwnql], .form-group select[b-hqhgrdwnql], .form-textarea[b-hqhgrdwnql] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-hqhgrdwnql], .form-group select:focus[b-hqhgrdwnql], .form-textarea:focus[b-hqhgrdwnql] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-hqhgrdwnql] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-hqhgrdwnql] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-hqhgrdwnql] { flex: 1; display: flex; align-items: center; }
.form-check[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-hqhgrdwnql] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-hqhgrdwnql] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-hqhgrdwnql] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-hqhgrdwnql] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-hqhgrdwnql] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-hqhgrdwnql] { font-size: 3rem; }
.photo-placeholder span[b-hqhgrdwnql] { font-size: 0.78rem; }
.photo-actions[b-hqhgrdwnql] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-hqhgrdwnql] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-hqhgrdwnql] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-hqhgrdwnql] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-hqhgrdwnql] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-hqhgrdwnql] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-hqhgrdwnql] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-hqhgrdwnql] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-hqhgrdwnql] { filter: brightness(1.15); transform: scale(1.05); }
[b-hqhgrdwnql] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-hqhgrdwnql] { padding: 0.75rem; }
    .crud-header[b-hqhgrdwnql] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-hqhgrdwnql] { font-size: 1.1rem; }
    .btn-text[b-hqhgrdwnql] { display: none; }
    .form-row[b-hqhgrdwnql] { flex-direction: column; }
    .form-row-4[b-hqhgrdwnql] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-hqhgrdwnql] { width: 98%; max-height: 95vh; }
    .modal-lg[b-hqhgrdwnql] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-hqhgrdwnql] { padding: 0.75rem; }
    .modal-tabs[b-hqhgrdwnql] { overflow-x: auto; }
    .modal-tab[b-hqhgrdwnql] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-hqhgrdwnql] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-hqhgrdwnql] { display: grid !important; }
    .crud-cards-wrapper[b-hqhgrdwnql] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-hqhgrdwnql] { grid-template-columns: 1fr; }
    .card-details[b-hqhgrdwnql] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-hqhgrdwnql] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-hqhgrdwnql] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-hqhgrdwnql] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-hqhgrdwnql] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmcotizacionservicios.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0kvvyjqoj2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0kvvyjqoj2 0.3s ease-out; }
@keyframes slideUp-b-0kvvyjqoj2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0kvvyjqoj2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0kvvyjqoj2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0kvvyjqoj2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0kvvyjqoj2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0kvvyjqoj2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0kvvyjqoj2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0kvvyjqoj2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0kvvyjqoj2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0kvvyjqoj2] { filter: brightness(1.1); }
.btn-outline[b-0kvvyjqoj2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0kvvyjqoj2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0kvvyjqoj2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0kvvyjqoj2] { filter: brightness(1.1); }
.btn-icon[b-0kvvyjqoj2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0kvvyjqoj2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0kvvyjqoj2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0kvvyjqoj2] { color: #ef4444; }
.btn-delete:hover[b-0kvvyjqoj2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0kvvyjqoj2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0kvvyjqoj2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0kvvyjqoj2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0kvvyjqoj2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0kvvyjqoj2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0kvvyjqoj2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0kvvyjqoj2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0kvvyjqoj2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0kvvyjqoj2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0kvvyjqoj2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0kvvyjqoj2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0kvvyjqoj2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0kvvyjqoj2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0kvvyjqoj2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0kvvyjqoj2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0kvvyjqoj2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0kvvyjqoj2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0kvvyjqoj2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0kvvyjqoj2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0kvvyjqoj2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0kvvyjqoj2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0kvvyjqoj2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0kvvyjqoj2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0kvvyjqoj2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0kvvyjqoj2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0kvvyjqoj2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0kvvyjqoj2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0kvvyjqoj2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0kvvyjqoj2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0kvvyjqoj2] { display: block; }
.hide-on-cards[b-0kvvyjqoj2] { display: none !important; }
.show-on-cards[b-0kvvyjqoj2] { display: grid; }
.hide-on-grid[b-0kvvyjqoj2] { display: none !important; }

/* Badges */
.badge[b-0kvvyjqoj2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0kvvyjqoj2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0kvvyjqoj2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0kvvyjqoj2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0kvvyjqoj2] { text-align: center; }
.text-muted[b-0kvvyjqoj2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0kvvyjqoj2], .crud-empty-state[b-0kvvyjqoj2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0kvvyjqoj2] { font-size: 2rem; }
.crud-spinner[b-0kvvyjqoj2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0kvvyjqoj2 0.6s linear infinite; }
.crud-spinner-sm[b-0kvvyjqoj2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0kvvyjqoj2 0.6s linear infinite; }
@keyframes spin-b-0kvvyjqoj2 { to { transform: rotate(360deg); } }
.spin[b-0kvvyjqoj2] { animation: spin-b-0kvvyjqoj2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0kvvyjqoj2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0kvvyjqoj2 0.15s ease-out; }
.modal-container[b-0kvvyjqoj2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0kvvyjqoj2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0kvvyjqoj2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0kvvyjqoj2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0kvvyjqoj2] { max-width: 420px; }
@keyframes fadeIn-b-0kvvyjqoj2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0kvvyjqoj2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0kvvyjqoj2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0kvvyjqoj2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0kvvyjqoj2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0kvvyjqoj2] { color: #dc2626; }
.modal-close[b-0kvvyjqoj2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0kvvyjqoj2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0kvvyjqoj2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0kvvyjqoj2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0kvvyjqoj2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0kvvyjqoj2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0kvvyjqoj2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0kvvyjqoj2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0kvvyjqoj2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0kvvyjqoj2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0kvvyjqoj2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0kvvyjqoj2] { flex: 2; }
.form-group label[b-0kvvyjqoj2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0kvvyjqoj2], .form-group select[b-0kvvyjqoj2], .form-textarea[b-0kvvyjqoj2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0kvvyjqoj2], .form-group select:focus[b-0kvvyjqoj2], .form-textarea:focus[b-0kvvyjqoj2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0kvvyjqoj2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0kvvyjqoj2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0kvvyjqoj2] { flex: 1; display: flex; align-items: center; }
.form-check[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0kvvyjqoj2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0kvvyjqoj2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0kvvyjqoj2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0kvvyjqoj2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0kvvyjqoj2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0kvvyjqoj2] { font-size: 3rem; }
.photo-placeholder span[b-0kvvyjqoj2] { font-size: 0.78rem; }
.photo-actions[b-0kvvyjqoj2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0kvvyjqoj2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0kvvyjqoj2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0kvvyjqoj2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0kvvyjqoj2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0kvvyjqoj2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0kvvyjqoj2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0kvvyjqoj2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0kvvyjqoj2] { filter: brightness(1.15); transform: scale(1.05); }
[b-0kvvyjqoj2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0kvvyjqoj2] { padding: 0.75rem; }
    .crud-header[b-0kvvyjqoj2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0kvvyjqoj2] { font-size: 1.1rem; }
    .btn-text[b-0kvvyjqoj2] { display: none; }
    .form-row[b-0kvvyjqoj2] { flex-direction: column; }
    .form-row-4[b-0kvvyjqoj2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0kvvyjqoj2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0kvvyjqoj2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0kvvyjqoj2] { padding: 0.75rem; }
    .modal-tabs[b-0kvvyjqoj2] { overflow-x: auto; }
    .modal-tab[b-0kvvyjqoj2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0kvvyjqoj2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0kvvyjqoj2] { display: grid !important; }
    .crud-cards-wrapper[b-0kvvyjqoj2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0kvvyjqoj2] { grid-template-columns: 1fr; }
    .card-details[b-0kvvyjqoj2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0kvvyjqoj2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0kvvyjqoj2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0kvvyjqoj2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0kvvyjqoj2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmdevolucionft.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-sijjo8hke2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-sijjo8hke2 0.3s ease-out; }
@keyframes slideUp-b-sijjo8hke2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-sijjo8hke2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-sijjo8hke2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-sijjo8hke2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-sijjo8hke2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-sijjo8hke2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-sijjo8hke2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-sijjo8hke2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-sijjo8hke2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-sijjo8hke2] { filter: brightness(1.1); }
.btn-outline[b-sijjo8hke2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-sijjo8hke2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-sijjo8hke2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-sijjo8hke2] { filter: brightness(1.1); }
.btn-icon[b-sijjo8hke2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-sijjo8hke2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-sijjo8hke2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-sijjo8hke2] { color: #ef4444; }
.btn-delete:hover[b-sijjo8hke2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-sijjo8hke2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-sijjo8hke2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-sijjo8hke2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-sijjo8hke2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-sijjo8hke2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-sijjo8hke2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-sijjo8hke2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-sijjo8hke2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-sijjo8hke2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-sijjo8hke2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-sijjo8hke2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-sijjo8hke2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-sijjo8hke2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-sijjo8hke2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-sijjo8hke2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-sijjo8hke2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-sijjo8hke2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-sijjo8hke2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-sijjo8hke2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-sijjo8hke2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-sijjo8hke2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-sijjo8hke2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-sijjo8hke2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-sijjo8hke2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-sijjo8hke2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-sijjo8hke2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-sijjo8hke2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-sijjo8hke2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-sijjo8hke2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-sijjo8hke2] { display: block; }
.hide-on-cards[b-sijjo8hke2] { display: none !important; }
.show-on-cards[b-sijjo8hke2] { display: grid; }
.hide-on-grid[b-sijjo8hke2] { display: none !important; }

/* Badges */
.badge[b-sijjo8hke2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-sijjo8hke2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-sijjo8hke2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-sijjo8hke2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-sijjo8hke2] { text-align: center; }
.text-muted[b-sijjo8hke2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-sijjo8hke2], .crud-empty-state[b-sijjo8hke2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-sijjo8hke2] { font-size: 2rem; }
.crud-spinner[b-sijjo8hke2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-sijjo8hke2 0.6s linear infinite; }
.crud-spinner-sm[b-sijjo8hke2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-sijjo8hke2 0.6s linear infinite; }
@keyframes spin-b-sijjo8hke2 { to { transform: rotate(360deg); } }
.spin[b-sijjo8hke2] { animation: spin-b-sijjo8hke2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-sijjo8hke2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-sijjo8hke2 0.15s ease-out; }
.modal-container[b-sijjo8hke2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-sijjo8hke2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-sijjo8hke2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-sijjo8hke2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-sijjo8hke2] { max-width: 420px; }
@keyframes fadeIn-b-sijjo8hke2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-sijjo8hke2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-sijjo8hke2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-sijjo8hke2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-sijjo8hke2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-sijjo8hke2] { color: #dc2626; }
.modal-close[b-sijjo8hke2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-sijjo8hke2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-sijjo8hke2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-sijjo8hke2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-sijjo8hke2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-sijjo8hke2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-sijjo8hke2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-sijjo8hke2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-sijjo8hke2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-sijjo8hke2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-sijjo8hke2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-sijjo8hke2] { flex: 2; }
.form-group label[b-sijjo8hke2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-sijjo8hke2], .form-group select[b-sijjo8hke2], .form-textarea[b-sijjo8hke2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-sijjo8hke2], .form-group select:focus[b-sijjo8hke2], .form-textarea:focus[b-sijjo8hke2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-sijjo8hke2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-sijjo8hke2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-sijjo8hke2] { flex: 1; display: flex; align-items: center; }
.form-check[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-sijjo8hke2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-sijjo8hke2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-sijjo8hke2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-sijjo8hke2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-sijjo8hke2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-sijjo8hke2] { font-size: 3rem; }
.photo-placeholder span[b-sijjo8hke2] { font-size: 0.78rem; }
.photo-actions[b-sijjo8hke2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-sijjo8hke2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-sijjo8hke2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-sijjo8hke2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-sijjo8hke2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-sijjo8hke2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-sijjo8hke2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-sijjo8hke2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-sijjo8hke2] { filter: brightness(1.15); transform: scale(1.05); }
[b-sijjo8hke2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-sijjo8hke2] { padding: 0.75rem; }
    .crud-header[b-sijjo8hke2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-sijjo8hke2] { font-size: 1.1rem; }
    .btn-text[b-sijjo8hke2] { display: none; }
    .form-row[b-sijjo8hke2] { flex-direction: column; }
    .form-row-4[b-sijjo8hke2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-sijjo8hke2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-sijjo8hke2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-sijjo8hke2] { padding: 0.75rem; }
    .modal-tabs[b-sijjo8hke2] { overflow-x: auto; }
    .modal-tab[b-sijjo8hke2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-sijjo8hke2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-sijjo8hke2] { display: grid !important; }
    .crud-cards-wrapper[b-sijjo8hke2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-sijjo8hke2] { grid-template-columns: 1fr; }
    .card-details[b-sijjo8hke2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-sijjo8hke2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-sijjo8hke2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-sijjo8hke2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-sijjo8hke2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmexistencia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-79qy9ewztt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-79qy9ewztt 0.3s ease-out; }
@keyframes slideUp-b-79qy9ewztt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-79qy9ewztt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-79qy9ewztt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-79qy9ewztt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-79qy9ewztt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-79qy9ewztt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-79qy9ewztt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-79qy9ewztt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-79qy9ewztt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-79qy9ewztt] { filter: brightness(1.1); }
.btn-outline[b-79qy9ewztt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-79qy9ewztt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-79qy9ewztt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-79qy9ewztt] { filter: brightness(1.1); }
.btn-icon[b-79qy9ewztt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-79qy9ewztt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-79qy9ewztt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-79qy9ewztt] { color: #ef4444; }
.btn-delete:hover[b-79qy9ewztt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-79qy9ewztt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-79qy9ewztt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-79qy9ewztt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-79qy9ewztt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-79qy9ewztt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-79qy9ewztt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-79qy9ewztt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-79qy9ewztt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-79qy9ewztt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-79qy9ewztt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-79qy9ewztt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-79qy9ewztt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-79qy9ewztt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-79qy9ewztt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-79qy9ewztt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-79qy9ewztt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-79qy9ewztt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-79qy9ewztt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-79qy9ewztt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-79qy9ewztt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-79qy9ewztt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-79qy9ewztt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-79qy9ewztt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-79qy9ewztt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-79qy9ewztt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-79qy9ewztt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-79qy9ewztt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-79qy9ewztt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-79qy9ewztt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-79qy9ewztt] { display: block; }
.hide-on-cards[b-79qy9ewztt] { display: none !important; }
.show-on-cards[b-79qy9ewztt] { display: grid; }
.hide-on-grid[b-79qy9ewztt] { display: none !important; }

/* Badges */
.badge[b-79qy9ewztt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-79qy9ewztt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-79qy9ewztt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-79qy9ewztt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-79qy9ewztt] { text-align: center; }
.text-muted[b-79qy9ewztt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-79qy9ewztt], .crud-empty-state[b-79qy9ewztt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-79qy9ewztt] { font-size: 2rem; }
.crud-spinner[b-79qy9ewztt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-79qy9ewztt 0.6s linear infinite; }
.crud-spinner-sm[b-79qy9ewztt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-79qy9ewztt 0.6s linear infinite; }
@keyframes spin-b-79qy9ewztt { to { transform: rotate(360deg); } }
.spin[b-79qy9ewztt] { animation: spin-b-79qy9ewztt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-79qy9ewztt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-79qy9ewztt 0.15s ease-out; }
.modal-container[b-79qy9ewztt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-79qy9ewztt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-79qy9ewztt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-79qy9ewztt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-79qy9ewztt] { max-width: 420px; }
@keyframes fadeIn-b-79qy9ewztt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-79qy9ewztt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-79qy9ewztt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-79qy9ewztt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-79qy9ewztt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-79qy9ewztt] { color: #dc2626; }
.modal-close[b-79qy9ewztt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-79qy9ewztt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-79qy9ewztt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-79qy9ewztt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-79qy9ewztt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-79qy9ewztt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-79qy9ewztt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-79qy9ewztt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-79qy9ewztt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-79qy9ewztt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-79qy9ewztt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-79qy9ewztt] { flex: 2; }
.form-group label[b-79qy9ewztt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-79qy9ewztt], .form-group select[b-79qy9ewztt], .form-textarea[b-79qy9ewztt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-79qy9ewztt], .form-group select:focus[b-79qy9ewztt], .form-textarea:focus[b-79qy9ewztt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-79qy9ewztt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-79qy9ewztt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-79qy9ewztt] { flex: 1; display: flex; align-items: center; }
.form-check[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-79qy9ewztt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-79qy9ewztt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-79qy9ewztt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-79qy9ewztt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-79qy9ewztt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-79qy9ewztt] { font-size: 3rem; }
.photo-placeholder span[b-79qy9ewztt] { font-size: 0.78rem; }
.photo-actions[b-79qy9ewztt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-79qy9ewztt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-79qy9ewztt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-79qy9ewztt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-79qy9ewztt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-79qy9ewztt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-79qy9ewztt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-79qy9ewztt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-79qy9ewztt] { filter: brightness(1.15); transform: scale(1.05); }
[b-79qy9ewztt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-79qy9ewztt] { padding: 0.75rem; }
    .crud-header[b-79qy9ewztt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-79qy9ewztt] { font-size: 1.1rem; }
    .btn-text[b-79qy9ewztt] { display: none; }
    .form-row[b-79qy9ewztt] { flex-direction: column; }
    .form-row-4[b-79qy9ewztt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-79qy9ewztt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-79qy9ewztt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-79qy9ewztt] { padding: 0.75rem; }
    .modal-tabs[b-79qy9ewztt] { overflow-x: auto; }
    .modal-tab[b-79qy9ewztt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-79qy9ewztt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-79qy9ewztt] { display: grid !important; }
    .crud-cards-wrapper[b-79qy9ewztt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-79qy9ewztt] { grid-template-columns: 1fr; }
    .card-details[b-79qy9ewztt] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-79qy9ewztt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-79qy9ewztt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-79qy9ewztt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-79qy9ewztt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmfactura_del_dia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6ub2y3r6lx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6ub2y3r6lx 0.3s ease-out; }
@keyframes slideUp-b-6ub2y3r6lx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6ub2y3r6lx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6ub2y3r6lx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6ub2y3r6lx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6ub2y3r6lx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6ub2y3r6lx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6ub2y3r6lx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6ub2y3r6lx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6ub2y3r6lx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6ub2y3r6lx] { filter: brightness(1.1); }
.btn-outline[b-6ub2y3r6lx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6ub2y3r6lx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6ub2y3r6lx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6ub2y3r6lx] { filter: brightness(1.1); }
.btn-icon[b-6ub2y3r6lx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6ub2y3r6lx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6ub2y3r6lx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6ub2y3r6lx] { color: #ef4444; }
.btn-delete:hover[b-6ub2y3r6lx] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6ub2y3r6lx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6ub2y3r6lx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6ub2y3r6lx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6ub2y3r6lx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6ub2y3r6lx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6ub2y3r6lx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6ub2y3r6lx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6ub2y3r6lx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6ub2y3r6lx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6ub2y3r6lx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6ub2y3r6lx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6ub2y3r6lx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6ub2y3r6lx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6ub2y3r6lx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6ub2y3r6lx] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6ub2y3r6lx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6ub2y3r6lx] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6ub2y3r6lx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6ub2y3r6lx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6ub2y3r6lx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6ub2y3r6lx] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6ub2y3r6lx] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6ub2y3r6lx] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6ub2y3r6lx] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6ub2y3r6lx] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6ub2y3r6lx] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6ub2y3r6lx] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6ub2y3r6lx] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6ub2y3r6lx] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6ub2y3r6lx] { display: block; }
.hide-on-cards[b-6ub2y3r6lx] { display: none !important; }
.show-on-cards[b-6ub2y3r6lx] { display: grid; }
.hide-on-grid[b-6ub2y3r6lx] { display: none !important; }

/* Badges */
.badge[b-6ub2y3r6lx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6ub2y3r6lx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6ub2y3r6lx] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6ub2y3r6lx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6ub2y3r6lx] { text-align: center; }
.text-muted[b-6ub2y3r6lx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6ub2y3r6lx], .crud-empty-state[b-6ub2y3r6lx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6ub2y3r6lx] { font-size: 2rem; }
.crud-spinner[b-6ub2y3r6lx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6ub2y3r6lx 0.6s linear infinite; }
.crud-spinner-sm[b-6ub2y3r6lx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6ub2y3r6lx 0.6s linear infinite; }
@keyframes spin-b-6ub2y3r6lx { to { transform: rotate(360deg); } }
.spin[b-6ub2y3r6lx] { animation: spin-b-6ub2y3r6lx 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6ub2y3r6lx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6ub2y3r6lx 0.15s ease-out; }
.modal-container[b-6ub2y3r6lx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6ub2y3r6lx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6ub2y3r6lx 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6ub2y3r6lx] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6ub2y3r6lx] { max-width: 420px; }
@keyframes fadeIn-b-6ub2y3r6lx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6ub2y3r6lx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6ub2y3r6lx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6ub2y3r6lx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6ub2y3r6lx] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6ub2y3r6lx] { color: #dc2626; }
.modal-close[b-6ub2y3r6lx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6ub2y3r6lx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6ub2y3r6lx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6ub2y3r6lx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6ub2y3r6lx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6ub2y3r6lx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6ub2y3r6lx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6ub2y3r6lx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6ub2y3r6lx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6ub2y3r6lx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6ub2y3r6lx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6ub2y3r6lx] { flex: 2; }
.form-group label[b-6ub2y3r6lx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6ub2y3r6lx], .form-group select[b-6ub2y3r6lx], .form-textarea[b-6ub2y3r6lx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6ub2y3r6lx], .form-group select:focus[b-6ub2y3r6lx], .form-textarea:focus[b-6ub2y3r6lx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6ub2y3r6lx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6ub2y3r6lx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6ub2y3r6lx] { flex: 1; display: flex; align-items: center; }
.form-check[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6ub2y3r6lx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6ub2y3r6lx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6ub2y3r6lx] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6ub2y3r6lx] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6ub2y3r6lx] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6ub2y3r6lx] { font-size: 3rem; }
.photo-placeholder span[b-6ub2y3r6lx] { font-size: 0.78rem; }
.photo-actions[b-6ub2y3r6lx] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6ub2y3r6lx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6ub2y3r6lx] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6ub2y3r6lx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6ub2y3r6lx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6ub2y3r6lx] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6ub2y3r6lx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6ub2y3r6lx] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6ub2y3r6lx] { filter: brightness(1.15); transform: scale(1.05); }
[b-6ub2y3r6lx] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6ub2y3r6lx] { padding: 0.75rem; }
    .crud-header[b-6ub2y3r6lx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6ub2y3r6lx] { font-size: 1.1rem; }
    .btn-text[b-6ub2y3r6lx] { display: none; }
    .form-row[b-6ub2y3r6lx] { flex-direction: column; }
    .form-row-4[b-6ub2y3r6lx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6ub2y3r6lx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6ub2y3r6lx] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6ub2y3r6lx] { padding: 0.75rem; }
    .modal-tabs[b-6ub2y3r6lx] { overflow-x: auto; }
    .modal-tab[b-6ub2y3r6lx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6ub2y3r6lx] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6ub2y3r6lx] { display: grid !important; }
    .crud-cards-wrapper[b-6ub2y3r6lx] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6ub2y3r6lx] { grid-template-columns: 1fr; }
    .card-details[b-6ub2y3r6lx] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6ub2y3r6lx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6ub2y3r6lx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6ub2y3r6lx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6ub2y3r6lx] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmft2.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-muzy08gzy6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-muzy08gzy6 0.3s ease-out; }
@keyframes slideUp-b-muzy08gzy6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-muzy08gzy6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-muzy08gzy6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-muzy08gzy6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-muzy08gzy6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-muzy08gzy6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-muzy08gzy6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-muzy08gzy6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-muzy08gzy6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-muzy08gzy6] { filter: brightness(1.1); }
.btn-outline[b-muzy08gzy6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-muzy08gzy6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-muzy08gzy6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-muzy08gzy6] { filter: brightness(1.1); }
.btn-icon[b-muzy08gzy6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-muzy08gzy6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-muzy08gzy6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-muzy08gzy6] { color: #ef4444; }
.btn-delete:hover[b-muzy08gzy6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-muzy08gzy6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-muzy08gzy6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-muzy08gzy6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-muzy08gzy6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-muzy08gzy6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-muzy08gzy6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-muzy08gzy6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-muzy08gzy6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-muzy08gzy6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-muzy08gzy6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-muzy08gzy6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-muzy08gzy6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-muzy08gzy6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-muzy08gzy6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-muzy08gzy6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-muzy08gzy6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-muzy08gzy6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-muzy08gzy6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-muzy08gzy6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-muzy08gzy6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-muzy08gzy6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-muzy08gzy6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-muzy08gzy6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-muzy08gzy6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-muzy08gzy6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-muzy08gzy6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-muzy08gzy6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-muzy08gzy6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-muzy08gzy6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-muzy08gzy6] { display: block; }
.hide-on-cards[b-muzy08gzy6] { display: none !important; }
.show-on-cards[b-muzy08gzy6] { display: grid; }
.hide-on-grid[b-muzy08gzy6] { display: none !important; }

/* Badges */
.badge[b-muzy08gzy6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-muzy08gzy6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-muzy08gzy6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-muzy08gzy6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-muzy08gzy6] { text-align: center; }
.text-muted[b-muzy08gzy6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-muzy08gzy6], .crud-empty-state[b-muzy08gzy6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-muzy08gzy6] { font-size: 2rem; }
.crud-spinner[b-muzy08gzy6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-muzy08gzy6 0.6s linear infinite; }
.crud-spinner-sm[b-muzy08gzy6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-muzy08gzy6 0.6s linear infinite; }
@keyframes spin-b-muzy08gzy6 { to { transform: rotate(360deg); } }
.spin[b-muzy08gzy6] { animation: spin-b-muzy08gzy6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-muzy08gzy6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-muzy08gzy6 0.15s ease-out; }
.modal-container[b-muzy08gzy6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-muzy08gzy6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-muzy08gzy6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-muzy08gzy6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-muzy08gzy6] { max-width: 420px; }
@keyframes fadeIn-b-muzy08gzy6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-muzy08gzy6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-muzy08gzy6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-muzy08gzy6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-muzy08gzy6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-muzy08gzy6] { color: #dc2626; }
.modal-close[b-muzy08gzy6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-muzy08gzy6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-muzy08gzy6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-muzy08gzy6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-muzy08gzy6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-muzy08gzy6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-muzy08gzy6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-muzy08gzy6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-muzy08gzy6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-muzy08gzy6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-muzy08gzy6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-muzy08gzy6] { flex: 2; }
.form-group label[b-muzy08gzy6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-muzy08gzy6], .form-group select[b-muzy08gzy6], .form-textarea[b-muzy08gzy6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-muzy08gzy6], .form-group select:focus[b-muzy08gzy6], .form-textarea:focus[b-muzy08gzy6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-muzy08gzy6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-muzy08gzy6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-muzy08gzy6] { flex: 1; display: flex; align-items: center; }
.form-check[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-muzy08gzy6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-muzy08gzy6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-muzy08gzy6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-muzy08gzy6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-muzy08gzy6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-muzy08gzy6] { font-size: 3rem; }
.photo-placeholder span[b-muzy08gzy6] { font-size: 0.78rem; }
.photo-actions[b-muzy08gzy6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-muzy08gzy6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-muzy08gzy6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-muzy08gzy6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-muzy08gzy6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-muzy08gzy6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-muzy08gzy6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-muzy08gzy6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-muzy08gzy6] { filter: brightness(1.15); transform: scale(1.05); }
[b-muzy08gzy6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-muzy08gzy6] { padding: 0.75rem; }
    .crud-header[b-muzy08gzy6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-muzy08gzy6] { font-size: 1.1rem; }
    .btn-text[b-muzy08gzy6] { display: none; }
    .form-row[b-muzy08gzy6] { flex-direction: column; }
    .form-row-4[b-muzy08gzy6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-muzy08gzy6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-muzy08gzy6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-muzy08gzy6] { padding: 0.75rem; }
    .modal-tabs[b-muzy08gzy6] { overflow-x: auto; }
    .modal-tab[b-muzy08gzy6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-muzy08gzy6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-muzy08gzy6] { display: grid !important; }
    .crud-cards-wrapper[b-muzy08gzy6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-muzy08gzy6] { grid-template-columns: 1fr; }
    .card-details[b-muzy08gzy6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-muzy08gzy6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-muzy08gzy6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-muzy08gzy6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-muzy08gzy6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmftservicios.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xze5wgrodi] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xze5wgrodi 0.3s ease-out; }
@keyframes slideUp-b-xze5wgrodi { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xze5wgrodi] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xze5wgrodi] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xze5wgrodi] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xze5wgrodi] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xze5wgrodi] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xze5wgrodi] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xze5wgrodi] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xze5wgrodi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xze5wgrodi] { filter: brightness(1.1); }
.btn-outline[b-xze5wgrodi] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xze5wgrodi] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xze5wgrodi] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xze5wgrodi] { filter: brightness(1.1); }
.btn-icon[b-xze5wgrodi] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xze5wgrodi] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xze5wgrodi] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xze5wgrodi] { color: #ef4444; }
.btn-delete:hover[b-xze5wgrodi] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xze5wgrodi] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xze5wgrodi] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xze5wgrodi] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xze5wgrodi] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xze5wgrodi] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xze5wgrodi] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xze5wgrodi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xze5wgrodi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xze5wgrodi] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xze5wgrodi] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xze5wgrodi] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xze5wgrodi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xze5wgrodi] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xze5wgrodi] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xze5wgrodi] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xze5wgrodi] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xze5wgrodi] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xze5wgrodi] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xze5wgrodi] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xze5wgrodi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xze5wgrodi] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xze5wgrodi] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xze5wgrodi] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xze5wgrodi] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xze5wgrodi] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xze5wgrodi] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xze5wgrodi] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xze5wgrodi] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xze5wgrodi] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xze5wgrodi] { display: block; }
.hide-on-cards[b-xze5wgrodi] { display: none !important; }
.show-on-cards[b-xze5wgrodi] { display: grid; }
.hide-on-grid[b-xze5wgrodi] { display: none !important; }

/* Badges */
.badge[b-xze5wgrodi] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xze5wgrodi] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xze5wgrodi] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xze5wgrodi] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xze5wgrodi] { text-align: center; }
.text-muted[b-xze5wgrodi] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xze5wgrodi], .crud-empty-state[b-xze5wgrodi] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xze5wgrodi] { font-size: 2rem; }
.crud-spinner[b-xze5wgrodi] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xze5wgrodi 0.6s linear infinite; }
.crud-spinner-sm[b-xze5wgrodi] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xze5wgrodi 0.6s linear infinite; }
@keyframes spin-b-xze5wgrodi { to { transform: rotate(360deg); } }
.spin[b-xze5wgrodi] { animation: spin-b-xze5wgrodi 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xze5wgrodi] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xze5wgrodi 0.15s ease-out; }
.modal-container[b-xze5wgrodi] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xze5wgrodi] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xze5wgrodi 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xze5wgrodi] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xze5wgrodi] { max-width: 420px; }
@keyframes fadeIn-b-xze5wgrodi { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xze5wgrodi { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xze5wgrodi] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xze5wgrodi] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xze5wgrodi] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xze5wgrodi] { color: #dc2626; }
.modal-close[b-xze5wgrodi] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xze5wgrodi] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xze5wgrodi] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xze5wgrodi] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xze5wgrodi] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xze5wgrodi] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xze5wgrodi] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xze5wgrodi] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xze5wgrodi] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xze5wgrodi] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xze5wgrodi] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xze5wgrodi] { flex: 2; }
.form-group label[b-xze5wgrodi] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xze5wgrodi], .form-group select[b-xze5wgrodi], .form-textarea[b-xze5wgrodi] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xze5wgrodi], .form-group select:focus[b-xze5wgrodi], .form-textarea:focus[b-xze5wgrodi] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xze5wgrodi] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xze5wgrodi] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xze5wgrodi] { flex: 1; display: flex; align-items: center; }
.form-check[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xze5wgrodi] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xze5wgrodi] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xze5wgrodi] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xze5wgrodi] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xze5wgrodi] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xze5wgrodi] { font-size: 3rem; }
.photo-placeholder span[b-xze5wgrodi] { font-size: 0.78rem; }
.photo-actions[b-xze5wgrodi] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xze5wgrodi] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xze5wgrodi] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xze5wgrodi] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xze5wgrodi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xze5wgrodi] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xze5wgrodi] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xze5wgrodi] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xze5wgrodi] { filter: brightness(1.15); transform: scale(1.05); }
[b-xze5wgrodi] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xze5wgrodi] { padding: 0.75rem; }
    .crud-header[b-xze5wgrodi] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xze5wgrodi] { font-size: 1.1rem; }
    .btn-text[b-xze5wgrodi] { display: none; }
    .form-row[b-xze5wgrodi] { flex-direction: column; }
    .form-row-4[b-xze5wgrodi] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xze5wgrodi] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xze5wgrodi] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xze5wgrodi] { padding: 0.75rem; }
    .modal-tabs[b-xze5wgrodi] { overflow-x: auto; }
    .modal-tab[b-xze5wgrodi] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xze5wgrodi] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xze5wgrodi] { display: grid !important; }
    .crud-cards-wrapper[b-xze5wgrodi] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xze5wgrodi] { grid-template-columns: 1fr; }
    .card-details[b-xze5wgrodi] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xze5wgrodi] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xze5wgrodi] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xze5wgrodi] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xze5wgrodi] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmgrupo_familia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3hmv1s5sx4] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3hmv1s5sx4 0.3s ease-out; }
@keyframes slideUp-b-3hmv1s5sx4 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3hmv1s5sx4] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3hmv1s5sx4] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3hmv1s5sx4] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3hmv1s5sx4] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3hmv1s5sx4] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3hmv1s5sx4] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3hmv1s5sx4] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3hmv1s5sx4] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3hmv1s5sx4] { filter: brightness(1.1); }
.btn-outline[b-3hmv1s5sx4] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3hmv1s5sx4] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3hmv1s5sx4] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3hmv1s5sx4] { filter: brightness(1.1); }
.btn-icon[b-3hmv1s5sx4] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3hmv1s5sx4] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3hmv1s5sx4] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3hmv1s5sx4] { color: #ef4444; }
.btn-delete:hover[b-3hmv1s5sx4] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3hmv1s5sx4] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3hmv1s5sx4] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3hmv1s5sx4] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3hmv1s5sx4] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3hmv1s5sx4] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3hmv1s5sx4] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3hmv1s5sx4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3hmv1s5sx4] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3hmv1s5sx4] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3hmv1s5sx4] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3hmv1s5sx4] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3hmv1s5sx4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3hmv1s5sx4] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3hmv1s5sx4] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3hmv1s5sx4] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3hmv1s5sx4] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3hmv1s5sx4] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3hmv1s5sx4] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3hmv1s5sx4] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3hmv1s5sx4] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3hmv1s5sx4] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3hmv1s5sx4] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3hmv1s5sx4] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3hmv1s5sx4] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3hmv1s5sx4] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3hmv1s5sx4] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3hmv1s5sx4] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3hmv1s5sx4] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3hmv1s5sx4] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3hmv1s5sx4] { display: block; }
.hide-on-cards[b-3hmv1s5sx4] { display: none !important; }
.show-on-cards[b-3hmv1s5sx4] { display: grid; }
.hide-on-grid[b-3hmv1s5sx4] { display: none !important; }

/* Badges */
.badge[b-3hmv1s5sx4] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3hmv1s5sx4] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3hmv1s5sx4] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3hmv1s5sx4] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3hmv1s5sx4] { text-align: center; }
.text-muted[b-3hmv1s5sx4] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3hmv1s5sx4], .crud-empty-state[b-3hmv1s5sx4] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3hmv1s5sx4] { font-size: 2rem; }
.crud-spinner[b-3hmv1s5sx4] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3hmv1s5sx4 0.6s linear infinite; }
.crud-spinner-sm[b-3hmv1s5sx4] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3hmv1s5sx4 0.6s linear infinite; }
@keyframes spin-b-3hmv1s5sx4 { to { transform: rotate(360deg); } }
.spin[b-3hmv1s5sx4] { animation: spin-b-3hmv1s5sx4 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3hmv1s5sx4] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3hmv1s5sx4 0.15s ease-out; }
.modal-container[b-3hmv1s5sx4] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3hmv1s5sx4] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3hmv1s5sx4 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-3hmv1s5sx4] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-3hmv1s5sx4] { max-width: 420px; }
@keyframes fadeIn-b-3hmv1s5sx4 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3hmv1s5sx4 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3hmv1s5sx4] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3hmv1s5sx4] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3hmv1s5sx4] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3hmv1s5sx4] { color: #dc2626; }
.modal-close[b-3hmv1s5sx4] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3hmv1s5sx4] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3hmv1s5sx4] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3hmv1s5sx4] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3hmv1s5sx4] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3hmv1s5sx4] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3hmv1s5sx4] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3hmv1s5sx4] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3hmv1s5sx4] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3hmv1s5sx4] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3hmv1s5sx4] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3hmv1s5sx4] { flex: 2; }
.form-group label[b-3hmv1s5sx4] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3hmv1s5sx4], .form-group select[b-3hmv1s5sx4], .form-textarea[b-3hmv1s5sx4] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3hmv1s5sx4], .form-group select:focus[b-3hmv1s5sx4], .form-textarea:focus[b-3hmv1s5sx4] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3hmv1s5sx4] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3hmv1s5sx4] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3hmv1s5sx4] { flex: 1; display: flex; align-items: center; }
.form-check[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3hmv1s5sx4] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3hmv1s5sx4] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3hmv1s5sx4] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3hmv1s5sx4] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3hmv1s5sx4] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3hmv1s5sx4] { font-size: 3rem; }
.photo-placeholder span[b-3hmv1s5sx4] { font-size: 0.78rem; }
.photo-actions[b-3hmv1s5sx4] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3hmv1s5sx4] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-3hmv1s5sx4] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3hmv1s5sx4] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3hmv1s5sx4] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3hmv1s5sx4] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3hmv1s5sx4] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3hmv1s5sx4] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3hmv1s5sx4] { filter: brightness(1.15); transform: scale(1.05); }
[b-3hmv1s5sx4] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3hmv1s5sx4] { padding: 0.75rem; }
    .crud-header[b-3hmv1s5sx4] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3hmv1s5sx4] { font-size: 1.1rem; }
    .btn-text[b-3hmv1s5sx4] { display: none; }
    .form-row[b-3hmv1s5sx4] { flex-direction: column; }
    .form-row-4[b-3hmv1s5sx4] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3hmv1s5sx4] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3hmv1s5sx4] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-3hmv1s5sx4] { padding: 0.75rem; }
    .modal-tabs[b-3hmv1s5sx4] { overflow-x: auto; }
    .modal-tab[b-3hmv1s5sx4] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3hmv1s5sx4] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3hmv1s5sx4] { display: grid !important; }
    .crud-cards-wrapper[b-3hmv1s5sx4] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3hmv1s5sx4] { grid-template-columns: 1fr; }
    .card-details[b-3hmv1s5sx4] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-3hmv1s5sx4] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3hmv1s5sx4] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3hmv1s5sx4] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3hmv1s5sx4] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frminvconsultadocumento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-0azq20wk8q] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0azq20wk8q 0.3s ease-out; }
@keyframes slideUp-b-0azq20wk8q { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0azq20wk8q] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0azq20wk8q] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0azq20wk8q] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0azq20wk8q] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0azq20wk8q] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0azq20wk8q] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0azq20wk8q] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0azq20wk8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0azq20wk8q] { filter: brightness(1.1); }
.btn-outline[b-0azq20wk8q] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0azq20wk8q] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-0azq20wk8q] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-0azq20wk8q] { filter: brightness(1.1); }
.btn-icon[b-0azq20wk8q] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-0azq20wk8q] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-0azq20wk8q] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-0azq20wk8q] { color: #ef4444; }
.btn-delete:hover[b-0azq20wk8q] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-0azq20wk8q] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0azq20wk8q] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0azq20wk8q] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0azq20wk8q] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-0azq20wk8q] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-0azq20wk8q] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-0azq20wk8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-0azq20wk8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-0azq20wk8q] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-0azq20wk8q] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0azq20wk8q] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0azq20wk8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0azq20wk8q] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0azq20wk8q] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0azq20wk8q] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-0azq20wk8q] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-0azq20wk8q] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-0azq20wk8q] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-0azq20wk8q] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-0azq20wk8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-0azq20wk8q] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-0azq20wk8q] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-0azq20wk8q] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-0azq20wk8q] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-0azq20wk8q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-0azq20wk8q] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-0azq20wk8q] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-0azq20wk8q] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-0azq20wk8q] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-0azq20wk8q] { display: block; }
.hide-on-cards[b-0azq20wk8q] { display: none !important; }
.show-on-cards[b-0azq20wk8q] { display: grid; }
.hide-on-grid[b-0azq20wk8q] { display: none !important; }

/* Badges */
.badge[b-0azq20wk8q] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-0azq20wk8q] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0azq20wk8q] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-0azq20wk8q] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-0azq20wk8q] { text-align: center; }
.text-muted[b-0azq20wk8q] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0azq20wk8q], .crud-empty-state[b-0azq20wk8q] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-0azq20wk8q] { font-size: 2rem; }
.crud-spinner[b-0azq20wk8q] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0azq20wk8q 0.6s linear infinite; }
.crud-spinner-sm[b-0azq20wk8q] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0azq20wk8q 0.6s linear infinite; }
@keyframes spin-b-0azq20wk8q { to { transform: rotate(360deg); } }
.spin[b-0azq20wk8q] { animation: spin-b-0azq20wk8q 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-0azq20wk8q] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-0azq20wk8q 0.15s ease-out; }
.modal-container[b-0azq20wk8q] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0azq20wk8q] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0azq20wk8q 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-0azq20wk8q] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-0azq20wk8q] { max-width: 420px; }
@keyframes fadeIn-b-0azq20wk8q { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0azq20wk8q { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-0azq20wk8q] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0azq20wk8q] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-0azq20wk8q] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-0azq20wk8q] { color: #dc2626; }
.modal-close[b-0azq20wk8q] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0azq20wk8q] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0azq20wk8q] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0azq20wk8q] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-0azq20wk8q] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-0azq20wk8q] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-0azq20wk8q] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-0azq20wk8q] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-0azq20wk8q] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-0azq20wk8q] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-0azq20wk8q] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-0azq20wk8q] { flex: 2; }
.form-group label[b-0azq20wk8q] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-0azq20wk8q], .form-group select[b-0azq20wk8q], .form-textarea[b-0azq20wk8q] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-0azq20wk8q], .form-group select:focus[b-0azq20wk8q], .form-textarea:focus[b-0azq20wk8q] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-0azq20wk8q] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-0azq20wk8q] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-0azq20wk8q] { flex: 1; display: flex; align-items: center; }
.form-check[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-0azq20wk8q] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-0azq20wk8q] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-0azq20wk8q] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-0azq20wk8q] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-0azq20wk8q] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-0azq20wk8q] { font-size: 3rem; }
.photo-placeholder span[b-0azq20wk8q] { font-size: 0.78rem; }
.photo-actions[b-0azq20wk8q] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-0azq20wk8q] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-0azq20wk8q] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-0azq20wk8q] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-0azq20wk8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-0azq20wk8q] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-0azq20wk8q] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-0azq20wk8q] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-0azq20wk8q] { filter: brightness(1.15); transform: scale(1.05); }
[b-0azq20wk8q] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0azq20wk8q] { padding: 0.75rem; }
    .crud-header[b-0azq20wk8q] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-0azq20wk8q] { font-size: 1.1rem; }
    .btn-text[b-0azq20wk8q] { display: none; }
    .form-row[b-0azq20wk8q] { flex-direction: column; }
    .form-row-4[b-0azq20wk8q] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-0azq20wk8q] { width: 98%; max-height: 95vh; }
    .modal-lg[b-0azq20wk8q] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-0azq20wk8q] { padding: 0.75rem; }
    .modal-tabs[b-0azq20wk8q] { overflow-x: auto; }
    .modal-tab[b-0azq20wk8q] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-0azq20wk8q] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-0azq20wk8q] { display: grid !important; }
    .crud-cards-wrapper[b-0azq20wk8q] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-0azq20wk8q] { grid-template-columns: 1fr; }
    .card-details[b-0azq20wk8q] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-0azq20wk8q] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0azq20wk8q] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0azq20wk8q] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0azq20wk8q] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frminv_entradas_productos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-eb0oty0oy5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-eb0oty0oy5 0.3s ease-out; }
@keyframes slideUp-b-eb0oty0oy5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-eb0oty0oy5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eb0oty0oy5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-eb0oty0oy5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-eb0oty0oy5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-eb0oty0oy5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-eb0oty0oy5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-eb0oty0oy5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-eb0oty0oy5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eb0oty0oy5] { filter: brightness(1.1); }
.btn-outline[b-eb0oty0oy5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-eb0oty0oy5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-eb0oty0oy5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-eb0oty0oy5] { filter: brightness(1.1); }
.btn-icon[b-eb0oty0oy5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-eb0oty0oy5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-eb0oty0oy5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-eb0oty0oy5] { color: #ef4444; }
.btn-delete:hover[b-eb0oty0oy5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-eb0oty0oy5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-eb0oty0oy5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-eb0oty0oy5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-eb0oty0oy5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-eb0oty0oy5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-eb0oty0oy5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-eb0oty0oy5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-eb0oty0oy5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-eb0oty0oy5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-eb0oty0oy5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-eb0oty0oy5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-eb0oty0oy5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-eb0oty0oy5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-eb0oty0oy5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-eb0oty0oy5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-eb0oty0oy5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-eb0oty0oy5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-eb0oty0oy5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-eb0oty0oy5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-eb0oty0oy5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-eb0oty0oy5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-eb0oty0oy5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-eb0oty0oy5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-eb0oty0oy5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-eb0oty0oy5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-eb0oty0oy5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-eb0oty0oy5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-eb0oty0oy5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-eb0oty0oy5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-eb0oty0oy5] { display: block; }
.hide-on-cards[b-eb0oty0oy5] { display: none !important; }
.show-on-cards[b-eb0oty0oy5] { display: grid; }
.hide-on-grid[b-eb0oty0oy5] { display: none !important; }

/* Badges */
.badge[b-eb0oty0oy5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-eb0oty0oy5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-eb0oty0oy5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-eb0oty0oy5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-eb0oty0oy5] { text-align: center; }
.text-muted[b-eb0oty0oy5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-eb0oty0oy5], .crud-empty-state[b-eb0oty0oy5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-eb0oty0oy5] { font-size: 2rem; }
.crud-spinner[b-eb0oty0oy5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-eb0oty0oy5 0.6s linear infinite; }
.crud-spinner-sm[b-eb0oty0oy5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-eb0oty0oy5 0.6s linear infinite; }
@keyframes spin-b-eb0oty0oy5 { to { transform: rotate(360deg); } }
.spin[b-eb0oty0oy5] { animation: spin-b-eb0oty0oy5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-eb0oty0oy5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-eb0oty0oy5 0.15s ease-out; }
.modal-container[b-eb0oty0oy5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-eb0oty0oy5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-eb0oty0oy5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-eb0oty0oy5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-eb0oty0oy5] { max-width: 420px; }
@keyframes fadeIn-b-eb0oty0oy5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-eb0oty0oy5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-eb0oty0oy5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-eb0oty0oy5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-eb0oty0oy5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-eb0oty0oy5] { color: #dc2626; }
.modal-close[b-eb0oty0oy5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-eb0oty0oy5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-eb0oty0oy5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eb0oty0oy5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-eb0oty0oy5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-eb0oty0oy5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-eb0oty0oy5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-eb0oty0oy5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-eb0oty0oy5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-eb0oty0oy5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-eb0oty0oy5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-eb0oty0oy5] { flex: 2; }
.form-group label[b-eb0oty0oy5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-eb0oty0oy5], .form-group select[b-eb0oty0oy5], .form-textarea[b-eb0oty0oy5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-eb0oty0oy5], .form-group select:focus[b-eb0oty0oy5], .form-textarea:focus[b-eb0oty0oy5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-eb0oty0oy5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-eb0oty0oy5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-eb0oty0oy5] { flex: 1; display: flex; align-items: center; }
.form-check[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-eb0oty0oy5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-eb0oty0oy5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-eb0oty0oy5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-eb0oty0oy5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-eb0oty0oy5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-eb0oty0oy5] { font-size: 3rem; }
.photo-placeholder span[b-eb0oty0oy5] { font-size: 0.78rem; }
.photo-actions[b-eb0oty0oy5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-eb0oty0oy5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-eb0oty0oy5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-eb0oty0oy5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-eb0oty0oy5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-eb0oty0oy5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-eb0oty0oy5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-eb0oty0oy5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-eb0oty0oy5] { filter: brightness(1.15); transform: scale(1.05); }
[b-eb0oty0oy5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-eb0oty0oy5] { padding: 0.75rem; }
    .crud-header[b-eb0oty0oy5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-eb0oty0oy5] { font-size: 1.1rem; }
    .btn-text[b-eb0oty0oy5] { display: none; }
    .form-row[b-eb0oty0oy5] { flex-direction: column; }
    .form-row-4[b-eb0oty0oy5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-eb0oty0oy5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-eb0oty0oy5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-eb0oty0oy5] { padding: 0.75rem; }
    .modal-tabs[b-eb0oty0oy5] { overflow-x: auto; }
    .modal-tab[b-eb0oty0oy5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-eb0oty0oy5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-eb0oty0oy5] { display: grid !important; }
    .crud-cards-wrapper[b-eb0oty0oy5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-eb0oty0oy5] { grid-template-columns: 1fr; }
    .card-details[b-eb0oty0oy5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-eb0oty0oy5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-eb0oty0oy5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-eb0oty0oy5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-eb0oty0oy5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frminv_maestraproducto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1gn9rtce4n] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1gn9rtce4n 0.3s ease-out; }
@keyframes slideUp-b-1gn9rtce4n { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1gn9rtce4n] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1gn9rtce4n] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1gn9rtce4n] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1gn9rtce4n] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1gn9rtce4n] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1gn9rtce4n] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1gn9rtce4n] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1gn9rtce4n] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1gn9rtce4n] { filter: brightness(1.1); }
.btn-outline[b-1gn9rtce4n] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1gn9rtce4n] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1gn9rtce4n] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1gn9rtce4n] { filter: brightness(1.1); }
.btn-icon[b-1gn9rtce4n] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1gn9rtce4n] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1gn9rtce4n] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1gn9rtce4n] { color: #ef4444; }
.btn-delete:hover[b-1gn9rtce4n] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1gn9rtce4n] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1gn9rtce4n] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1gn9rtce4n] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1gn9rtce4n] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1gn9rtce4n] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1gn9rtce4n] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1gn9rtce4n] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1gn9rtce4n] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1gn9rtce4n] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1gn9rtce4n] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1gn9rtce4n] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1gn9rtce4n] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1gn9rtce4n] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1gn9rtce4n] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1gn9rtce4n] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1gn9rtce4n] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1gn9rtce4n] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1gn9rtce4n] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1gn9rtce4n] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1gn9rtce4n] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1gn9rtce4n] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1gn9rtce4n] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1gn9rtce4n] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1gn9rtce4n] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1gn9rtce4n] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1gn9rtce4n] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1gn9rtce4n] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1gn9rtce4n] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1gn9rtce4n] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1gn9rtce4n] { display: block; }
.hide-on-cards[b-1gn9rtce4n] { display: none !important; }
.show-on-cards[b-1gn9rtce4n] { display: grid; }
.hide-on-grid[b-1gn9rtce4n] { display: none !important; }

/* Badges */
.badge[b-1gn9rtce4n] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1gn9rtce4n] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1gn9rtce4n] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1gn9rtce4n] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1gn9rtce4n] { text-align: center; }
.text-muted[b-1gn9rtce4n] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1gn9rtce4n], .crud-empty-state[b-1gn9rtce4n] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1gn9rtce4n] { font-size: 2rem; }
.crud-spinner[b-1gn9rtce4n] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1gn9rtce4n 0.6s linear infinite; }
.crud-spinner-sm[b-1gn9rtce4n] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1gn9rtce4n 0.6s linear infinite; }
@keyframes spin-b-1gn9rtce4n { to { transform: rotate(360deg); } }
.spin[b-1gn9rtce4n] { animation: spin-b-1gn9rtce4n 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1gn9rtce4n] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1gn9rtce4n 0.15s ease-out; }
.modal-container[b-1gn9rtce4n] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1gn9rtce4n] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1gn9rtce4n 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1gn9rtce4n] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1gn9rtce4n] { max-width: 420px; }
@keyframes fadeIn-b-1gn9rtce4n { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1gn9rtce4n { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1gn9rtce4n] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1gn9rtce4n] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1gn9rtce4n] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1gn9rtce4n] { color: #dc2626; }
.modal-close[b-1gn9rtce4n] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1gn9rtce4n] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1gn9rtce4n] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1gn9rtce4n] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1gn9rtce4n] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1gn9rtce4n] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1gn9rtce4n] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1gn9rtce4n] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1gn9rtce4n] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1gn9rtce4n] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1gn9rtce4n] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1gn9rtce4n] { flex: 2; }
.form-group label[b-1gn9rtce4n] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1gn9rtce4n], .form-group select[b-1gn9rtce4n], .form-textarea[b-1gn9rtce4n] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1gn9rtce4n], .form-group select:focus[b-1gn9rtce4n], .form-textarea:focus[b-1gn9rtce4n] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1gn9rtce4n] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1gn9rtce4n] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1gn9rtce4n] { flex: 1; display: flex; align-items: center; }
.form-check[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1gn9rtce4n] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1gn9rtce4n] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1gn9rtce4n] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1gn9rtce4n] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1gn9rtce4n] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1gn9rtce4n] { font-size: 3rem; }
.photo-placeholder span[b-1gn9rtce4n] { font-size: 0.78rem; }
.photo-actions[b-1gn9rtce4n] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1gn9rtce4n] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1gn9rtce4n] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1gn9rtce4n] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1gn9rtce4n] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1gn9rtce4n] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1gn9rtce4n] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1gn9rtce4n] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1gn9rtce4n] { filter: brightness(1.15); transform: scale(1.05); }
[b-1gn9rtce4n] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1gn9rtce4n] { padding: 0.75rem; }
    .crud-header[b-1gn9rtce4n] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1gn9rtce4n] { font-size: 1.1rem; }
    .btn-text[b-1gn9rtce4n] { display: none; }
    .form-row[b-1gn9rtce4n] { flex-direction: column; }
    .form-row-4[b-1gn9rtce4n] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1gn9rtce4n] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1gn9rtce4n] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1gn9rtce4n] { padding: 0.75rem; }
    .modal-tabs[b-1gn9rtce4n] { overflow-x: auto; }
    .modal-tab[b-1gn9rtce4n] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1gn9rtce4n] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1gn9rtce4n] { display: grid !important; }
    .crud-cards-wrapper[b-1gn9rtce4n] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1gn9rtce4n] { grid-template-columns: 1fr; }
    .card-details[b-1gn9rtce4n] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1gn9rtce4n] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1gn9rtce4n] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1gn9rtce4n] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1gn9rtce4n] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Inventarioyfacturacion/Frmpuntoventa.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9koetsc17c] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9koetsc17c 0.3s ease-out; }
@keyframes slideUp-b-9koetsc17c { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9koetsc17c] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9koetsc17c] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9koetsc17c] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9koetsc17c] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9koetsc17c] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9koetsc17c] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9koetsc17c] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9koetsc17c] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9koetsc17c] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9koetsc17c] { filter: brightness(1.1); }
.btn-outline[b-9koetsc17c] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9koetsc17c] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9koetsc17c] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9koetsc17c] { filter: brightness(1.1); }
.btn-icon[b-9koetsc17c] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9koetsc17c] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9koetsc17c] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9koetsc17c] { color: #ef4444; }
.btn-delete:hover[b-9koetsc17c] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9koetsc17c] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9koetsc17c] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9koetsc17c] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9koetsc17c] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9koetsc17c] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9koetsc17c] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9koetsc17c] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9koetsc17c] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9koetsc17c] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9koetsc17c] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9koetsc17c] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9koetsc17c] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9koetsc17c] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9koetsc17c] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9koetsc17c] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9koetsc17c] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9koetsc17c] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9koetsc17c] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9koetsc17c] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9koetsc17c] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9koetsc17c] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9koetsc17c] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9koetsc17c] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9koetsc17c] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9koetsc17c] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9koetsc17c] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9koetsc17c] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9koetsc17c] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9koetsc17c] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9koetsc17c] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9koetsc17c] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9koetsc17c] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9koetsc17c] { display: block; }
.hide-on-cards[b-9koetsc17c] { display: none !important; }
.show-on-cards[b-9koetsc17c] { display: grid; }
.hide-on-grid[b-9koetsc17c] { display: none !important; }

/* Badges */
.badge[b-9koetsc17c] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9koetsc17c] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9koetsc17c] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9koetsc17c] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9koetsc17c] { text-align: center; }
.text-muted[b-9koetsc17c] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9koetsc17c], .crud-empty-state[b-9koetsc17c] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9koetsc17c] { font-size: 2rem; }
.crud-spinner[b-9koetsc17c] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9koetsc17c 0.6s linear infinite; }
.crud-spinner-sm[b-9koetsc17c] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9koetsc17c 0.6s linear infinite; }
@keyframes spin-b-9koetsc17c { to { transform: rotate(360deg); } }
.spin[b-9koetsc17c] { animation: spin-b-9koetsc17c 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9koetsc17c] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9koetsc17c 0.15s ease-out; }
.modal-container[b-9koetsc17c] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9koetsc17c] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9koetsc17c 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9koetsc17c] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9koetsc17c] { max-width: 420px; }
@keyframes fadeIn-b-9koetsc17c { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9koetsc17c { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9koetsc17c] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9koetsc17c] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9koetsc17c] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9koetsc17c] { color: #dc2626; }
.modal-close[b-9koetsc17c] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9koetsc17c] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9koetsc17c] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9koetsc17c] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9koetsc17c] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9koetsc17c] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9koetsc17c] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9koetsc17c] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9koetsc17c] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9koetsc17c] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9koetsc17c] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9koetsc17c] { flex: 2; }
.form-group label[b-9koetsc17c] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9koetsc17c], .form-group select[b-9koetsc17c], .form-textarea[b-9koetsc17c] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9koetsc17c], .form-group select:focus[b-9koetsc17c], .form-textarea:focus[b-9koetsc17c] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9koetsc17c] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9koetsc17c] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9koetsc17c] { flex: 1; display: flex; align-items: center; }
.form-check[b-9koetsc17c] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9koetsc17c] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9koetsc17c] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9koetsc17c] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9koetsc17c] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9koetsc17c] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9koetsc17c] { font-size: 3rem; }
.photo-placeholder span[b-9koetsc17c] { font-size: 0.78rem; }
.photo-actions[b-9koetsc17c] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9koetsc17c] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9koetsc17c] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9koetsc17c] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9koetsc17c] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9koetsc17c] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9koetsc17c] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9koetsc17c] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9koetsc17c] { filter: brightness(1.15); transform: scale(1.05); }
[b-9koetsc17c] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9koetsc17c] { padding: 0.75rem; }
    .crud-header[b-9koetsc17c] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9koetsc17c] { font-size: 1.1rem; }
    .btn-text[b-9koetsc17c] { display: none; }
    .form-row[b-9koetsc17c] { flex-direction: column; }
    .form-row-4[b-9koetsc17c] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9koetsc17c] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9koetsc17c] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9koetsc17c] { padding: 0.75rem; }
    .modal-tabs[b-9koetsc17c] { overflow-x: auto; }
    .modal-tab[b-9koetsc17c] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9koetsc17c] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9koetsc17c] { display: grid !important; }
    .crud-cards-wrapper[b-9koetsc17c] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9koetsc17c] { grid-template-columns: 1fr; }
    .card-details[b-9koetsc17c] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9koetsc17c] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9koetsc17c] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9koetsc17c] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9koetsc17c] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Login.razor.rz.scp.css */
/* ============================================================
   🔐 Login.razor.css — Estilos aislados de la página de login
   🎯 Diseño profesional, responsivo, con animaciones suaves
   📱 Mobile-first design
   ============================================================ */

/* ============================================================
   🎨 Página completa — fondo con gradiente del tema
   ============================================================ */

.login-page[b-dvmaqkf3ll] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--rg-gradient);
    padding: 1rem;
    position: relative;
}

/* ============================================================
   🔧 Barra superior — tema + idioma
   ============================================================ */

.login-toolbar[b-dvmaqkf3ll] {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    z-index: 10;
}

.toolbar-group[b-dvmaqkf3ll] {
    display: flex;
    gap: 0.25rem;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 2rem;
    padding: 0.25rem;
}

.toolbar-btn[b-dvmaqkf3ll] {
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.1rem;
    padding: 0.35rem 0.6rem;
    border-radius: 1.5rem;
    cursor: pointer;
    transition: all 0.2s;
    line-height: 1;
}

.toolbar-btn:hover[b-dvmaqkf3ll] {
    color: white;
    background: rgba(255, 255, 255, 0.15);
}

.toolbar-btn.active[b-dvmaqkf3ll] {
    color: white;
    background: rgba(255, 255, 255, 0.25);
}

/* ============================================================
   🎨 Selector de tema — gota expandible (acordeón)
   Mismo patrón usado en AppLayout para coherencia visual.
   ============================================================ */
.theme-picker[b-dvmaqkf3ll] {
    position: relative;
    display: flex;
    align-items: center;
    /* Anula los estilos de .toolbar-group para esta variante */
    background: transparent !important;
    backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* Botón gota — siempre visible, color del tema actual */
.theme-drop-btn[b-dvmaqkf3ll] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.5);
    background: var(--dot-color, #0B8AD9);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .2s, border-color .2s;
    position: relative;
    z-index: 2;
}
.theme-drop-btn:hover[b-dvmaqkf3ll] {
    transform: scale(1.10);
    box-shadow: 0 4px 14px rgba(0,0,0,.3);
    border-color: rgba(255,255,255,.85);
}
.theme-drop-icon[b-dvmaqkf3ll] {
    font-size: 1rem;
    line-height: 1;
    transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.theme-picker.open .theme-drop-btn[b-dvmaqkf3ll] { transform: scale(1.08); }
.theme-picker.open .theme-drop-icon[b-dvmaqkf3ll] { transform: rotate(-180deg); }

/* Panel — acordeón horizontal */
.theme-drop-panel[b-dvmaqkf3ll] {
    display: flex;
    align-items: center;
    gap: 0;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    margin-left: 0;
    background: rgba(255,255,255,.18);
    backdrop-filter: blur(10px);
    border: 1px solid transparent;
    border-radius: 20px;
    box-shadow: 0 4px 14px rgba(0,0,0,.18);
    opacity: 0;
    transform: translateX(-8px);
    transition:
        max-width   .42s cubic-bezier(.4,0,.2,1),
        padding     .42s cubic-bezier(.4,0,.2,1),
        margin-left .42s cubic-bezier(.4,0,.2,1),
        opacity     .25s ease,
        transform   .35s cubic-bezier(.4,0,.2,1),
        border-color .25s ease;
    pointer-events: none;
}
.theme-picker.open .theme-drop-panel[b-dvmaqkf3ll] {
    max-width: 700px;
    padding: 6px 10px;
    margin-left: 8px;
    opacity: 1;
    transform: translateX(0);
    border-color: rgba(255,255,255,.3);
    pointer-events: auto;
    gap: 0.3125rem;
}

.theme-dot[b-dvmaqkf3ll] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--dot-color);
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    opacity: 0;
    transform: scale(.4);
    transition: transform .25s cubic-bezier(.34,1.56,.64,1), opacity .25s ease, border-color .2s, box-shadow .2s;
}
.theme-picker.open .theme-dot[b-dvmaqkf3ll] {
    opacity: 1;
    transform: scale(1);
}
.theme-picker.open .theme-dot:nth-child(1)[b-dvmaqkf3ll]  { transition-delay: .05s; }
.theme-picker.open .theme-dot:nth-child(2)[b-dvmaqkf3ll]  { transition-delay: .07s; }
.theme-picker.open .theme-dot:nth-child(3)[b-dvmaqkf3ll]  { transition-delay: .09s; }
.theme-picker.open .theme-dot:nth-child(4)[b-dvmaqkf3ll]  { transition-delay: .11s; }
.theme-picker.open .theme-dot:nth-child(5)[b-dvmaqkf3ll]  { transition-delay: .13s; }
.theme-picker.open .theme-dot:nth-child(6)[b-dvmaqkf3ll]  { transition-delay: .15s; }
.theme-picker.open .theme-dot:nth-child(7)[b-dvmaqkf3ll]  { transition-delay: .17s; }
.theme-picker.open .theme-dot:nth-child(8)[b-dvmaqkf3ll]  { transition-delay: .19s; }
.theme-picker.open .theme-dot:nth-child(9)[b-dvmaqkf3ll]  { transition-delay: .21s; }
.theme-picker.open .theme-dot:nth-child(10)[b-dvmaqkf3ll] { transition-delay: .23s; }
.theme-picker.open .theme-dot:nth-child(11)[b-dvmaqkf3ll] { transition-delay: .25s; }
.theme-picker.open .theme-dot:nth-child(12)[b-dvmaqkf3ll] { transition-delay: .27s; }
.theme-picker.open .theme-dot:nth-child(13)[b-dvmaqkf3ll] { transition-delay: .29s; }
.theme-picker.open .theme-dot:nth-child(14)[b-dvmaqkf3ll] { transition-delay: .31s; }
.theme-picker.open .theme-dot:nth-child(15)[b-dvmaqkf3ll] { transition-delay: .33s; }

.theme-dot:hover[b-dvmaqkf3ll] {
    transform: scale(1.35);
    border-color: rgba(255,255,255,.6);
}
.theme-dot.active[b-dvmaqkf3ll] {
    border-color: rgba(255,255,255,.95);
    box-shadow: inset 0 0 0 4px var(--dot-color), 0 0 8px rgba(255,255,255,.4);
    transform: scale(1.15);
}

/* ============================================================
   📦 Tarjeta de login
   ============================================================ */

.login-card[b-dvmaqkf3ll] {
    width: 100%;
    max-width: 440px;
    background: white;
    border-radius: 1.5rem;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

/* ============================================================
   🏢 Header — Logo y título
   ============================================================ */

.login-header[b-dvmaqkf3ll] {
    text-align: center;
    padding: 1.5rem 2rem 1rem;
    background: var(--rg-gradient-soft);
    border-bottom: 1px solid rgba(var(--rg-primary-rgb), 0.1);
}

.login-logo[b-dvmaqkf3ll] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.35rem;
}

[b-dvmaqkf3ll] .login-logo-img {
    width: 7rem;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
    transition: transform 0.3s ease;
}

[b-dvmaqkf3ll] .login-logo-img:hover {
    transform: scale(1.04);
}

.login-header p[b-dvmaqkf3ll] {
    font-size: 0.8rem;
    color: #64748b;
    margin: 0.15rem 0 0;
    letter-spacing: 0.02em;
}

/* ============================================================
   📋 Formulario de login
   ============================================================ */

.login-form[b-dvmaqkf3ll] {
    padding: 1.75rem 2rem;
}

.login-form h2[b-dvmaqkf3ll] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.25rem;
}

.login-subtitle[b-dvmaqkf3ll] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0 0 1.25rem;
    line-height: 1.4;
}

/* 👁️ Toggle contraseña */
.password-wrapper[b-dvmaqkf3ll] {
    position: relative;
}

.password-toggle[b-dvmaqkf3ll] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    padding: 0.25rem;
    font-size: 1.1rem;
    transition: color 0.2s;
}

.password-toggle:hover[b-dvmaqkf3ll] {
    color: var(--rg-primary);
}

/* ============================================================
   🏢 Lista de empresas (Paso 2)
   ============================================================ */

.company-list[b-dvmaqkf3ll] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 280px;
    overflow-y: auto;
    margin-bottom: 1.25rem;
    padding-right: 0.25rem;
}

/* Scrollbar personalizado */
.company-list[b-dvmaqkf3ll]::-webkit-scrollbar {
    width: 4px;
}

.company-list[b-dvmaqkf3ll]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.company-list[b-dvmaqkf3ll]::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* 🏢 Tarjeta de empresa */
.company-card[b-dvmaqkf3ll] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border: 2px solid #e2e8f0;
    border-radius: 0.75rem;
    background: white;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    width: 100%;
}

.company-card:hover:not(:disabled)[b-dvmaqkf3ll] {
    border-color: var(--rg-primary-light);
    background: #f8fafc;
}

.company-card.selected[b-dvmaqkf3ll] {
    border-color: var(--rg-primary);
    background: var(--rg-primary-light);
    box-shadow: 0 2px 8px rgba(var(--rg-primary-rgb), 0.15);
}

.company-card:disabled[b-dvmaqkf3ll] {
    opacity: 0.6;
    cursor: not-allowed;
}

.company-card-icon[b-dvmaqkf3ll] {
    width: 2.5rem;
    height: 2.5rem;
    background: var(--rg-primary-light);
    border-radius: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.company-card-icon i[b-dvmaqkf3ll] {
    font-size: 1.1rem;
    color: var(--rg-primary);
}

.company-card.selected .company-card-icon[b-dvmaqkf3ll] {
    background: var(--rg-primary);
}

.company-card.selected .company-card-icon i[b-dvmaqkf3ll] {
    color: white;
}

.company-card-info[b-dvmaqkf3ll] {
    flex: 1;
    min-width: 0;
}

.company-name[b-dvmaqkf3ll] {
    display: block;
    font-weight: 600;
    font-size: 0.9rem;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.company-branch[b-dvmaqkf3ll] {
    display: block;
    font-size: 0.8rem;
    color: #64748b;
    margin-top: 0.125rem;
}

.company-branch i[b-dvmaqkf3ll] {
    font-size: 0.75rem;
}

.company-card-check[b-dvmaqkf3ll] {
    flex-shrink: 0;
    color: var(--rg-primary);
    font-size: 1.25rem;
    animation: rg-fadeIn 0.2s ease;
}

/* ============================================================
   🔘 Acciones del Paso 2
   ============================================================ */

.login-actions[b-dvmaqkf3ll] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-back[b-dvmaqkf3ll] {
    background: none;
    border: none;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    transition: color 0.2s;
}

.btn-back:hover[b-dvmaqkf3ll] {
    color: var(--rg-primary);
}

.btn-back:disabled[b-dvmaqkf3ll] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ============================================================
   📋 Footer
   ============================================================ */

.login-footer[b-dvmaqkf3ll] {
    text-align: center;
    padding: 1rem 2rem;
    border-top: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    color: #94a3b8;
}

/* ============================================================
   📱 Responsive
   ============================================================ */

@media (max-width: 480px) {
    .login-card[b-dvmaqkf3ll] {
        border-radius: 1rem;
        margin: 0.5rem;
    }

    .login-form[b-dvmaqkf3ll] {
        padding: 1.25rem 1.5rem;
    }

    .login-header[b-dvmaqkf3ll] {
        padding: 1.25rem 1.5rem 0.75rem;
    }

    [b-dvmaqkf3ll] .login-logo-img {
        width: 5.5rem;
    }

    .login-toolbar[b-dvmaqkf3ll] {
        top: 0.5rem;
        right: 0.75rem;
        flex-direction: column;
        align-items: flex-end;
        gap: 0.5rem;
    }

    .company-list[b-dvmaqkf3ll] {
        max-height: 220px;
    }

    .login-footer[b-dvmaqkf3ll] {
        flex-direction: column;
        gap: 0.15rem;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .login-card[b-dvmaqkf3ll] {
        max-width: 420px;
    }
}

@media (min-height: 900px) {
    .login-page[b-dvmaqkf3ll] {
        padding: 2rem;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeoasignacionclientegestor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-jeip6n67ob] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-jeip6n67ob 0.3s ease-out; }
@keyframes slideUp-b-jeip6n67ob { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-jeip6n67ob] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-jeip6n67ob] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-jeip6n67ob] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-jeip6n67ob] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-jeip6n67ob] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-jeip6n67ob] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jeip6n67ob] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-jeip6n67ob] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jeip6n67ob] { filter: brightness(1.1); }
.btn-outline[b-jeip6n67ob] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-jeip6n67ob] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-jeip6n67ob] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-jeip6n67ob] { filter: brightness(1.1); }
.btn-icon[b-jeip6n67ob] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-jeip6n67ob] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-jeip6n67ob] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-jeip6n67ob] { color: #ef4444; }
.btn-delete:hover[b-jeip6n67ob] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-jeip6n67ob] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-jeip6n67ob] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-jeip6n67ob] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-jeip6n67ob] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-jeip6n67ob] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-jeip6n67ob] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-jeip6n67ob] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-jeip6n67ob] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-jeip6n67ob] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-jeip6n67ob] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-jeip6n67ob] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-jeip6n67ob] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-jeip6n67ob] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-jeip6n67ob] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-jeip6n67ob] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-jeip6n67ob] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-jeip6n67ob] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-jeip6n67ob] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-jeip6n67ob] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-jeip6n67ob] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-jeip6n67ob] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-jeip6n67ob] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-jeip6n67ob] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-jeip6n67ob] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-jeip6n67ob] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-jeip6n67ob] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-jeip6n67ob] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-jeip6n67ob] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-jeip6n67ob] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-jeip6n67ob] { display: block; }
.hide-on-cards[b-jeip6n67ob] { display: none !important; }
.show-on-cards[b-jeip6n67ob] { display: grid; }
.hide-on-grid[b-jeip6n67ob] { display: none !important; }

/* Badges */
.badge[b-jeip6n67ob] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-jeip6n67ob] { background: #ecfdf5; color: #065f46; }
.badge-no[b-jeip6n67ob] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-jeip6n67ob] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-jeip6n67ob] { text-align: center; }
.text-muted[b-jeip6n67ob] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-jeip6n67ob], .crud-empty-state[b-jeip6n67ob] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-jeip6n67ob] { font-size: 2rem; }
.crud-spinner[b-jeip6n67ob] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-jeip6n67ob 0.6s linear infinite; }
.crud-spinner-sm[b-jeip6n67ob] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-jeip6n67ob 0.6s linear infinite; }
@keyframes spin-b-jeip6n67ob { to { transform: rotate(360deg); } }
.spin[b-jeip6n67ob] { animation: spin-b-jeip6n67ob 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-jeip6n67ob] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-jeip6n67ob 0.15s ease-out; }
.modal-container[b-jeip6n67ob] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-jeip6n67ob] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-jeip6n67ob 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-jeip6n67ob] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-jeip6n67ob] { max-width: 420px; }
@keyframes fadeIn-b-jeip6n67ob { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-jeip6n67ob { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-jeip6n67ob] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-jeip6n67ob] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-jeip6n67ob] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-jeip6n67ob] { color: #dc2626; }
.modal-close[b-jeip6n67ob] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-jeip6n67ob] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-jeip6n67ob] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-jeip6n67ob] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-jeip6n67ob] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-jeip6n67ob] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-jeip6n67ob] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-jeip6n67ob] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-jeip6n67ob] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-jeip6n67ob] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-jeip6n67ob] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-jeip6n67ob] { flex: 2; }
.form-group label[b-jeip6n67ob] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-jeip6n67ob], .form-group select[b-jeip6n67ob], .form-textarea[b-jeip6n67ob] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-jeip6n67ob], .form-group select:focus[b-jeip6n67ob], .form-textarea:focus[b-jeip6n67ob] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-jeip6n67ob] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-jeip6n67ob] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-jeip6n67ob] { flex: 1; display: flex; align-items: center; }
.form-check[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-jeip6n67ob] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-jeip6n67ob] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-jeip6n67ob] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-jeip6n67ob] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-jeip6n67ob] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-jeip6n67ob] { font-size: 3rem; }
.photo-placeholder span[b-jeip6n67ob] { font-size: 0.78rem; }
.photo-actions[b-jeip6n67ob] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-jeip6n67ob] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-jeip6n67ob] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-jeip6n67ob] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-jeip6n67ob] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-jeip6n67ob] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-jeip6n67ob] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-jeip6n67ob] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-jeip6n67ob] { filter: brightness(1.15); transform: scale(1.05); }
[b-jeip6n67ob] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-jeip6n67ob] { padding: 0.75rem; }
    .crud-header[b-jeip6n67ob] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-jeip6n67ob] { font-size: 1.1rem; }
    .btn-text[b-jeip6n67ob] { display: none; }
    .form-row[b-jeip6n67ob] { flex-direction: column; }
    .form-row-4[b-jeip6n67ob] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-jeip6n67ob] { width: 98%; max-height: 95vh; }
    .modal-lg[b-jeip6n67ob] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-jeip6n67ob] { padding: 0.75rem; }
    .modal-tabs[b-jeip6n67ob] { overflow-x: auto; }
    .modal-tab[b-jeip6n67ob] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-jeip6n67ob] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-jeip6n67ob] { display: grid !important; }
    .crud-cards-wrapper[b-jeip6n67ob] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-jeip6n67ob] { grid-template-columns: 1fr; }
    .card-details[b-jeip6n67ob] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-jeip6n67ob] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-jeip6n67ob] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-jeip6n67ob] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-jeip6n67ob] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeoasignacionusrgestor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-6q5w62ypiw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-6q5w62ypiw 0.3s ease-out; }
@keyframes slideUp-b-6q5w62ypiw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-6q5w62ypiw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-6q5w62ypiw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-6q5w62ypiw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-6q5w62ypiw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-6q5w62ypiw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-6q5w62ypiw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-6q5w62ypiw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-6q5w62ypiw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-6q5w62ypiw] { filter: brightness(1.1); }
.btn-outline[b-6q5w62ypiw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-6q5w62ypiw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-6q5w62ypiw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-6q5w62ypiw] { filter: brightness(1.1); }
.btn-icon[b-6q5w62ypiw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-6q5w62ypiw] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-6q5w62ypiw] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-6q5w62ypiw] { color: #ef4444; }
.btn-delete:hover[b-6q5w62ypiw] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-6q5w62ypiw] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-6q5w62ypiw] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-6q5w62ypiw] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-6q5w62ypiw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-6q5w62ypiw] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-6q5w62ypiw] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-6q5w62ypiw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-6q5w62ypiw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-6q5w62ypiw] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-6q5w62ypiw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-6q5w62ypiw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-6q5w62ypiw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-6q5w62ypiw] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-6q5w62ypiw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-6q5w62ypiw] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-6q5w62ypiw] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-6q5w62ypiw] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-6q5w62ypiw] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-6q5w62ypiw] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-6q5w62ypiw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-6q5w62ypiw] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-6q5w62ypiw] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-6q5w62ypiw] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-6q5w62ypiw] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-6q5w62ypiw] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-6q5w62ypiw] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-6q5w62ypiw] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-6q5w62ypiw] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-6q5w62ypiw] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-6q5w62ypiw] { display: block; }
.hide-on-cards[b-6q5w62ypiw] { display: none !important; }
.show-on-cards[b-6q5w62ypiw] { display: grid; }
.hide-on-grid[b-6q5w62ypiw] { display: none !important; }

/* Badges */
.badge[b-6q5w62ypiw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-6q5w62ypiw] { background: #ecfdf5; color: #065f46; }
.badge-no[b-6q5w62ypiw] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-6q5w62ypiw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-6q5w62ypiw] { text-align: center; }
.text-muted[b-6q5w62ypiw] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-6q5w62ypiw], .crud-empty-state[b-6q5w62ypiw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-6q5w62ypiw] { font-size: 2rem; }
.crud-spinner[b-6q5w62ypiw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-6q5w62ypiw 0.6s linear infinite; }
.crud-spinner-sm[b-6q5w62ypiw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-6q5w62ypiw 0.6s linear infinite; }
@keyframes spin-b-6q5w62ypiw { to { transform: rotate(360deg); } }
.spin[b-6q5w62ypiw] { animation: spin-b-6q5w62ypiw 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-6q5w62ypiw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-6q5w62ypiw 0.15s ease-out; }
.modal-container[b-6q5w62ypiw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-6q5w62ypiw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-6q5w62ypiw 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-6q5w62ypiw] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-6q5w62ypiw] { max-width: 420px; }
@keyframes fadeIn-b-6q5w62ypiw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-6q5w62ypiw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-6q5w62ypiw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-6q5w62ypiw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-6q5w62ypiw] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-6q5w62ypiw] { color: #dc2626; }
.modal-close[b-6q5w62ypiw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-6q5w62ypiw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-6q5w62ypiw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6q5w62ypiw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-6q5w62ypiw] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-6q5w62ypiw] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-6q5w62ypiw] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-6q5w62ypiw] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-6q5w62ypiw] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-6q5w62ypiw] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-6q5w62ypiw] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-6q5w62ypiw] { flex: 2; }
.form-group label[b-6q5w62ypiw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-6q5w62ypiw], .form-group select[b-6q5w62ypiw], .form-textarea[b-6q5w62ypiw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-6q5w62ypiw], .form-group select:focus[b-6q5w62ypiw], .form-textarea:focus[b-6q5w62ypiw] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-6q5w62ypiw] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-6q5w62ypiw] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-6q5w62ypiw] { flex: 1; display: flex; align-items: center; }
.form-check[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-6q5w62ypiw] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-6q5w62ypiw] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-6q5w62ypiw] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-6q5w62ypiw] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-6q5w62ypiw] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-6q5w62ypiw] { font-size: 3rem; }
.photo-placeholder span[b-6q5w62ypiw] { font-size: 0.78rem; }
.photo-actions[b-6q5w62ypiw] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-6q5w62ypiw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-6q5w62ypiw] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-6q5w62ypiw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-6q5w62ypiw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-6q5w62ypiw] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-6q5w62ypiw] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-6q5w62ypiw] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-6q5w62ypiw] { filter: brightness(1.15); transform: scale(1.05); }
[b-6q5w62ypiw] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-6q5w62ypiw] { padding: 0.75rem; }
    .crud-header[b-6q5w62ypiw] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-6q5w62ypiw] { font-size: 1.1rem; }
    .btn-text[b-6q5w62ypiw] { display: none; }
    .form-row[b-6q5w62ypiw] { flex-direction: column; }
    .form-row-4[b-6q5w62ypiw] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-6q5w62ypiw] { width: 98%; max-height: 95vh; }
    .modal-lg[b-6q5w62ypiw] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-6q5w62ypiw] { padding: 0.75rem; }
    .modal-tabs[b-6q5w62ypiw] { overflow-x: auto; }
    .modal-tab[b-6q5w62ypiw] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-6q5w62ypiw] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-6q5w62ypiw] { display: grid !important; }
    .crud-cards-wrapper[b-6q5w62ypiw] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-6q5w62ypiw] { grid-template-columns: 1fr; }
    .card-details[b-6q5w62ypiw] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-6q5w62ypiw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-6q5w62ypiw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-6q5w62ypiw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-6q5w62ypiw] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeoempresaydependientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vjgzxs0bn1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vjgzxs0bn1 0.3s ease-out; }
@keyframes slideUp-b-vjgzxs0bn1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vjgzxs0bn1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vjgzxs0bn1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vjgzxs0bn1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vjgzxs0bn1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vjgzxs0bn1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vjgzxs0bn1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vjgzxs0bn1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vjgzxs0bn1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vjgzxs0bn1] { filter: brightness(1.1); }
.btn-outline[b-vjgzxs0bn1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vjgzxs0bn1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vjgzxs0bn1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vjgzxs0bn1] { filter: brightness(1.1); }
.btn-icon[b-vjgzxs0bn1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vjgzxs0bn1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vjgzxs0bn1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vjgzxs0bn1] { color: #ef4444; }
.btn-delete:hover[b-vjgzxs0bn1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vjgzxs0bn1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vjgzxs0bn1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vjgzxs0bn1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vjgzxs0bn1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vjgzxs0bn1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vjgzxs0bn1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vjgzxs0bn1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vjgzxs0bn1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vjgzxs0bn1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vjgzxs0bn1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vjgzxs0bn1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vjgzxs0bn1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vjgzxs0bn1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vjgzxs0bn1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vjgzxs0bn1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vjgzxs0bn1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vjgzxs0bn1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vjgzxs0bn1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vjgzxs0bn1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vjgzxs0bn1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vjgzxs0bn1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vjgzxs0bn1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vjgzxs0bn1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vjgzxs0bn1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vjgzxs0bn1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vjgzxs0bn1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vjgzxs0bn1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vjgzxs0bn1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vjgzxs0bn1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vjgzxs0bn1] { display: block; }
.hide-on-cards[b-vjgzxs0bn1] { display: none !important; }
.show-on-cards[b-vjgzxs0bn1] { display: grid; }
.hide-on-grid[b-vjgzxs0bn1] { display: none !important; }

/* Badges */
.badge[b-vjgzxs0bn1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vjgzxs0bn1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vjgzxs0bn1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vjgzxs0bn1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vjgzxs0bn1] { text-align: center; }
.text-muted[b-vjgzxs0bn1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vjgzxs0bn1], .crud-empty-state[b-vjgzxs0bn1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vjgzxs0bn1] { font-size: 2rem; }
.crud-spinner[b-vjgzxs0bn1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vjgzxs0bn1 0.6s linear infinite; }
.crud-spinner-sm[b-vjgzxs0bn1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vjgzxs0bn1 0.6s linear infinite; }
@keyframes spin-b-vjgzxs0bn1 { to { transform: rotate(360deg); } }
.spin[b-vjgzxs0bn1] { animation: spin-b-vjgzxs0bn1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vjgzxs0bn1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vjgzxs0bn1 0.15s ease-out; }
.modal-container[b-vjgzxs0bn1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vjgzxs0bn1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vjgzxs0bn1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vjgzxs0bn1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vjgzxs0bn1] { max-width: 420px; }
@keyframes fadeIn-b-vjgzxs0bn1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vjgzxs0bn1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vjgzxs0bn1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vjgzxs0bn1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vjgzxs0bn1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vjgzxs0bn1] { color: #dc2626; }
.modal-close[b-vjgzxs0bn1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vjgzxs0bn1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vjgzxs0bn1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vjgzxs0bn1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vjgzxs0bn1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vjgzxs0bn1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vjgzxs0bn1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vjgzxs0bn1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vjgzxs0bn1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vjgzxs0bn1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vjgzxs0bn1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vjgzxs0bn1] { flex: 2; }
.form-group label[b-vjgzxs0bn1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vjgzxs0bn1], .form-group select[b-vjgzxs0bn1], .form-textarea[b-vjgzxs0bn1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vjgzxs0bn1], .form-group select:focus[b-vjgzxs0bn1], .form-textarea:focus[b-vjgzxs0bn1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vjgzxs0bn1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vjgzxs0bn1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vjgzxs0bn1] { flex: 1; display: flex; align-items: center; }
.form-check[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vjgzxs0bn1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vjgzxs0bn1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vjgzxs0bn1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vjgzxs0bn1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vjgzxs0bn1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vjgzxs0bn1] { font-size: 3rem; }
.photo-placeholder span[b-vjgzxs0bn1] { font-size: 0.78rem; }
.photo-actions[b-vjgzxs0bn1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vjgzxs0bn1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vjgzxs0bn1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vjgzxs0bn1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vjgzxs0bn1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vjgzxs0bn1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vjgzxs0bn1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vjgzxs0bn1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vjgzxs0bn1] { filter: brightness(1.15); transform: scale(1.05); }
[b-vjgzxs0bn1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vjgzxs0bn1] { padding: 0.75rem; }
    .crud-header[b-vjgzxs0bn1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vjgzxs0bn1] { font-size: 1.1rem; }
    .btn-text[b-vjgzxs0bn1] { display: none; }
    .form-row[b-vjgzxs0bn1] { flex-direction: column; }
    .form-row-4[b-vjgzxs0bn1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vjgzxs0bn1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vjgzxs0bn1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vjgzxs0bn1] { padding: 0.75rem; }
    .modal-tabs[b-vjgzxs0bn1] { overflow-x: auto; }
    .modal-tab[b-vjgzxs0bn1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vjgzxs0bn1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vjgzxs0bn1] { display: grid !important; }
    .crud-cards-wrapper[b-vjgzxs0bn1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vjgzxs0bn1] { grid-template-columns: 1fr; }
    .card-details[b-vjgzxs0bn1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vjgzxs0bn1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vjgzxs0bn1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vjgzxs0bn1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vjgzxs0bn1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeogestionesrealizdas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-97r5e87100] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-97r5e87100 0.3s ease-out; }
@keyframes slideUp-b-97r5e87100 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-97r5e87100] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-97r5e87100] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-97r5e87100] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-97r5e87100] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-97r5e87100] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-97r5e87100] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-97r5e87100] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-97r5e87100] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-97r5e87100] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-97r5e87100] { filter: brightness(1.1); }
.btn-outline[b-97r5e87100] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-97r5e87100] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-97r5e87100] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-97r5e87100] { filter: brightness(1.1); }
.btn-icon[b-97r5e87100] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-97r5e87100] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-97r5e87100] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-97r5e87100] { color: #ef4444; }
.btn-delete:hover[b-97r5e87100] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-97r5e87100] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-97r5e87100] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-97r5e87100] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-97r5e87100] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-97r5e87100] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-97r5e87100] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-97r5e87100] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-97r5e87100] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-97r5e87100] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-97r5e87100] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-97r5e87100] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-97r5e87100] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-97r5e87100] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-97r5e87100] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-97r5e87100] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-97r5e87100] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-97r5e87100] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-97r5e87100] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-97r5e87100] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-97r5e87100] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-97r5e87100] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-97r5e87100] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-97r5e87100] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-97r5e87100] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-97r5e87100] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-97r5e87100] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-97r5e87100] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-97r5e87100] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-97r5e87100] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-97r5e87100] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-97r5e87100] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-97r5e87100] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-97r5e87100] { display: block; }
.hide-on-cards[b-97r5e87100] { display: none !important; }
.show-on-cards[b-97r5e87100] { display: grid; }
.hide-on-grid[b-97r5e87100] { display: none !important; }

/* Badges */
.badge[b-97r5e87100] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-97r5e87100] { background: #ecfdf5; color: #065f46; }
.badge-no[b-97r5e87100] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-97r5e87100] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-97r5e87100] { text-align: center; }
.text-muted[b-97r5e87100] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-97r5e87100], .crud-empty-state[b-97r5e87100] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-97r5e87100] { font-size: 2rem; }
.crud-spinner[b-97r5e87100] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-97r5e87100 0.6s linear infinite; }
.crud-spinner-sm[b-97r5e87100] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-97r5e87100 0.6s linear infinite; }
@keyframes spin-b-97r5e87100 { to { transform: rotate(360deg); } }
.spin[b-97r5e87100] { animation: spin-b-97r5e87100 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-97r5e87100] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-97r5e87100 0.15s ease-out; }
.modal-container[b-97r5e87100] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-97r5e87100] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-97r5e87100 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-97r5e87100] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-97r5e87100] { max-width: 420px; }
@keyframes fadeIn-b-97r5e87100 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-97r5e87100 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-97r5e87100] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-97r5e87100] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-97r5e87100] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-97r5e87100] { color: #dc2626; }
.modal-close[b-97r5e87100] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-97r5e87100] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-97r5e87100] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-97r5e87100] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-97r5e87100] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-97r5e87100] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-97r5e87100] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-97r5e87100] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-97r5e87100] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-97r5e87100] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-97r5e87100] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-97r5e87100] { flex: 2; }
.form-group label[b-97r5e87100] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-97r5e87100], .form-group select[b-97r5e87100], .form-textarea[b-97r5e87100] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-97r5e87100], .form-group select:focus[b-97r5e87100], .form-textarea:focus[b-97r5e87100] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-97r5e87100] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-97r5e87100] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-97r5e87100] { flex: 1; display: flex; align-items: center; }
.form-check[b-97r5e87100] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-97r5e87100] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-97r5e87100] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-97r5e87100] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-97r5e87100] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-97r5e87100] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-97r5e87100] { font-size: 3rem; }
.photo-placeholder span[b-97r5e87100] { font-size: 0.78rem; }
.photo-actions[b-97r5e87100] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-97r5e87100] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-97r5e87100] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-97r5e87100] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-97r5e87100] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-97r5e87100] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-97r5e87100] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-97r5e87100] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-97r5e87100] { filter: brightness(1.15); transform: scale(1.05); }
[b-97r5e87100] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-97r5e87100] { padding: 0.75rem; }
    .crud-header[b-97r5e87100] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-97r5e87100] { font-size: 1.1rem; }
    .btn-text[b-97r5e87100] { display: none; }
    .form-row[b-97r5e87100] { flex-direction: column; }
    .form-row-4[b-97r5e87100] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-97r5e87100] { width: 98%; max-height: 95vh; }
    .modal-lg[b-97r5e87100] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-97r5e87100] { padding: 0.75rem; }
    .modal-tabs[b-97r5e87100] { overflow-x: auto; }
    .modal-tab[b-97r5e87100] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-97r5e87100] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-97r5e87100] { display: grid !important; }
    .crud-cards-wrapper[b-97r5e87100] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-97r5e87100] { grid-template-columns: 1fr; }
    .card-details[b-97r5e87100] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-97r5e87100] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-97r5e87100] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-97r5e87100] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-97r5e87100] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeoingresogestor.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-tzaam2rxu9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-tzaam2rxu9 0.3s ease-out; }
@keyframes slideUp-b-tzaam2rxu9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-tzaam2rxu9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tzaam2rxu9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-tzaam2rxu9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-tzaam2rxu9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-tzaam2rxu9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-tzaam2rxu9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-tzaam2rxu9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-tzaam2rxu9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tzaam2rxu9] { filter: brightness(1.1); }
.btn-outline[b-tzaam2rxu9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-tzaam2rxu9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-tzaam2rxu9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-tzaam2rxu9] { filter: brightness(1.1); }
.btn-icon[b-tzaam2rxu9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-tzaam2rxu9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-tzaam2rxu9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-tzaam2rxu9] { color: #ef4444; }
.btn-delete:hover[b-tzaam2rxu9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-tzaam2rxu9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-tzaam2rxu9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-tzaam2rxu9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-tzaam2rxu9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-tzaam2rxu9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-tzaam2rxu9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-tzaam2rxu9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-tzaam2rxu9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-tzaam2rxu9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-tzaam2rxu9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-tzaam2rxu9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-tzaam2rxu9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-tzaam2rxu9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-tzaam2rxu9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-tzaam2rxu9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-tzaam2rxu9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-tzaam2rxu9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-tzaam2rxu9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-tzaam2rxu9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-tzaam2rxu9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-tzaam2rxu9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-tzaam2rxu9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-tzaam2rxu9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-tzaam2rxu9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-tzaam2rxu9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-tzaam2rxu9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-tzaam2rxu9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-tzaam2rxu9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-tzaam2rxu9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-tzaam2rxu9] { display: block; }
.hide-on-cards[b-tzaam2rxu9] { display: none !important; }
.show-on-cards[b-tzaam2rxu9] { display: grid; }
.hide-on-grid[b-tzaam2rxu9] { display: none !important; }

/* Badges */
.badge[b-tzaam2rxu9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-tzaam2rxu9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-tzaam2rxu9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-tzaam2rxu9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-tzaam2rxu9] { text-align: center; }
.text-muted[b-tzaam2rxu9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-tzaam2rxu9], .crud-empty-state[b-tzaam2rxu9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-tzaam2rxu9] { font-size: 2rem; }
.crud-spinner[b-tzaam2rxu9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-tzaam2rxu9 0.6s linear infinite; }
.crud-spinner-sm[b-tzaam2rxu9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-tzaam2rxu9 0.6s linear infinite; }
@keyframes spin-b-tzaam2rxu9 { to { transform: rotate(360deg); } }
.spin[b-tzaam2rxu9] { animation: spin-b-tzaam2rxu9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-tzaam2rxu9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-tzaam2rxu9 0.15s ease-out; }
.modal-container[b-tzaam2rxu9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-tzaam2rxu9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-tzaam2rxu9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-tzaam2rxu9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-tzaam2rxu9] { max-width: 420px; }
@keyframes fadeIn-b-tzaam2rxu9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-tzaam2rxu9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-tzaam2rxu9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-tzaam2rxu9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-tzaam2rxu9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-tzaam2rxu9] { color: #dc2626; }
.modal-close[b-tzaam2rxu9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-tzaam2rxu9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-tzaam2rxu9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tzaam2rxu9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-tzaam2rxu9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-tzaam2rxu9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-tzaam2rxu9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-tzaam2rxu9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-tzaam2rxu9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-tzaam2rxu9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-tzaam2rxu9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-tzaam2rxu9] { flex: 2; }
.form-group label[b-tzaam2rxu9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-tzaam2rxu9], .form-group select[b-tzaam2rxu9], .form-textarea[b-tzaam2rxu9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-tzaam2rxu9], .form-group select:focus[b-tzaam2rxu9], .form-textarea:focus[b-tzaam2rxu9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-tzaam2rxu9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-tzaam2rxu9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-tzaam2rxu9] { flex: 1; display: flex; align-items: center; }
.form-check[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-tzaam2rxu9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-tzaam2rxu9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-tzaam2rxu9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-tzaam2rxu9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-tzaam2rxu9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-tzaam2rxu9] { font-size: 3rem; }
.photo-placeholder span[b-tzaam2rxu9] { font-size: 0.78rem; }
.photo-actions[b-tzaam2rxu9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-tzaam2rxu9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-tzaam2rxu9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-tzaam2rxu9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-tzaam2rxu9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-tzaam2rxu9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-tzaam2rxu9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-tzaam2rxu9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-tzaam2rxu9] { filter: brightness(1.15); transform: scale(1.05); }
[b-tzaam2rxu9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-tzaam2rxu9] { padding: 0.75rem; }
    .crud-header[b-tzaam2rxu9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-tzaam2rxu9] { font-size: 1.1rem; }
    .btn-text[b-tzaam2rxu9] { display: none; }
    .form-row[b-tzaam2rxu9] { flex-direction: column; }
    .form-row-4[b-tzaam2rxu9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-tzaam2rxu9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-tzaam2rxu9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-tzaam2rxu9] { padding: 0.75rem; }
    .modal-tabs[b-tzaam2rxu9] { overflow-x: auto; }
    .modal-tab[b-tzaam2rxu9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-tzaam2rxu9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-tzaam2rxu9] { display: grid !important; }
    .crud-cards-wrapper[b-tzaam2rxu9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-tzaam2rxu9] { grid-template-columns: 1fr; }
    .card-details[b-tzaam2rxu9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-tzaam2rxu9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-tzaam2rxu9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-tzaam2rxu9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-tzaam2rxu9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeorealizargestiones.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-90n6h7mn1f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-90n6h7mn1f 0.3s ease-out; }
@keyframes slideUp-b-90n6h7mn1f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-90n6h7mn1f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-90n6h7mn1f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-90n6h7mn1f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-90n6h7mn1f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-90n6h7mn1f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-90n6h7mn1f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-90n6h7mn1f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-90n6h7mn1f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-90n6h7mn1f] { filter: brightness(1.1); }
.btn-outline[b-90n6h7mn1f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-90n6h7mn1f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-90n6h7mn1f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-90n6h7mn1f] { filter: brightness(1.1); }
.btn-icon[b-90n6h7mn1f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-90n6h7mn1f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-90n6h7mn1f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-90n6h7mn1f] { color: #ef4444; }
.btn-delete:hover[b-90n6h7mn1f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-90n6h7mn1f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-90n6h7mn1f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-90n6h7mn1f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-90n6h7mn1f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-90n6h7mn1f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-90n6h7mn1f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-90n6h7mn1f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-90n6h7mn1f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-90n6h7mn1f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-90n6h7mn1f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-90n6h7mn1f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-90n6h7mn1f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-90n6h7mn1f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-90n6h7mn1f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-90n6h7mn1f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-90n6h7mn1f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-90n6h7mn1f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-90n6h7mn1f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-90n6h7mn1f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-90n6h7mn1f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-90n6h7mn1f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-90n6h7mn1f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-90n6h7mn1f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-90n6h7mn1f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-90n6h7mn1f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-90n6h7mn1f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-90n6h7mn1f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-90n6h7mn1f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-90n6h7mn1f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-90n6h7mn1f] { display: block; }
.hide-on-cards[b-90n6h7mn1f] { display: none !important; }
.show-on-cards[b-90n6h7mn1f] { display: grid; }
.hide-on-grid[b-90n6h7mn1f] { display: none !important; }

/* Badges */
.badge[b-90n6h7mn1f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-90n6h7mn1f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-90n6h7mn1f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-90n6h7mn1f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-90n6h7mn1f] { text-align: center; }
.text-muted[b-90n6h7mn1f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-90n6h7mn1f], .crud-empty-state[b-90n6h7mn1f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-90n6h7mn1f] { font-size: 2rem; }
.crud-spinner[b-90n6h7mn1f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-90n6h7mn1f 0.6s linear infinite; }
.crud-spinner-sm[b-90n6h7mn1f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-90n6h7mn1f 0.6s linear infinite; }
@keyframes spin-b-90n6h7mn1f { to { transform: rotate(360deg); } }
.spin[b-90n6h7mn1f] { animation: spin-b-90n6h7mn1f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-90n6h7mn1f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-90n6h7mn1f 0.15s ease-out; }
.modal-container[b-90n6h7mn1f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-90n6h7mn1f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-90n6h7mn1f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-90n6h7mn1f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-90n6h7mn1f] { max-width: 420px; }
@keyframes fadeIn-b-90n6h7mn1f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-90n6h7mn1f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-90n6h7mn1f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-90n6h7mn1f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-90n6h7mn1f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-90n6h7mn1f] { color: #dc2626; }
.modal-close[b-90n6h7mn1f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-90n6h7mn1f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-90n6h7mn1f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-90n6h7mn1f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-90n6h7mn1f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-90n6h7mn1f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-90n6h7mn1f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-90n6h7mn1f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-90n6h7mn1f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-90n6h7mn1f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-90n6h7mn1f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-90n6h7mn1f] { flex: 2; }
.form-group label[b-90n6h7mn1f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-90n6h7mn1f], .form-group select[b-90n6h7mn1f], .form-textarea[b-90n6h7mn1f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-90n6h7mn1f], .form-group select:focus[b-90n6h7mn1f], .form-textarea:focus[b-90n6h7mn1f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-90n6h7mn1f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-90n6h7mn1f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-90n6h7mn1f] { flex: 1; display: flex; align-items: center; }
.form-check[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-90n6h7mn1f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-90n6h7mn1f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-90n6h7mn1f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-90n6h7mn1f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-90n6h7mn1f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-90n6h7mn1f] { font-size: 3rem; }
.photo-placeholder span[b-90n6h7mn1f] { font-size: 0.78rem; }
.photo-actions[b-90n6h7mn1f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-90n6h7mn1f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-90n6h7mn1f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-90n6h7mn1f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-90n6h7mn1f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-90n6h7mn1f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-90n6h7mn1f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-90n6h7mn1f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-90n6h7mn1f] { filter: brightness(1.15); transform: scale(1.05); }
[b-90n6h7mn1f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-90n6h7mn1f] { padding: 0.75rem; }
    .crud-header[b-90n6h7mn1f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-90n6h7mn1f] { font-size: 1.1rem; }
    .btn-text[b-90n6h7mn1f] { display: none; }
    .form-row[b-90n6h7mn1f] { flex-direction: column; }
    .form-row-4[b-90n6h7mn1f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-90n6h7mn1f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-90n6h7mn1f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-90n6h7mn1f] { padding: 0.75rem; }
    .modal-tabs[b-90n6h7mn1f] { overflow-x: auto; }
    .modal-tab[b-90n6h7mn1f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-90n6h7mn1f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-90n6h7mn1f] { display: grid !important; }
    .crud-cards-wrapper[b-90n6h7mn1f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-90n6h7mn1f] { grid-template-columns: 1fr; }
    .card-details[b-90n6h7mn1f] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-90n6h7mn1f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-90n6h7mn1f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-90n6h7mn1f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-90n6h7mn1f] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeoresumenadm.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-5crzq0tjl9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5crzq0tjl9 0.3s ease-out; }
@keyframes slideUp-b-5crzq0tjl9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5crzq0tjl9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5crzq0tjl9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5crzq0tjl9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5crzq0tjl9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5crzq0tjl9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5crzq0tjl9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5crzq0tjl9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5crzq0tjl9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5crzq0tjl9] { filter: brightness(1.1); }
.btn-outline[b-5crzq0tjl9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5crzq0tjl9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5crzq0tjl9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5crzq0tjl9] { filter: brightness(1.1); }
.btn-icon[b-5crzq0tjl9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5crzq0tjl9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5crzq0tjl9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5crzq0tjl9] { color: #ef4444; }
.btn-delete:hover[b-5crzq0tjl9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-5crzq0tjl9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5crzq0tjl9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-5crzq0tjl9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-5crzq0tjl9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5crzq0tjl9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5crzq0tjl9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-5crzq0tjl9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5crzq0tjl9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-5crzq0tjl9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5crzq0tjl9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5crzq0tjl9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5crzq0tjl9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-5crzq0tjl9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5crzq0tjl9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-5crzq0tjl9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-5crzq0tjl9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-5crzq0tjl9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-5crzq0tjl9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-5crzq0tjl9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-5crzq0tjl9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-5crzq0tjl9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-5crzq0tjl9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-5crzq0tjl9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-5crzq0tjl9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-5crzq0tjl9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-5crzq0tjl9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-5crzq0tjl9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-5crzq0tjl9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-5crzq0tjl9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-5crzq0tjl9] { display: block; }
.hide-on-cards[b-5crzq0tjl9] { display: none !important; }
.show-on-cards[b-5crzq0tjl9] { display: grid; }
.hide-on-grid[b-5crzq0tjl9] { display: none !important; }

/* Badges */
.badge[b-5crzq0tjl9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5crzq0tjl9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-5crzq0tjl9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-5crzq0tjl9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-5crzq0tjl9] { text-align: center; }
.text-muted[b-5crzq0tjl9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-5crzq0tjl9], .crud-empty-state[b-5crzq0tjl9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5crzq0tjl9] { font-size: 2rem; }
.crud-spinner[b-5crzq0tjl9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5crzq0tjl9 0.6s linear infinite; }
.crud-spinner-sm[b-5crzq0tjl9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5crzq0tjl9 0.6s linear infinite; }
@keyframes spin-b-5crzq0tjl9 { to { transform: rotate(360deg); } }
.spin[b-5crzq0tjl9] { animation: spin-b-5crzq0tjl9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-5crzq0tjl9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5crzq0tjl9 0.15s ease-out; }
.modal-container[b-5crzq0tjl9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5crzq0tjl9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5crzq0tjl9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-5crzq0tjl9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-5crzq0tjl9] { max-width: 420px; }
@keyframes fadeIn-b-5crzq0tjl9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5crzq0tjl9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-5crzq0tjl9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5crzq0tjl9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-5crzq0tjl9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-5crzq0tjl9] { color: #dc2626; }
.modal-close[b-5crzq0tjl9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5crzq0tjl9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5crzq0tjl9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5crzq0tjl9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-5crzq0tjl9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-5crzq0tjl9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-5crzq0tjl9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-5crzq0tjl9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-5crzq0tjl9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-5crzq0tjl9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-5crzq0tjl9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-5crzq0tjl9] { flex: 2; }
.form-group label[b-5crzq0tjl9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5crzq0tjl9], .form-group select[b-5crzq0tjl9], .form-textarea[b-5crzq0tjl9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5crzq0tjl9], .form-group select:focus[b-5crzq0tjl9], .form-textarea:focus[b-5crzq0tjl9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-5crzq0tjl9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-5crzq0tjl9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-5crzq0tjl9] { flex: 1; display: flex; align-items: center; }
.form-check[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-5crzq0tjl9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-5crzq0tjl9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-5crzq0tjl9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-5crzq0tjl9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-5crzq0tjl9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-5crzq0tjl9] { font-size: 3rem; }
.photo-placeholder span[b-5crzq0tjl9] { font-size: 0.78rem; }
.photo-actions[b-5crzq0tjl9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-5crzq0tjl9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-5crzq0tjl9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-5crzq0tjl9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-5crzq0tjl9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-5crzq0tjl9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-5crzq0tjl9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-5crzq0tjl9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-5crzq0tjl9] { filter: brightness(1.15); transform: scale(1.05); }
[b-5crzq0tjl9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-5crzq0tjl9] { padding: 0.75rem; }
    .crud-header[b-5crzq0tjl9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5crzq0tjl9] { font-size: 1.1rem; }
    .btn-text[b-5crzq0tjl9] { display: none; }
    .form-row[b-5crzq0tjl9] { flex-direction: column; }
    .form-row-4[b-5crzq0tjl9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-5crzq0tjl9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-5crzq0tjl9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-5crzq0tjl9] { padding: 0.75rem; }
    .modal-tabs[b-5crzq0tjl9] { overflow-x: auto; }
    .modal-tab[b-5crzq0tjl9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-5crzq0tjl9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-5crzq0tjl9] { display: grid !important; }
    .crud-cards-wrapper[b-5crzq0tjl9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-5crzq0tjl9] { grid-template-columns: 1fr; }
    .card-details[b-5crzq0tjl9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-5crzq0tjl9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5crzq0tjl9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5crzq0tjl9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5crzq0tjl9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mercadeo/Mercadeosincronizaciontiendas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-azd2z1e857] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-azd2z1e857 0.3s ease-out; }
@keyframes slideUp-b-azd2z1e857 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-azd2z1e857] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-azd2z1e857] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-azd2z1e857] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-azd2z1e857] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-azd2z1e857] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-azd2z1e857] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-azd2z1e857] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-azd2z1e857] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-azd2z1e857] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-azd2z1e857] { filter: brightness(1.1); }
.btn-outline[b-azd2z1e857] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-azd2z1e857] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-azd2z1e857] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-azd2z1e857] { filter: brightness(1.1); }
.btn-icon[b-azd2z1e857] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-azd2z1e857] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-azd2z1e857] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-azd2z1e857] { color: #ef4444; }
.btn-delete:hover[b-azd2z1e857] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-azd2z1e857] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-azd2z1e857] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-azd2z1e857] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-azd2z1e857] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-azd2z1e857] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-azd2z1e857] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-azd2z1e857] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-azd2z1e857] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-azd2z1e857] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-azd2z1e857] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-azd2z1e857] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-azd2z1e857] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-azd2z1e857] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-azd2z1e857] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-azd2z1e857] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-azd2z1e857] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-azd2z1e857] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-azd2z1e857] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-azd2z1e857] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-azd2z1e857] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-azd2z1e857] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-azd2z1e857] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-azd2z1e857] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-azd2z1e857] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-azd2z1e857] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-azd2z1e857] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-azd2z1e857] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-azd2z1e857] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-azd2z1e857] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-azd2z1e857] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-azd2z1e857] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-azd2z1e857] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-azd2z1e857] { display: block; }
.hide-on-cards[b-azd2z1e857] { display: none !important; }
.show-on-cards[b-azd2z1e857] { display: grid; }
.hide-on-grid[b-azd2z1e857] { display: none !important; }

/* Badges */
.badge[b-azd2z1e857] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-azd2z1e857] { background: #ecfdf5; color: #065f46; }
.badge-no[b-azd2z1e857] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-azd2z1e857] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-azd2z1e857] { text-align: center; }
.text-muted[b-azd2z1e857] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-azd2z1e857], .crud-empty-state[b-azd2z1e857] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-azd2z1e857] { font-size: 2rem; }
.crud-spinner[b-azd2z1e857] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-azd2z1e857 0.6s linear infinite; }
.crud-spinner-sm[b-azd2z1e857] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-azd2z1e857 0.6s linear infinite; }
@keyframes spin-b-azd2z1e857 { to { transform: rotate(360deg); } }
.spin[b-azd2z1e857] { animation: spin-b-azd2z1e857 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-azd2z1e857] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-azd2z1e857 0.15s ease-out; }
.modal-container[b-azd2z1e857] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-azd2z1e857] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-azd2z1e857 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-azd2z1e857] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-azd2z1e857] { max-width: 420px; }
@keyframes fadeIn-b-azd2z1e857 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-azd2z1e857 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-azd2z1e857] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-azd2z1e857] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-azd2z1e857] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-azd2z1e857] { color: #dc2626; }
.modal-close[b-azd2z1e857] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-azd2z1e857] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-azd2z1e857] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-azd2z1e857] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-azd2z1e857] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-azd2z1e857] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-azd2z1e857] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-azd2z1e857] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-azd2z1e857] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-azd2z1e857] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-azd2z1e857] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-azd2z1e857] { flex: 2; }
.form-group label[b-azd2z1e857] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-azd2z1e857], .form-group select[b-azd2z1e857], .form-textarea[b-azd2z1e857] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-azd2z1e857], .form-group select:focus[b-azd2z1e857], .form-textarea:focus[b-azd2z1e857] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-azd2z1e857] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-azd2z1e857] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-azd2z1e857] { flex: 1; display: flex; align-items: center; }
.form-check[b-azd2z1e857] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-azd2z1e857] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-azd2z1e857] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-azd2z1e857] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-azd2z1e857] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-azd2z1e857] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-azd2z1e857] { font-size: 3rem; }
.photo-placeholder span[b-azd2z1e857] { font-size: 0.78rem; }
.photo-actions[b-azd2z1e857] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-azd2z1e857] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-azd2z1e857] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-azd2z1e857] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-azd2z1e857] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-azd2z1e857] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-azd2z1e857] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-azd2z1e857] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-azd2z1e857] { filter: brightness(1.15); transform: scale(1.05); }
[b-azd2z1e857] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-azd2z1e857] { padding: 0.75rem; }
    .crud-header[b-azd2z1e857] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-azd2z1e857] { font-size: 1.1rem; }
    .btn-text[b-azd2z1e857] { display: none; }
    .form-row[b-azd2z1e857] { flex-direction: column; }
    .form-row-4[b-azd2z1e857] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-azd2z1e857] { width: 98%; max-height: 95vh; }
    .modal-lg[b-azd2z1e857] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-azd2z1e857] { padding: 0.75rem; }
    .modal-tabs[b-azd2z1e857] { overflow-x: auto; }
    .modal-tab[b-azd2z1e857] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-azd2z1e857] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-azd2z1e857] { display: grid !important; }
    .crud-cards-wrapper[b-azd2z1e857] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-azd2z1e857] { grid-template-columns: 1fr; }
    .card-details[b-azd2z1e857] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-azd2z1e857] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-azd2z1e857] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-azd2z1e857] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-azd2z1e857] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Bandeja.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-zrja5ktk6j] { padding: 1.25rem; }
.rg-slide-up[b-zrja5ktk6j] { animation: slideUp-b-zrja5ktk6j .35s ease both; }
@keyframes slideUp-b-zrja5ktk6j { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-zrja5ktk6j] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-zrja5ktk6j] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zrja5ktk6j] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-zrja5ktk6j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-zrja5ktk6j] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-zrja5ktk6j] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-zrja5ktk6j] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-zrja5ktk6j] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-zrja5ktk6j] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-zrja5ktk6j] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zrja5ktk6j] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-zrja5ktk6j] { background: transparent; }
.btn-danger[b-zrja5ktk6j] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-zrja5ktk6j] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-zrja5ktk6j] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-zrja5ktk6j] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-zrja5ktk6j] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-zrja5ktk6j] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-zrja5ktk6j 1s linear infinite; }
@keyframes spin-b-zrja5ktk6j { to { transform: rotate(360deg); } }
.spin[b-zrja5ktk6j] { animation: spin-b-zrja5ktk6j 1s linear infinite; display: inline-block; }
.crud-empty-state[b-zrja5ktk6j] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-zrja5ktk6j] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-zrja5ktk6j] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-zrja5ktk6j] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-zrja5ktk6j] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-zrja5ktk6j] { max-width: 800px; }
.modal-header[b-zrja5ktk6j] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-zrja5ktk6j] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-zrja5ktk6j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-zrja5ktk6j] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zrja5ktk6j] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); }
.help-body[b-zrja5ktk6j] { padding: 0; }
.help-section[b-zrja5ktk6j] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-zrja5ktk6j] { border-bottom: none; }
.help-section p[b-zrja5ktk6j], .help-section li[b-zrja5ktk6j] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-zrja5ktk6j] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); }
.help-tip[b-zrja5ktk6j] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-zrja5ktk6j] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-zrja5ktk6j] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-zrja5ktk6j] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-zrja5ktk6j] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-zrja5ktk6j] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-zrja5ktk6j] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-zrja5ktk6j] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-zrja5ktk6j] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-zrja5ktk6j] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-zrja5ktk6j] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-zrja5ktk6j] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-zrja5ktk6j] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-zrja5ktk6j] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-zrja5ktk6j] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-zrja5ktk6j] { color: #67e8f9; }

.ma-row-grid[b-zrja5ktk6j] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-zrja5ktk6j] { grid-template-columns: 1fr; } }
.ma-chart-card[b-zrja5ktk6j] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-zrja5ktk6j] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-zrja5ktk6j] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-zrja5ktk6j] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-zrja5ktk6j] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-zrja5ktk6j] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-zrja5ktk6j] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-zrja5ktk6j] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-zrja5ktk6j] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-zrja5ktk6j] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-zrja5ktk6j] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-zrja5ktk6j] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-zrja5ktk6j] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-zrja5ktk6j] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-zrja5ktk6j] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-zrja5ktk6j] { background: var(--rg-bg-subtle); }
.crud-table th[b-zrja5ktk6j] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-zrja5ktk6j] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-zrja5ktk6j] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-zrja5ktk6j] { background: var(--rg-bg-hover); }
.font-mono[b-zrja5ktk6j] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-zrja5ktk6j] { text-align: center; }
.col-actions[b-zrja5ktk6j] { text-align: right; white-space: nowrap; }
.btn-icon[b-zrja5ktk6j] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-zrja5ktk6j] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-zrja5ktk6j] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-zrja5ktk6j] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-zrja5ktk6j] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-zrja5ktk6j] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-zrja5ktk6j] { color: #86efac; }
[data-mode="dark"] .badge-no[b-zrja5ktk6j] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-zrja5ktk6j] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-zrja5ktk6j] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-zrja5ktk6j] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-zrja5ktk6j] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-zrja5ktk6j] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-zrja5ktk6j] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-zrja5ktk6j] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-zrja5ktk6j] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-zrja5ktk6j] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-zrja5ktk6j] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-zrja5ktk6j] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-zrja5ktk6j] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-zrja5ktk6j] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-zrja5ktk6j] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-zrja5ktk6j] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-zrja5ktk6j] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-zrja5ktk6j] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-zrja5ktk6j] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-zrja5ktk6j] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-zrja5ktk6j] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-zrja5ktk6j] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-zrja5ktk6j] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-zrja5ktk6j] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-zrja5ktk6j] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-zrja5ktk6j] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-zrja5ktk6j] { color: var(--rg-accent, #2563eb); }
.crud-count[b-zrja5ktk6j] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-zrja5ktk6j] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-zrja5ktk6j], .ma-filters input[b-zrja5ktk6j] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-zrja5ktk6j] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-zrja5ktk6j] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-zrja5ktk6j] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-zrja5ktk6j] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-zrja5ktk6j] { color: #fca5a5; }
.crud-alert-close[b-zrja5ktk6j] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-zrja5ktk6j] { margin-bottom: 0.9rem; }
.form-group label[b-zrja5ktk6j] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-zrja5ktk6j], .form-group select[b-zrja5ktk6j], .form-group textarea[b-zrja5ktk6j] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-zrja5ktk6j] { min-height: 80px; resize: vertical; }
.form-row-2[b-zrja5ktk6j] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-zrja5ktk6j] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-zrja5ktk6j] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-zrja5ktk6j] { width: auto; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Categorias.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-fwtlvffdd1] { padding: 1.25rem; }
.rg-slide-up[b-fwtlvffdd1] { animation: slideUp-b-fwtlvffdd1 .35s ease both; }
@keyframes slideUp-b-fwtlvffdd1 { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-fwtlvffdd1] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-fwtlvffdd1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fwtlvffdd1] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-fwtlvffdd1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-fwtlvffdd1] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-fwtlvffdd1] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-fwtlvffdd1] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-fwtlvffdd1] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-fwtlvffdd1] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-fwtlvffdd1] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fwtlvffdd1] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-fwtlvffdd1] { background: transparent; }
.btn-danger[b-fwtlvffdd1] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-fwtlvffdd1] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-fwtlvffdd1] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-fwtlvffdd1] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-fwtlvffdd1] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-fwtlvffdd1] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-fwtlvffdd1 1s linear infinite; }
@keyframes spin-b-fwtlvffdd1 { to { transform: rotate(360deg); } }
.spin[b-fwtlvffdd1] { animation: spin-b-fwtlvffdd1 1s linear infinite; display: inline-block; }
.crud-empty-state[b-fwtlvffdd1] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-fwtlvffdd1] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-fwtlvffdd1] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-fwtlvffdd1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-fwtlvffdd1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-fwtlvffdd1] { max-width: 800px; }
.modal-header[b-fwtlvffdd1] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-fwtlvffdd1] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-fwtlvffdd1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-fwtlvffdd1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fwtlvffdd1] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); }
.help-body[b-fwtlvffdd1] { padding: 0; }
.help-section[b-fwtlvffdd1] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-fwtlvffdd1] { border-bottom: none; }
.help-section p[b-fwtlvffdd1], .help-section li[b-fwtlvffdd1] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-fwtlvffdd1] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); }
.help-tip[b-fwtlvffdd1] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-fwtlvffdd1] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-fwtlvffdd1] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-fwtlvffdd1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-fwtlvffdd1] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-fwtlvffdd1] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-fwtlvffdd1] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-fwtlvffdd1] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-fwtlvffdd1] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-fwtlvffdd1] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-fwtlvffdd1] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-fwtlvffdd1] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-fwtlvffdd1] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-fwtlvffdd1] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-fwtlvffdd1] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-fwtlvffdd1] { color: #67e8f9; }

.ma-row-grid[b-fwtlvffdd1] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-fwtlvffdd1] { grid-template-columns: 1fr; } }
.ma-chart-card[b-fwtlvffdd1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-fwtlvffdd1] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-fwtlvffdd1] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-fwtlvffdd1] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-fwtlvffdd1] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-fwtlvffdd1] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-fwtlvffdd1] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-fwtlvffdd1] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-fwtlvffdd1] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-fwtlvffdd1] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-fwtlvffdd1] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-fwtlvffdd1] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-fwtlvffdd1] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-fwtlvffdd1] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-fwtlvffdd1] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-fwtlvffdd1] { background: var(--rg-bg-subtle); }
.crud-table th[b-fwtlvffdd1] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-fwtlvffdd1] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-fwtlvffdd1] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-fwtlvffdd1] { background: var(--rg-bg-hover); }
.font-mono[b-fwtlvffdd1] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-fwtlvffdd1] { text-align: center; }
.col-actions[b-fwtlvffdd1] { text-align: right; white-space: nowrap; }
.btn-icon[b-fwtlvffdd1] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-fwtlvffdd1] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-fwtlvffdd1] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-fwtlvffdd1] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-fwtlvffdd1] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-fwtlvffdd1] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-fwtlvffdd1] { color: #86efac; }
[data-mode="dark"] .badge-no[b-fwtlvffdd1] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-fwtlvffdd1] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-fwtlvffdd1] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-fwtlvffdd1] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-fwtlvffdd1] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-fwtlvffdd1] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-fwtlvffdd1] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-fwtlvffdd1] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-fwtlvffdd1] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-fwtlvffdd1] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-fwtlvffdd1] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-fwtlvffdd1] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-fwtlvffdd1] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-fwtlvffdd1] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-fwtlvffdd1] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-fwtlvffdd1] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-fwtlvffdd1] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-fwtlvffdd1] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-fwtlvffdd1] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-fwtlvffdd1] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-fwtlvffdd1] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-fwtlvffdd1] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-fwtlvffdd1] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-fwtlvffdd1] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-fwtlvffdd1] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-fwtlvffdd1] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-fwtlvffdd1] { color: var(--rg-accent, #2563eb); }
.crud-count[b-fwtlvffdd1] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-fwtlvffdd1] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-fwtlvffdd1], .ma-filters input[b-fwtlvffdd1] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-fwtlvffdd1] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-fwtlvffdd1] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-fwtlvffdd1] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-fwtlvffdd1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-fwtlvffdd1] { color: #fca5a5; }
.crud-alert-close[b-fwtlvffdd1] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-fwtlvffdd1] { margin-bottom: 0.9rem; }
.form-group label[b-fwtlvffdd1] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-fwtlvffdd1], .form-group select[b-fwtlvffdd1], .form-group textarea[b-fwtlvffdd1] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-fwtlvffdd1] { min-height: 80px; resize: vertical; }
.form-row-2[b-fwtlvffdd1] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-fwtlvffdd1] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-fwtlvffdd1] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-fwtlvffdd1] { width: auto; }

.form-check-group[b-fwtlvffdd1] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Dashboard.razor.rz.scp.css */
/* === CRUD container (estándar copiado de Frmclientes) === */
.crud-container[b-1f3o27kby2] { padding: 1.25rem; }
.rg-slide-up[b-1f3o27kby2] { animation: slideUp-b-1f3o27kby2 .35s ease both; }
@keyframes slideUp-b-1f3o27kby2 { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-1f3o27kby2] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-1f3o27kby2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1f3o27kby2] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-1f3o27kby2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-1f3o27kby2] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-1f3o27kby2] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-1f3o27kby2] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-1f3o27kby2] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-1f3o27kby2] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-1f3o27kby2] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1f3o27kby2] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-1f3o27kby2] { background: transparent; }
.btn-danger[b-1f3o27kby2] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-1f3o27kby2] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-1f3o27kby2] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-1f3o27kby2] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-1f3o27kby2] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-1f3o27kby2] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-1f3o27kby2 1s linear infinite; }
@keyframes spin-b-1f3o27kby2 { to { transform: rotate(360deg); } }
.spin[b-1f3o27kby2] { animation: spin-b-1f3o27kby2 1s linear infinite; display: inline-block; }
.crud-empty-state[b-1f3o27kby2] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-1f3o27kby2] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-1f3o27kby2] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-1f3o27kby2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-1f3o27kby2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-1f3o27kby2] { max-width: 800px; }
.modal-header[b-1f3o27kby2] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-1f3o27kby2] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-1f3o27kby2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-1f3o27kby2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1f3o27kby2] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); }
.help-body[b-1f3o27kby2] { padding: 0; }
.help-section[b-1f3o27kby2] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-1f3o27kby2] { border-bottom: none; }
.help-section p[b-1f3o27kby2], .help-section li[b-1f3o27kby2] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-1f3o27kby2] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); }
.help-tip[b-1f3o27kby2] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-1f3o27kby2] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-1f3o27kby2] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-1f3o27kby2] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-1f3o27kby2] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-1f3o27kby2] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-1f3o27kby2] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-1f3o27kby2] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-1f3o27kby2] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-1f3o27kby2] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-1f3o27kby2] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-1f3o27kby2] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-1f3o27kby2] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-1f3o27kby2] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-1f3o27kby2] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-1f3o27kby2] { color: #67e8f9; }

.ma-row-grid[b-1f3o27kby2] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-1f3o27kby2] { grid-template-columns: 1fr; } }
.ma-chart-card[b-1f3o27kby2] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-1f3o27kby2] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-1f3o27kby2] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-1f3o27kby2] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-1f3o27kby2] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-1f3o27kby2] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-1f3o27kby2] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-1f3o27kby2] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-1f3o27kby2] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-1f3o27kby2] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-1f3o27kby2] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-1f3o27kby2] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-1f3o27kby2] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-1f3o27kby2] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-1f3o27kby2] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-1f3o27kby2] { background: var(--rg-bg-subtle); }
.crud-table th[b-1f3o27kby2] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-1f3o27kby2] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-1f3o27kby2] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-1f3o27kby2] { background: var(--rg-bg-hover); }
.font-mono[b-1f3o27kby2] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-1f3o27kby2] { text-align: center; }
.col-actions[b-1f3o27kby2] { text-align: right; white-space: nowrap; }
.btn-icon[b-1f3o27kby2] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-1f3o27kby2] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-1f3o27kby2] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-1f3o27kby2] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-1f3o27kby2] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-1f3o27kby2] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-1f3o27kby2] { color: #86efac; }
[data-mode="dark"] .badge-no[b-1f3o27kby2] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-1f3o27kby2] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-1f3o27kby2] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-1f3o27kby2] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-1f3o27kby2] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-1f3o27kby2] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-1f3o27kby2] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-1f3o27kby2] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-1f3o27kby2] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-1f3o27kby2] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-1f3o27kby2] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-1f3o27kby2] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-1f3o27kby2] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-1f3o27kby2] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-1f3o27kby2] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-1f3o27kby2] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-1f3o27kby2] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-1f3o27kby2] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-1f3o27kby2] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-1f3o27kby2] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-1f3o27kby2] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-1f3o27kby2] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-1f3o27kby2] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-1f3o27kby2] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-1f3o27kby2] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-1f3o27kby2] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-1f3o27kby2] { color: var(--rg-accent, #2563eb); }
.crud-count[b-1f3o27kby2] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-1f3o27kby2] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-1f3o27kby2], .ma-filters input[b-1f3o27kby2] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-1f3o27kby2] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-1f3o27kby2] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-1f3o27kby2] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-1f3o27kby2] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-1f3o27kby2] { color: #fca5a5; }
.crud-alert-close[b-1f3o27kby2] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-1f3o27kby2] { margin-bottom: 0.9rem; }
.form-group label[b-1f3o27kby2] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-1f3o27kby2], .form-group select[b-1f3o27kby2], .form-group textarea[b-1f3o27kby2] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-1f3o27kby2] { min-height: 80px; resize: vertical; }
.form-row-2[b-1f3o27kby2] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-1f3o27kby2] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-1f3o27kby2] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-1f3o27kby2] { width: auto; }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Detalle.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-juvm1qq23b] { padding: 1.25rem; }
.rg-slide-up[b-juvm1qq23b] { animation: slideUp-b-juvm1qq23b .35s ease both; }
@keyframes slideUp-b-juvm1qq23b { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-juvm1qq23b] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-juvm1qq23b] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-juvm1qq23b] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-juvm1qq23b] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-juvm1qq23b] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-juvm1qq23b] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-juvm1qq23b] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-juvm1qq23b] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-juvm1qq23b] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-juvm1qq23b] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-juvm1qq23b] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-juvm1qq23b] { background: transparent; }
.btn-danger[b-juvm1qq23b] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-juvm1qq23b] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-juvm1qq23b] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-juvm1qq23b] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-juvm1qq23b] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-juvm1qq23b] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-juvm1qq23b 1s linear infinite; }
@keyframes spin-b-juvm1qq23b { to { transform: rotate(360deg); } }
.spin[b-juvm1qq23b] { animation: spin-b-juvm1qq23b 1s linear infinite; display: inline-block; }
.crud-empty-state[b-juvm1qq23b] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-juvm1qq23b] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-juvm1qq23b] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-juvm1qq23b] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-juvm1qq23b] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-juvm1qq23b] { max-width: 800px; }
.modal-header[b-juvm1qq23b] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-juvm1qq23b] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-juvm1qq23b] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-juvm1qq23b] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-juvm1qq23b] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); }
.help-body[b-juvm1qq23b] { padding: 0; }
.help-section[b-juvm1qq23b] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-juvm1qq23b] { border-bottom: none; }
.help-section p[b-juvm1qq23b], .help-section li[b-juvm1qq23b] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-juvm1qq23b] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); }
.help-tip[b-juvm1qq23b] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-juvm1qq23b] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-juvm1qq23b] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-juvm1qq23b] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-juvm1qq23b] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-juvm1qq23b] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-juvm1qq23b] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-juvm1qq23b] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-juvm1qq23b] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-juvm1qq23b] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-juvm1qq23b] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-juvm1qq23b] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-juvm1qq23b] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-juvm1qq23b] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-juvm1qq23b] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-juvm1qq23b] { color: #67e8f9; }

.ma-row-grid[b-juvm1qq23b] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-juvm1qq23b] { grid-template-columns: 1fr; } }
.ma-chart-card[b-juvm1qq23b] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-juvm1qq23b] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-juvm1qq23b] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-juvm1qq23b] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-juvm1qq23b] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-juvm1qq23b] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-juvm1qq23b] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-juvm1qq23b] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-juvm1qq23b] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-juvm1qq23b] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-juvm1qq23b] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-juvm1qq23b] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-juvm1qq23b] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-juvm1qq23b] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-juvm1qq23b] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-juvm1qq23b] { background: var(--rg-bg-subtle); }
.crud-table th[b-juvm1qq23b] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-juvm1qq23b] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-juvm1qq23b] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-juvm1qq23b] { background: var(--rg-bg-hover); }
.font-mono[b-juvm1qq23b] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-juvm1qq23b] { text-align: center; }
.col-actions[b-juvm1qq23b] { text-align: right; white-space: nowrap; }
.btn-icon[b-juvm1qq23b] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-juvm1qq23b] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-juvm1qq23b] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-juvm1qq23b] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-juvm1qq23b] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-juvm1qq23b] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-juvm1qq23b] { color: #86efac; }
[data-mode="dark"] .badge-no[b-juvm1qq23b] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-juvm1qq23b] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-juvm1qq23b] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-juvm1qq23b] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-juvm1qq23b] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-juvm1qq23b] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-juvm1qq23b] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-juvm1qq23b] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-juvm1qq23b] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-juvm1qq23b] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-juvm1qq23b] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-juvm1qq23b] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-juvm1qq23b] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-juvm1qq23b] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-juvm1qq23b] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-juvm1qq23b] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-juvm1qq23b] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-juvm1qq23b] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-juvm1qq23b] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-juvm1qq23b] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-juvm1qq23b] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-juvm1qq23b] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-juvm1qq23b] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-juvm1qq23b] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-juvm1qq23b] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-juvm1qq23b] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-juvm1qq23b] { color: var(--rg-accent, #2563eb); }
.crud-count[b-juvm1qq23b] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-juvm1qq23b] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-juvm1qq23b], .ma-filters input[b-juvm1qq23b] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-juvm1qq23b] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-juvm1qq23b] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-juvm1qq23b] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-juvm1qq23b] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-juvm1qq23b] { color: #fca5a5; }
.crud-alert-close[b-juvm1qq23b] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-juvm1qq23b] { margin-bottom: 0.9rem; }
.form-group label[b-juvm1qq23b] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-juvm1qq23b], .form-group select[b-juvm1qq23b], .form-group textarea[b-juvm1qq23b] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-juvm1qq23b] { min-height: 80px; resize: vertical; }
.form-row-2[b-juvm1qq23b] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-juvm1qq23b] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-juvm1qq23b] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-juvm1qq23b] { width: auto; }

.det-grid[b-juvm1qq23b] { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; }
@media (max-width: 900px) { .det-grid[b-juvm1qq23b] { grid-template-columns: 1fr; } }
.info-row[b-juvm1qq23b] { display: flex; padding: 0.45rem 0; border-bottom: 1px solid var(--rg-border); font-size: 0.84rem; }
.info-row:last-child[b-juvm1qq23b] { border-bottom: none; }
.info-k[b-juvm1qq23b] { width: 130px; color: var(--rg-text-muted); }
.info-v[b-juvm1qq23b] { color: var(--rg-text-primary); font-weight: 500; flex: 1; }
.txt-success[b-juvm1qq23b] { color: #16a34a; }
.txt-danger[b-juvm1qq23b] { color: #dc2626; font-weight: 700; }
[data-mode="dark"] .txt-success[b-juvm1qq23b] { color: #4ade80; }
[data-mode="dark"] .txt-danger[b-juvm1qq23b] { color: #f87171; }
.timeline[b-juvm1qq23b] { position: relative; padding-left: 1.5rem; }
.timeline[b-juvm1qq23b]::before { content: ''; position: absolute; left: 6px; top: 0; bottom: 0; width: 2px; background: var(--rg-border); }
.tl-item[b-juvm1qq23b] { position: relative; padding-bottom: 1rem; }
.tl-item[b-juvm1qq23b]::before { content: ''; position: absolute; left: -1.5rem; top: 5px; width: 14px; height: 14px; border-radius: 50%; background: var(--rg-accent, #2563eb); border: 3px solid var(--rg-bg-card); }
.tl-item.internal[b-juvm1qq23b]::before { background: #d97706; }
.tl-meta[b-juvm1qq23b] { font-size: 0.74rem; color: var(--rg-text-muted); margin-bottom: 0.2rem; }
.tl-meta strong[b-juvm1qq23b] { color: var(--rg-text-primary); margin-right: 0.3rem; }
.tl-body[b-juvm1qq23b] { font-size: 0.86rem; color: var(--rg-text-secondary); background: var(--rg-bg-subtle); border-radius: 0.4rem; padding: 0.55rem 0.7rem; border-left: 3px solid var(--rg-accent, #2563eb); white-space: pre-wrap; }
.tl-item.internal .tl-body[b-juvm1qq23b] { border-left-color: #d97706; }

/* Adjuntos */
.adj-grid[b-juvm1qq23b] { display: flex; flex-direction: column; gap: 0.5rem; }
.adj-item[b-juvm1qq23b] { display: flex; align-items: center; gap: 0.6rem; padding: 0.55rem 0.7rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.4rem; }
.adj-item > i[b-juvm1qq23b] { font-size: 1.4rem; color: var(--rg-accent, #2563eb); flex-shrink: 0; }
.adj-info[b-juvm1qq23b] { flex: 1; min-width: 0; }
.adj-name[b-juvm1qq23b] { font-size: 0.86rem; font-weight: 600; color: var(--rg-text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adj-meta[b-juvm1qq23b] { font-size: 0.74rem; color: var(--rg-text-muted); }
.adj-file-input[b-juvm1qq23b] { position: absolute; left: -9999px; opacity: 0; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Equipo.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-eoh53p9k8n] { padding: 1.25rem; }
.rg-slide-up[b-eoh53p9k8n] { animation: slideUp-b-eoh53p9k8n .35s ease both; }
@keyframes slideUp-b-eoh53p9k8n { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-eoh53p9k8n] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-eoh53p9k8n] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eoh53p9k8n] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-eoh53p9k8n] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-eoh53p9k8n] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-eoh53p9k8n] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-eoh53p9k8n] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-eoh53p9k8n] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-eoh53p9k8n] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-eoh53p9k8n] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eoh53p9k8n] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-eoh53p9k8n] { background: transparent; }
.btn-danger[b-eoh53p9k8n] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-eoh53p9k8n] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-eoh53p9k8n] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-eoh53p9k8n] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-eoh53p9k8n] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-eoh53p9k8n] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-eoh53p9k8n 1s linear infinite; }
@keyframes spin-b-eoh53p9k8n { to { transform: rotate(360deg); } }
.spin[b-eoh53p9k8n] { animation: spin-b-eoh53p9k8n 1s linear infinite; display: inline-block; }
.crud-empty-state[b-eoh53p9k8n] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-eoh53p9k8n] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-eoh53p9k8n] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-eoh53p9k8n] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-eoh53p9k8n] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-eoh53p9k8n] { max-width: 800px; }
.modal-header[b-eoh53p9k8n] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-eoh53p9k8n] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-eoh53p9k8n] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-eoh53p9k8n] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eoh53p9k8n] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); }
.help-body[b-eoh53p9k8n] { padding: 0; }
.help-section[b-eoh53p9k8n] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-eoh53p9k8n] { border-bottom: none; }
.help-section p[b-eoh53p9k8n], .help-section li[b-eoh53p9k8n] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-eoh53p9k8n] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); }
.help-tip[b-eoh53p9k8n] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-eoh53p9k8n] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-eoh53p9k8n] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-eoh53p9k8n] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-eoh53p9k8n] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-eoh53p9k8n] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-eoh53p9k8n] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-eoh53p9k8n] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-eoh53p9k8n] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-eoh53p9k8n] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-eoh53p9k8n] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-eoh53p9k8n] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-eoh53p9k8n] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-eoh53p9k8n] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-eoh53p9k8n] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-eoh53p9k8n] { color: #67e8f9; }

.ma-row-grid[b-eoh53p9k8n] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-eoh53p9k8n] { grid-template-columns: 1fr; } }
.ma-chart-card[b-eoh53p9k8n] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-eoh53p9k8n] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-eoh53p9k8n] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-eoh53p9k8n] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-eoh53p9k8n] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-eoh53p9k8n] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-eoh53p9k8n] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-eoh53p9k8n] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-eoh53p9k8n] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-eoh53p9k8n] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-eoh53p9k8n] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-eoh53p9k8n] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-eoh53p9k8n] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-eoh53p9k8n] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-eoh53p9k8n] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-eoh53p9k8n] { background: var(--rg-bg-subtle); }
.crud-table th[b-eoh53p9k8n] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-eoh53p9k8n] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-eoh53p9k8n] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-eoh53p9k8n] { background: var(--rg-bg-hover); }
.font-mono[b-eoh53p9k8n] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-eoh53p9k8n] { text-align: center; }
.col-actions[b-eoh53p9k8n] { text-align: right; white-space: nowrap; }
.btn-icon[b-eoh53p9k8n] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-eoh53p9k8n] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-eoh53p9k8n] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-eoh53p9k8n] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-eoh53p9k8n] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-eoh53p9k8n] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-eoh53p9k8n] { color: #86efac; }
[data-mode="dark"] .badge-no[b-eoh53p9k8n] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-eoh53p9k8n] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-eoh53p9k8n] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-eoh53p9k8n] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-eoh53p9k8n] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-eoh53p9k8n] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-eoh53p9k8n] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-eoh53p9k8n] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-eoh53p9k8n] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-eoh53p9k8n] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-eoh53p9k8n] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-eoh53p9k8n] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-eoh53p9k8n] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-eoh53p9k8n] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-eoh53p9k8n] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-eoh53p9k8n] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-eoh53p9k8n] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-eoh53p9k8n] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-eoh53p9k8n] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-eoh53p9k8n] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-eoh53p9k8n] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-eoh53p9k8n] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-eoh53p9k8n] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-eoh53p9k8n] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-eoh53p9k8n] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-eoh53p9k8n] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-eoh53p9k8n] { color: var(--rg-accent, #2563eb); }
.crud-count[b-eoh53p9k8n] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-eoh53p9k8n] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-eoh53p9k8n], .ma-filters input[b-eoh53p9k8n] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-eoh53p9k8n] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-eoh53p9k8n] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-eoh53p9k8n] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-eoh53p9k8n] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-eoh53p9k8n] { color: #fca5a5; }
.crud-alert-close[b-eoh53p9k8n] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-eoh53p9k8n] { margin-bottom: 0.9rem; }
.form-group label[b-eoh53p9k8n] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-eoh53p9k8n], .form-group select[b-eoh53p9k8n], .form-group textarea[b-eoh53p9k8n] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-eoh53p9k8n] { min-height: 80px; resize: vertical; }
.form-row-2[b-eoh53p9k8n] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-eoh53p9k8n] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-eoh53p9k8n] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-eoh53p9k8n] { width: auto; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Equipos.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-ueg5w04ubz] { padding: 1.25rem; }
.rg-slide-up[b-ueg5w04ubz] { animation: slideUp-b-ueg5w04ubz .35s ease both; }
@keyframes slideUp-b-ueg5w04ubz { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-ueg5w04ubz] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-ueg5w04ubz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ueg5w04ubz] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-ueg5w04ubz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-ueg5w04ubz] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-ueg5w04ubz] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-ueg5w04ubz] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-ueg5w04ubz] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-ueg5w04ubz] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-ueg5w04ubz] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ueg5w04ubz] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-ueg5w04ubz] { background: transparent; }
.btn-danger[b-ueg5w04ubz] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-ueg5w04ubz] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-ueg5w04ubz] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-ueg5w04ubz] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-ueg5w04ubz] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-ueg5w04ubz] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-ueg5w04ubz 1s linear infinite; }
@keyframes spin-b-ueg5w04ubz { to { transform: rotate(360deg); } }
.spin[b-ueg5w04ubz] { animation: spin-b-ueg5w04ubz 1s linear infinite; display: inline-block; }
.crud-empty-state[b-ueg5w04ubz] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-ueg5w04ubz] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-ueg5w04ubz] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ueg5w04ubz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-ueg5w04ubz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-ueg5w04ubz] { max-width: 800px; }
.modal-header[b-ueg5w04ubz] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-ueg5w04ubz] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-ueg5w04ubz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-ueg5w04ubz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ueg5w04ubz] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); }
.help-body[b-ueg5w04ubz] { padding: 0; }
.help-section[b-ueg5w04ubz] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-ueg5w04ubz] { border-bottom: none; }
.help-section p[b-ueg5w04ubz], .help-section li[b-ueg5w04ubz] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-ueg5w04ubz] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); }
.help-tip[b-ueg5w04ubz] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-ueg5w04ubz] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-ueg5w04ubz] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-ueg5w04ubz] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-ueg5w04ubz] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-ueg5w04ubz] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-ueg5w04ubz] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-ueg5w04ubz] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-ueg5w04ubz] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-ueg5w04ubz] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-ueg5w04ubz] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-ueg5w04ubz] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-ueg5w04ubz] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-ueg5w04ubz] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-ueg5w04ubz] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-ueg5w04ubz] { color: #67e8f9; }

.ma-row-grid[b-ueg5w04ubz] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-ueg5w04ubz] { grid-template-columns: 1fr; } }
.ma-chart-card[b-ueg5w04ubz] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-ueg5w04ubz] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-ueg5w04ubz] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-ueg5w04ubz] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-ueg5w04ubz] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-ueg5w04ubz] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-ueg5w04ubz] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-ueg5w04ubz] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-ueg5w04ubz] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-ueg5w04ubz] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-ueg5w04ubz] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-ueg5w04ubz] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-ueg5w04ubz] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-ueg5w04ubz] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-ueg5w04ubz] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-ueg5w04ubz] { background: var(--rg-bg-subtle); }
.crud-table th[b-ueg5w04ubz] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-ueg5w04ubz] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-ueg5w04ubz] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-ueg5w04ubz] { background: var(--rg-bg-hover); }
.font-mono[b-ueg5w04ubz] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-ueg5w04ubz] { text-align: center; }
.col-actions[b-ueg5w04ubz] { text-align: right; white-space: nowrap; }
.btn-icon[b-ueg5w04ubz] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-ueg5w04ubz] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-ueg5w04ubz] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-ueg5w04ubz] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-ueg5w04ubz] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-ueg5w04ubz] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-ueg5w04ubz] { color: #86efac; }
[data-mode="dark"] .badge-no[b-ueg5w04ubz] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-ueg5w04ubz] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-ueg5w04ubz] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-ueg5w04ubz] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-ueg5w04ubz] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-ueg5w04ubz] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-ueg5w04ubz] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-ueg5w04ubz] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-ueg5w04ubz] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-ueg5w04ubz] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-ueg5w04ubz] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-ueg5w04ubz] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-ueg5w04ubz] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-ueg5w04ubz] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-ueg5w04ubz] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-ueg5w04ubz] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-ueg5w04ubz] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-ueg5w04ubz] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-ueg5w04ubz] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-ueg5w04ubz] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-ueg5w04ubz] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-ueg5w04ubz] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-ueg5w04ubz] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-ueg5w04ubz] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-ueg5w04ubz] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-ueg5w04ubz] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-ueg5w04ubz] { color: var(--rg-accent, #2563eb); }
.crud-count[b-ueg5w04ubz] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-ueg5w04ubz] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-ueg5w04ubz], .ma-filters input[b-ueg5w04ubz] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-ueg5w04ubz] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-ueg5w04ubz] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-ueg5w04ubz] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-ueg5w04ubz] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-ueg5w04ubz] { color: #fca5a5; }
.crud-alert-close[b-ueg5w04ubz] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-ueg5w04ubz] { margin-bottom: 0.9rem; }
.form-group label[b-ueg5w04ubz] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-ueg5w04ubz], .form-group select[b-ueg5w04ubz], .form-group textarea[b-ueg5w04ubz] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-ueg5w04ubz] { min-height: 80px; resize: vertical; }
.form-row-2[b-ueg5w04ubz] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-ueg5w04ubz] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-ueg5w04ubz] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-ueg5w04ubz] { width: auto; }

.form-check-group[b-ueg5w04ubz] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_MisCasos.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-pcrg9i5bhg] { padding: 1.25rem; }
.rg-slide-up[b-pcrg9i5bhg] { animation: slideUp-b-pcrg9i5bhg .35s ease both; }
@keyframes slideUp-b-pcrg9i5bhg { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-pcrg9i5bhg] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-pcrg9i5bhg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pcrg9i5bhg] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-pcrg9i5bhg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-pcrg9i5bhg] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-pcrg9i5bhg] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-pcrg9i5bhg] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-pcrg9i5bhg] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-pcrg9i5bhg] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-pcrg9i5bhg] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pcrg9i5bhg] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-pcrg9i5bhg] { background: transparent; }
.btn-danger[b-pcrg9i5bhg] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-pcrg9i5bhg] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-pcrg9i5bhg] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-pcrg9i5bhg] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-pcrg9i5bhg] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-pcrg9i5bhg] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-pcrg9i5bhg 1s linear infinite; }
@keyframes spin-b-pcrg9i5bhg { to { transform: rotate(360deg); } }
.spin[b-pcrg9i5bhg] { animation: spin-b-pcrg9i5bhg 1s linear infinite; display: inline-block; }
.crud-empty-state[b-pcrg9i5bhg] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-pcrg9i5bhg] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-pcrg9i5bhg] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-pcrg9i5bhg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-pcrg9i5bhg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-pcrg9i5bhg] { max-width: 800px; }
.modal-header[b-pcrg9i5bhg] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-pcrg9i5bhg] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-pcrg9i5bhg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-pcrg9i5bhg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pcrg9i5bhg] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); }
.help-body[b-pcrg9i5bhg] { padding: 0; }
.help-section[b-pcrg9i5bhg] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-pcrg9i5bhg] { border-bottom: none; }
.help-section p[b-pcrg9i5bhg], .help-section li[b-pcrg9i5bhg] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-pcrg9i5bhg] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); }
.help-tip[b-pcrg9i5bhg] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-pcrg9i5bhg] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-pcrg9i5bhg] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-pcrg9i5bhg] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-pcrg9i5bhg] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-pcrg9i5bhg] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-pcrg9i5bhg] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-pcrg9i5bhg] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-pcrg9i5bhg] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-pcrg9i5bhg] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-pcrg9i5bhg] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-pcrg9i5bhg] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-pcrg9i5bhg] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-pcrg9i5bhg] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-pcrg9i5bhg] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-pcrg9i5bhg] { color: #67e8f9; }

.ma-row-grid[b-pcrg9i5bhg] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-pcrg9i5bhg] { grid-template-columns: 1fr; } }
.ma-chart-card[b-pcrg9i5bhg] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-pcrg9i5bhg] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-pcrg9i5bhg] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-pcrg9i5bhg] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-pcrg9i5bhg] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-pcrg9i5bhg] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-pcrg9i5bhg] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-pcrg9i5bhg] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-pcrg9i5bhg] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-pcrg9i5bhg] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-pcrg9i5bhg] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-pcrg9i5bhg] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-pcrg9i5bhg] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-pcrg9i5bhg] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-pcrg9i5bhg] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-pcrg9i5bhg] { background: var(--rg-bg-subtle); }
.crud-table th[b-pcrg9i5bhg] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-pcrg9i5bhg] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-pcrg9i5bhg] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-pcrg9i5bhg] { background: var(--rg-bg-hover); }
.font-mono[b-pcrg9i5bhg] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-pcrg9i5bhg] { text-align: center; }
.col-actions[b-pcrg9i5bhg] { text-align: right; white-space: nowrap; }
.btn-icon[b-pcrg9i5bhg] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-pcrg9i5bhg] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-pcrg9i5bhg] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-pcrg9i5bhg] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-pcrg9i5bhg] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-pcrg9i5bhg] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-pcrg9i5bhg] { color: #86efac; }
[data-mode="dark"] .badge-no[b-pcrg9i5bhg] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-pcrg9i5bhg] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-pcrg9i5bhg] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-pcrg9i5bhg] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-pcrg9i5bhg] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-pcrg9i5bhg] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-pcrg9i5bhg] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-pcrg9i5bhg] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-pcrg9i5bhg] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-pcrg9i5bhg] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-pcrg9i5bhg] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-pcrg9i5bhg] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-pcrg9i5bhg] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-pcrg9i5bhg] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-pcrg9i5bhg] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-pcrg9i5bhg] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-pcrg9i5bhg] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-pcrg9i5bhg] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-pcrg9i5bhg] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-pcrg9i5bhg] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-pcrg9i5bhg] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-pcrg9i5bhg] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-pcrg9i5bhg] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-pcrg9i5bhg] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-pcrg9i5bhg] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-pcrg9i5bhg] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-pcrg9i5bhg] { color: var(--rg-accent, #2563eb); }
.crud-count[b-pcrg9i5bhg] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-pcrg9i5bhg] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-pcrg9i5bhg], .ma-filters input[b-pcrg9i5bhg] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-pcrg9i5bhg] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-pcrg9i5bhg] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-pcrg9i5bhg] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-pcrg9i5bhg] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-pcrg9i5bhg] { color: #fca5a5; }
.crud-alert-close[b-pcrg9i5bhg] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-pcrg9i5bhg] { margin-bottom: 0.9rem; }
.form-group label[b-pcrg9i5bhg] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-pcrg9i5bhg], .form-group select[b-pcrg9i5bhg], .form-group textarea[b-pcrg9i5bhg] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-pcrg9i5bhg] { min-height: 80px; resize: vertical; }
.form-row-2[b-pcrg9i5bhg] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-pcrg9i5bhg] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-pcrg9i5bhg] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-pcrg9i5bhg] { width: auto; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Modulos.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-0kmjc3mkyh] { padding: 1.25rem; }
.rg-slide-up[b-0kmjc3mkyh] { animation: slideUp-b-0kmjc3mkyh .35s ease both; }
@keyframes slideUp-b-0kmjc3mkyh { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-0kmjc3mkyh] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-0kmjc3mkyh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0kmjc3mkyh] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-0kmjc3mkyh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-0kmjc3mkyh] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-0kmjc3mkyh] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-0kmjc3mkyh] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-0kmjc3mkyh] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-0kmjc3mkyh] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-0kmjc3mkyh] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0kmjc3mkyh] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-0kmjc3mkyh] { background: transparent; }
.btn-danger[b-0kmjc3mkyh] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-0kmjc3mkyh] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-0kmjc3mkyh] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-0kmjc3mkyh] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-0kmjc3mkyh] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-0kmjc3mkyh] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-0kmjc3mkyh 1s linear infinite; }
@keyframes spin-b-0kmjc3mkyh { to { transform: rotate(360deg); } }
.spin[b-0kmjc3mkyh] { animation: spin-b-0kmjc3mkyh 1s linear infinite; display: inline-block; }
.crud-empty-state[b-0kmjc3mkyh] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-0kmjc3mkyh] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-0kmjc3mkyh] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-0kmjc3mkyh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-0kmjc3mkyh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-0kmjc3mkyh] { max-width: 800px; }
.modal-header[b-0kmjc3mkyh] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-0kmjc3mkyh] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-0kmjc3mkyh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-0kmjc3mkyh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0kmjc3mkyh] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); }
.help-body[b-0kmjc3mkyh] { padding: 0; }
.help-section[b-0kmjc3mkyh] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-0kmjc3mkyh] { border-bottom: none; }
.help-section p[b-0kmjc3mkyh], .help-section li[b-0kmjc3mkyh] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-0kmjc3mkyh] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); }
.help-tip[b-0kmjc3mkyh] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-0kmjc3mkyh] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-0kmjc3mkyh] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-0kmjc3mkyh] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-0kmjc3mkyh] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-0kmjc3mkyh] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-0kmjc3mkyh] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-0kmjc3mkyh] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-0kmjc3mkyh] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-0kmjc3mkyh] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-0kmjc3mkyh] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-0kmjc3mkyh] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-0kmjc3mkyh] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-0kmjc3mkyh] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-0kmjc3mkyh] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-0kmjc3mkyh] { color: #67e8f9; }

.ma-row-grid[b-0kmjc3mkyh] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-0kmjc3mkyh] { grid-template-columns: 1fr; } }
.ma-chart-card[b-0kmjc3mkyh] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-0kmjc3mkyh] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-0kmjc3mkyh] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-0kmjc3mkyh] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-0kmjc3mkyh] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-0kmjc3mkyh] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-0kmjc3mkyh] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-0kmjc3mkyh] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-0kmjc3mkyh] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-0kmjc3mkyh] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-0kmjc3mkyh] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-0kmjc3mkyh] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-0kmjc3mkyh] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-0kmjc3mkyh] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-0kmjc3mkyh] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-0kmjc3mkyh] { background: var(--rg-bg-subtle); }
.crud-table th[b-0kmjc3mkyh] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-0kmjc3mkyh] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-0kmjc3mkyh] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-0kmjc3mkyh] { background: var(--rg-bg-hover); }
.font-mono[b-0kmjc3mkyh] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-0kmjc3mkyh] { text-align: center; }
.col-actions[b-0kmjc3mkyh] { text-align: right; white-space: nowrap; }
.btn-icon[b-0kmjc3mkyh] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-0kmjc3mkyh] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-0kmjc3mkyh] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-0kmjc3mkyh] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-0kmjc3mkyh] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-0kmjc3mkyh] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-0kmjc3mkyh] { color: #86efac; }
[data-mode="dark"] .badge-no[b-0kmjc3mkyh] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-0kmjc3mkyh] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-0kmjc3mkyh] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-0kmjc3mkyh] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-0kmjc3mkyh] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-0kmjc3mkyh] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-0kmjc3mkyh] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-0kmjc3mkyh] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-0kmjc3mkyh] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-0kmjc3mkyh] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-0kmjc3mkyh] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-0kmjc3mkyh] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-0kmjc3mkyh] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-0kmjc3mkyh] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-0kmjc3mkyh] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-0kmjc3mkyh] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-0kmjc3mkyh] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-0kmjc3mkyh] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-0kmjc3mkyh] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-0kmjc3mkyh] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-0kmjc3mkyh] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-0kmjc3mkyh] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-0kmjc3mkyh] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-0kmjc3mkyh] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-0kmjc3mkyh] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-0kmjc3mkyh] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-0kmjc3mkyh] { color: var(--rg-accent, #2563eb); }
.crud-count[b-0kmjc3mkyh] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-0kmjc3mkyh] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-0kmjc3mkyh], .ma-filters input[b-0kmjc3mkyh] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-0kmjc3mkyh] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-0kmjc3mkyh] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-0kmjc3mkyh] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-0kmjc3mkyh] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-0kmjc3mkyh] { color: #fca5a5; }
.crud-alert-close[b-0kmjc3mkyh] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-0kmjc3mkyh] { margin-bottom: 0.9rem; }
.form-group label[b-0kmjc3mkyh] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-0kmjc3mkyh], .form-group select[b-0kmjc3mkyh], .form-group textarea[b-0kmjc3mkyh] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-0kmjc3mkyh] { min-height: 80px; resize: vertical; }
.form-row-2[b-0kmjc3mkyh] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-0kmjc3mkyh] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-0kmjc3mkyh] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-0kmjc3mkyh] { width: auto; }

.form-check-group[b-0kmjc3mkyh] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Nuevo.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-tkvovig60e] { padding: 1.25rem; }
.rg-slide-up[b-tkvovig60e] { animation: slideUp-b-tkvovig60e .35s ease both; }
@keyframes slideUp-b-tkvovig60e { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-tkvovig60e] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-tkvovig60e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-tkvovig60e] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-tkvovig60e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-tkvovig60e] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-tkvovig60e] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-tkvovig60e] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-tkvovig60e] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-tkvovig60e] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-tkvovig60e] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-tkvovig60e] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-tkvovig60e] { background: transparent; }
.btn-danger[b-tkvovig60e] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-tkvovig60e] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-tkvovig60e] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-tkvovig60e] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-tkvovig60e] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-tkvovig60e] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-tkvovig60e 1s linear infinite; }
@keyframes spin-b-tkvovig60e { to { transform: rotate(360deg); } }
.spin[b-tkvovig60e] { animation: spin-b-tkvovig60e 1s linear infinite; display: inline-block; }
.crud-empty-state[b-tkvovig60e] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-tkvovig60e] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-tkvovig60e] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-tkvovig60e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-tkvovig60e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-tkvovig60e] { max-width: 800px; }
.modal-header[b-tkvovig60e] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-tkvovig60e] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-tkvovig60e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-tkvovig60e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-tkvovig60e] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-tkvovig60e] { color: var(--rg-accent, #2563eb); }
.help-body[b-tkvovig60e] { padding: 0; }
.help-section[b-tkvovig60e] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-tkvovig60e] { border-bottom: none; }
.help-section p[b-tkvovig60e], .help-section li[b-tkvovig60e] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-tkvovig60e] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-tkvovig60e] { color: var(--rg-accent, #2563eb); }
.help-tip[b-tkvovig60e] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-tkvovig60e] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-tkvovig60e] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-tkvovig60e] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-tkvovig60e] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-tkvovig60e] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-tkvovig60e] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-tkvovig60e] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-tkvovig60e] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-tkvovig60e] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-tkvovig60e] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-tkvovig60e] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-tkvovig60e] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-tkvovig60e] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-tkvovig60e] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-tkvovig60e] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-tkvovig60e] { color: #67e8f9; }

.ma-row-grid[b-tkvovig60e] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-tkvovig60e] { grid-template-columns: 1fr; } }
.ma-chart-card[b-tkvovig60e] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-tkvovig60e] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-tkvovig60e] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-tkvovig60e] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-tkvovig60e] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-tkvovig60e] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-tkvovig60e] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-tkvovig60e] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-tkvovig60e] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-tkvovig60e] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-tkvovig60e] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-tkvovig60e] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-tkvovig60e] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-tkvovig60e] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-tkvovig60e] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-tkvovig60e] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-tkvovig60e] { background: var(--rg-bg-subtle); }
.crud-table th[b-tkvovig60e] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-tkvovig60e] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-tkvovig60e] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-tkvovig60e] { background: var(--rg-bg-hover); }
.font-mono[b-tkvovig60e] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-tkvovig60e] { text-align: center; }
.col-actions[b-tkvovig60e] { text-align: right; white-space: nowrap; }
.btn-icon[b-tkvovig60e] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-tkvovig60e] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-tkvovig60e] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-tkvovig60e] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-tkvovig60e] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-tkvovig60e] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-tkvovig60e] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-tkvovig60e] { color: #86efac; }
[data-mode="dark"] .badge-no[b-tkvovig60e] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-tkvovig60e] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-tkvovig60e] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-tkvovig60e] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-tkvovig60e] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-tkvovig60e] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-tkvovig60e] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-tkvovig60e] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-tkvovig60e] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-tkvovig60e] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-tkvovig60e] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-tkvovig60e] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-tkvovig60e] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-tkvovig60e] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-tkvovig60e] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-tkvovig60e] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-tkvovig60e] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-tkvovig60e] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-tkvovig60e] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-tkvovig60e] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-tkvovig60e] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-tkvovig60e] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-tkvovig60e] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-tkvovig60e] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-tkvovig60e] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-tkvovig60e] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-tkvovig60e] { color: var(--rg-accent, #2563eb); }
.crud-count[b-tkvovig60e] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-tkvovig60e] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-tkvovig60e], .ma-filters input[b-tkvovig60e] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-tkvovig60e] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-tkvovig60e] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-tkvovig60e] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-tkvovig60e] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-tkvovig60e] { color: #fca5a5; }
.crud-alert-close[b-tkvovig60e] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-tkvovig60e] { margin-bottom: 0.9rem; }
.form-group label[b-tkvovig60e] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-tkvovig60e], .form-group select[b-tkvovig60e], .form-group textarea[b-tkvovig60e] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-tkvovig60e] { min-height: 80px; resize: vertical; }
.form-row-2[b-tkvovig60e] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-tkvovig60e] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-tkvovig60e] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-tkvovig60e] { width: auto; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Reglas.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-90ud1wmq1t] { padding: 1.25rem; }
.rg-slide-up[b-90ud1wmq1t] { animation: slideUp-b-90ud1wmq1t .35s ease both; }
@keyframes slideUp-b-90ud1wmq1t { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-90ud1wmq1t] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-90ud1wmq1t] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-90ud1wmq1t] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-90ud1wmq1t] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-90ud1wmq1t] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-90ud1wmq1t] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-90ud1wmq1t] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-90ud1wmq1t] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-90ud1wmq1t] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-90ud1wmq1t] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-90ud1wmq1t] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-90ud1wmq1t] { background: transparent; }
.btn-danger[b-90ud1wmq1t] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-90ud1wmq1t] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-90ud1wmq1t] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-90ud1wmq1t] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-90ud1wmq1t] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-90ud1wmq1t] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-90ud1wmq1t 1s linear infinite; }
@keyframes spin-b-90ud1wmq1t { to { transform: rotate(360deg); } }
.spin[b-90ud1wmq1t] { animation: spin-b-90ud1wmq1t 1s linear infinite; display: inline-block; }
.crud-empty-state[b-90ud1wmq1t] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-90ud1wmq1t] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-90ud1wmq1t] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-90ud1wmq1t] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-90ud1wmq1t] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-90ud1wmq1t] { max-width: 800px; }
.modal-header[b-90ud1wmq1t] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-90ud1wmq1t] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-90ud1wmq1t] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-90ud1wmq1t] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-90ud1wmq1t] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); }
.help-body[b-90ud1wmq1t] { padding: 0; }
.help-section[b-90ud1wmq1t] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-90ud1wmq1t] { border-bottom: none; }
.help-section p[b-90ud1wmq1t], .help-section li[b-90ud1wmq1t] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-90ud1wmq1t] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); }
.help-tip[b-90ud1wmq1t] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-90ud1wmq1t] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-90ud1wmq1t] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-90ud1wmq1t] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-90ud1wmq1t] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-90ud1wmq1t] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-90ud1wmq1t] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-90ud1wmq1t] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-90ud1wmq1t] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-90ud1wmq1t] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-90ud1wmq1t] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-90ud1wmq1t] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-90ud1wmq1t] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-90ud1wmq1t] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-90ud1wmq1t] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-90ud1wmq1t] { color: #67e8f9; }

.ma-row-grid[b-90ud1wmq1t] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-90ud1wmq1t] { grid-template-columns: 1fr; } }
.ma-chart-card[b-90ud1wmq1t] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-90ud1wmq1t] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-90ud1wmq1t] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-90ud1wmq1t] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-90ud1wmq1t] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-90ud1wmq1t] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-90ud1wmq1t] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-90ud1wmq1t] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-90ud1wmq1t] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-90ud1wmq1t] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-90ud1wmq1t] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-90ud1wmq1t] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-90ud1wmq1t] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-90ud1wmq1t] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-90ud1wmq1t] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-90ud1wmq1t] { background: var(--rg-bg-subtle); }
.crud-table th[b-90ud1wmq1t] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-90ud1wmq1t] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-90ud1wmq1t] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-90ud1wmq1t] { background: var(--rg-bg-hover); }
.font-mono[b-90ud1wmq1t] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-90ud1wmq1t] { text-align: center; }
.col-actions[b-90ud1wmq1t] { text-align: right; white-space: nowrap; }
.btn-icon[b-90ud1wmq1t] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-90ud1wmq1t] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-90ud1wmq1t] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-90ud1wmq1t] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-90ud1wmq1t] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-90ud1wmq1t] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-90ud1wmq1t] { color: #86efac; }
[data-mode="dark"] .badge-no[b-90ud1wmq1t] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-90ud1wmq1t] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-90ud1wmq1t] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-90ud1wmq1t] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-90ud1wmq1t] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-90ud1wmq1t] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-90ud1wmq1t] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-90ud1wmq1t] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-90ud1wmq1t] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-90ud1wmq1t] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-90ud1wmq1t] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-90ud1wmq1t] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-90ud1wmq1t] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-90ud1wmq1t] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-90ud1wmq1t] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-90ud1wmq1t] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-90ud1wmq1t] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-90ud1wmq1t] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-90ud1wmq1t] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-90ud1wmq1t] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-90ud1wmq1t] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-90ud1wmq1t] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-90ud1wmq1t] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-90ud1wmq1t] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-90ud1wmq1t] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-90ud1wmq1t] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-90ud1wmq1t] { color: var(--rg-accent, #2563eb); }
.crud-count[b-90ud1wmq1t] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-90ud1wmq1t] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-90ud1wmq1t], .ma-filters input[b-90ud1wmq1t] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-90ud1wmq1t] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-90ud1wmq1t] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-90ud1wmq1t] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-90ud1wmq1t] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-90ud1wmq1t] { color: #fca5a5; }
.crud-alert-close[b-90ud1wmq1t] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-90ud1wmq1t] { margin-bottom: 0.9rem; }
.form-group label[b-90ud1wmq1t] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-90ud1wmq1t], .form-group select[b-90ud1wmq1t], .form-group textarea[b-90ud1wmq1t] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-90ud1wmq1t] { min-height: 80px; resize: vertical; }
.form-row-2[b-90ud1wmq1t] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-90ud1wmq1t] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-90ud1wmq1t] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-90ud1wmq1t] { width: auto; }

.form-check-group[b-90ud1wmq1t] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Sla.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-0uc4d22m70] { padding: 1.25rem; }
.rg-slide-up[b-0uc4d22m70] { animation: slideUp-b-0uc4d22m70 .35s ease both; }
@keyframes slideUp-b-0uc4d22m70 { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-0uc4d22m70] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-0uc4d22m70] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0uc4d22m70] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-0uc4d22m70] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-0uc4d22m70] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-0uc4d22m70] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-0uc4d22m70] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-0uc4d22m70] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-0uc4d22m70] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-0uc4d22m70] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0uc4d22m70] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-0uc4d22m70] { background: transparent; }
.btn-danger[b-0uc4d22m70] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-0uc4d22m70] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-0uc4d22m70] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-0uc4d22m70] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-0uc4d22m70] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-0uc4d22m70] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-0uc4d22m70 1s linear infinite; }
@keyframes spin-b-0uc4d22m70 { to { transform: rotate(360deg); } }
.spin[b-0uc4d22m70] { animation: spin-b-0uc4d22m70 1s linear infinite; display: inline-block; }
.crud-empty-state[b-0uc4d22m70] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-0uc4d22m70] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-0uc4d22m70] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-0uc4d22m70] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-0uc4d22m70] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-0uc4d22m70] { max-width: 800px; }
.modal-header[b-0uc4d22m70] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-0uc4d22m70] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-0uc4d22m70] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-0uc4d22m70] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0uc4d22m70] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); }
.help-body[b-0uc4d22m70] { padding: 0; }
.help-section[b-0uc4d22m70] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-0uc4d22m70] { border-bottom: none; }
.help-section p[b-0uc4d22m70], .help-section li[b-0uc4d22m70] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-0uc4d22m70] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); }
.help-tip[b-0uc4d22m70] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-0uc4d22m70] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-0uc4d22m70] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-0uc4d22m70] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-0uc4d22m70] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-0uc4d22m70] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-0uc4d22m70] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-0uc4d22m70] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-0uc4d22m70] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-0uc4d22m70] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-0uc4d22m70] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-0uc4d22m70] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-0uc4d22m70] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-0uc4d22m70] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-0uc4d22m70] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-0uc4d22m70] { color: #67e8f9; }

.ma-row-grid[b-0uc4d22m70] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-0uc4d22m70] { grid-template-columns: 1fr; } }
.ma-chart-card[b-0uc4d22m70] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-0uc4d22m70] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-0uc4d22m70] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-0uc4d22m70] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-0uc4d22m70] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-0uc4d22m70] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-0uc4d22m70] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-0uc4d22m70] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-0uc4d22m70] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-0uc4d22m70] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-0uc4d22m70] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-0uc4d22m70] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-0uc4d22m70] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-0uc4d22m70] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-0uc4d22m70] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-0uc4d22m70] { background: var(--rg-bg-subtle); }
.crud-table th[b-0uc4d22m70] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-0uc4d22m70] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-0uc4d22m70] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-0uc4d22m70] { background: var(--rg-bg-hover); }
.font-mono[b-0uc4d22m70] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-0uc4d22m70] { text-align: center; }
.col-actions[b-0uc4d22m70] { text-align: right; white-space: nowrap; }
.btn-icon[b-0uc4d22m70] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-0uc4d22m70] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-0uc4d22m70] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-0uc4d22m70] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-0uc4d22m70] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-0uc4d22m70] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-0uc4d22m70] { color: #86efac; }
[data-mode="dark"] .badge-no[b-0uc4d22m70] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-0uc4d22m70] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-0uc4d22m70] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-0uc4d22m70] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-0uc4d22m70] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-0uc4d22m70] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-0uc4d22m70] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-0uc4d22m70] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-0uc4d22m70] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-0uc4d22m70] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-0uc4d22m70] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-0uc4d22m70] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-0uc4d22m70] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-0uc4d22m70] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-0uc4d22m70] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-0uc4d22m70] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-0uc4d22m70] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-0uc4d22m70] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-0uc4d22m70] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-0uc4d22m70] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-0uc4d22m70] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-0uc4d22m70] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-0uc4d22m70] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-0uc4d22m70] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-0uc4d22m70] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-0uc4d22m70] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-0uc4d22m70] { color: var(--rg-accent, #2563eb); }
.crud-count[b-0uc4d22m70] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-0uc4d22m70] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-0uc4d22m70], .ma-filters input[b-0uc4d22m70] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-0uc4d22m70] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-0uc4d22m70] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-0uc4d22m70] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-0uc4d22m70] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-0uc4d22m70] { color: #fca5a5; }
.crud-alert-close[b-0uc4d22m70] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-0uc4d22m70] { margin-bottom: 0.9rem; }
.form-group label[b-0uc4d22m70] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-0uc4d22m70], .form-group select[b-0uc4d22m70], .form-group textarea[b-0uc4d22m70] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-0uc4d22m70] { min-height: 80px; resize: vertical; }
.form-row-2[b-0uc4d22m70] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-0uc4d22m70] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-0uc4d22m70] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-0uc4d22m70] { width: auto; }

/* _content/Rgclouds.Web/Components/Pages/MesaAyuda/FrmMa_Tipos.razor.rz.scp.css */
/* === CRUD container (estÃ¡ndar copiado de Frmclientes) === */
.crud-container[b-adez0xnjb8] { padding: 1.25rem; }
.rg-slide-up[b-adez0xnjb8] { animation: slideUp-b-adez0xnjb8 .35s ease both; }
@keyframes slideUp-b-adez0xnjb8 { from { transform: translateY(10px); opacity:0; } to { transform: translateY(0); opacity:1; } }
.crud-header[b-adez0xnjb8] { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.crud-header-left[b-adez0xnjb8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-adez0xnjb8] { font-size: 1.8rem; color: var(--rg-primary, #1a3a5c); }
.crud-title[b-adez0xnjb8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-adez0xnjb8] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.crud-header-actions[b-adez0xnjb8] { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.btn-crud[b-adez0xnjb8] { padding: 0.5rem 0.85rem; border-radius: 0.45rem; border: 1px solid var(--rg-border); background: var(--rg-bg-card); color: var(--rg-text-primary); cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.4rem; transition: all 0.15s; }
.btn-crud:hover:not(:disabled)[b-adez0xnjb8] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-adez0xnjb8] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-adez0xnjb8] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; }
.btn-primary:hover:not(:disabled)[b-adez0xnjb8] { background: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-outline[b-adez0xnjb8] { background: transparent; }
.btn-danger[b-adez0xnjb8] { background: var(--rg-danger, #dc2626); border-color: var(--rg-danger); color: #fff; }
.btn-help[b-adez0xnjb8] { background: rgba(37,99,235,0.08); color: var(--rg-accent, #2563eb); border: 1px solid rgba(37,99,235,0.25); }
.btn-help:hover[b-adez0xnjb8] { background: rgba(37,99,235,0.16); }
[data-mode="dark"] .btn-help[b-adez0xnjb8] { background: rgba(37,99,235,0.15); color: #93c5fd; }
.crud-loading[b-adez0xnjb8] { display: flex; flex-direction: column; align-items: center; padding: 3rem; color: var(--rg-text-secondary); gap: 0.75rem; }
.crud-spinner[b-adez0xnjb8] { width: 32px; height: 32px; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #2563eb); border-radius: 50%; animation: spin-b-adez0xnjb8 1s linear infinite; }
@keyframes spin-b-adez0xnjb8 { to { transform: rotate(360deg); } }
.spin[b-adez0xnjb8] { animation: spin-b-adez0xnjb8 1s linear infinite; display: inline-block; }
.crud-empty-state[b-adez0xnjb8] { padding: 3rem; text-align: center; color: var(--rg-text-muted); }
.crud-empty-state i[b-adez0xnjb8] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }

/* === Modal === */
.modal-backdrop[b-adez0xnjb8] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-adez0xnjb8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; padding: 1rem; }
.modal-dialog[b-adez0xnjb8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 600px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.25); border: 1px solid var(--rg-border); }
.modal-dialog.modal-lg[b-adez0xnjb8] { max-width: 800px; }
.modal-header[b-adez0xnjb8] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.modal-header h2[b-adez0xnjb8] { margin: 0; font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 0.5rem; color: var(--rg-text-primary); }
.modal-close[b-adez0xnjb8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; }
.modal-body[b-adez0xnjb8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-adez0xnjb8] { padding: 0.65rem 1.25rem; border-top: 1px solid var(--rg-border); display: flex; justify-content: flex-end; gap: 0.5rem; }
.help-icon-header[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); }
.help-body[b-adez0xnjb8] { padding: 0; }
.help-section[b-adez0xnjb8] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border); }
.help-section:last-child[b-adez0xnjb8] { border-bottom: none; }
.help-section p[b-adez0xnjb8], .help-section li[b-adez0xnjb8] { font-size: 0.85rem; color: var(--rg-text-secondary); }
.help-section-title[b-adez0xnjb8] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.6rem; }
.help-section-title i[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); }
.help-tip[b-adez0xnjb8] { display: flex; gap: 0.5rem; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent, #2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.6rem 0.75rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary); }
.help-tip i[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); margin-top: 0.1rem; }
[data-mode="dark"] .help-tip[b-adez0xnjb8] { background: rgba(37,99,235,0.12); }

/* === MA specific === */
.ma-kpi-grid[b-adez0xnjb8] { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ma-kpi[b-adez0xnjb8] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1rem; position: relative; overflow: hidden; }
.ma-kpi-icon[b-adez0xnjb8] { position: absolute; right: 0.7rem; top: 0.7rem; font-size: 1.5rem; opacity: 0.3; color: var(--rg-text-muted); }
.ma-kpi-label[b-adez0xnjb8] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.ma-kpi-value[b-adez0xnjb8] { font-size: 1.9rem; font-weight: 700; color: var(--rg-text-primary); margin-top: 0.25rem; }
.ma-kpi-foot[b-adez0xnjb8] { font-size: 0.74rem; color: var(--rg-text-muted); margin-top: 0.25rem; }
.ma-kpi.success .ma-kpi-value[b-adez0xnjb8] { color: #16a34a; } [data-mode="dark"] .ma-kpi.success .ma-kpi-value[b-adez0xnjb8] { color: #4ade80; }
.ma-kpi.danger .ma-kpi-value[b-adez0xnjb8] { color: #dc2626; } [data-mode="dark"] .ma-kpi.danger .ma-kpi-value[b-adez0xnjb8] { color: #f87171; }
.ma-kpi.warning .ma-kpi-value[b-adez0xnjb8] { color: #d97706; } [data-mode="dark"] .ma-kpi.warning .ma-kpi-value[b-adez0xnjb8] { color: #fbbf24; }
.ma-kpi.info .ma-kpi-value[b-adez0xnjb8] { color: #0891b2; } [data-mode="dark"] .ma-kpi.info .ma-kpi-value[b-adez0xnjb8] { color: #67e8f9; }

.ma-row-grid[b-adez0xnjb8] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
@media (max-width: 900px) { .ma-row-grid[b-adez0xnjb8] { grid-template-columns: 1fr; } }
.ma-chart-card[b-adez0xnjb8] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; padding: 1.1rem; margin-bottom: 1rem; }
.ma-chart-card h3[b-adez0xnjb8] { font-size: 0.95rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.4rem; color: var(--rg-text-primary); }
.ma-chart-card h3 i[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); }
.ma-empty-mini[b-adez0xnjb8] { color: var(--rg-text-muted); padding: 1.5rem; text-align: center; font-size: 0.85rem; }
.ma-bar-row[b-adez0xnjb8] { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.45rem; font-size: 0.82rem; }
.ma-bar-label[b-adez0xnjb8] { min-width: 130px; color: var(--rg-text-secondary); font-size: 0.78rem; }
.ma-bar-track[b-adez0xnjb8] { flex: 1; height: 18px; background: var(--rg-bg-subtle); border-radius: 4px; overflow: hidden; }
.ma-bar-fill[b-adez0xnjb8] { height: 100%; background: linear-gradient(90deg, var(--rg-accent, #2563eb), #60a5fa); border-radius: 4px; display: flex; align-items: center; padding-right: 0.4rem; justify-content: flex-end; font-size: 0.7rem; font-weight: 600; color: white; min-width: 24px; }
.ma-bar-fill.ma-bar-warn[b-adez0xnjb8] { background: linear-gradient(90deg, #d97706, #fbbf24); }
.ma-bar-count[b-adez0xnjb8] { min-width: 30px; text-align: right; color: var(--rg-text-primary); font-weight: 600; }

.ma-tendencia[b-adez0xnjb8] { display: flex; align-items: flex-end; gap: 0.5rem; height: 140px; padding: 0.5rem 0; }
.ma-tend-col[b-adez0xnjb8] { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; }
.ma-tend-bar[b-adez0xnjb8] { width: 100%; background: var(--rg-accent, #2563eb); min-height: 5%; border-radius: 4px 4px 0 0; display: flex; align-items: flex-start; justify-content: center; color: white; font-size: 0.7rem; font-weight: 600; padding-top: 2px; }
.ma-tend-label[b-adez0xnjb8] { font-size: 0.72rem; color: var(--rg-text-muted); }

/* Table */
.crud-grid-wrapper[b-adez0xnjb8] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.6rem; overflow: hidden; }
.crud-table[b-adez0xnjb8] { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.crud-table thead[b-adez0xnjb8] { background: var(--rg-bg-subtle); }
.crud-table th[b-adez0xnjb8] { text-align: left; padding: 0.65rem 0.8rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rg-text-muted); font-weight: 600; }
.crud-table td[b-adez0xnjb8] { padding: 0.65rem 0.8rem; border-top: 1px solid var(--rg-border); }
.crud-table tbody tr[b-adez0xnjb8] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-adez0xnjb8] { background: var(--rg-bg-hover); }
.font-mono[b-adez0xnjb8] { font-family: 'Cascadia Code', 'Fira Code', monospace; }
.text-center[b-adez0xnjb8] { text-align: center; }
.col-actions[b-adez0xnjb8] { text-align: right; white-space: nowrap; }
.btn-icon[b-adez0xnjb8] { background: none; border: 1px solid var(--rg-border); padding: 0.3rem 0.45rem; border-radius: 0.35rem; cursor: pointer; color: var(--rg-text-secondary); margin-left: 0.25rem; transition: all 0.15s; }
.btn-icon:hover[b-adez0xnjb8] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.btn-edit:hover[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); border-color: var(--rg-accent, #2563eb); }
.btn-delete:hover[b-adez0xnjb8] { color: var(--rg-danger, #dc2626); border-color: var(--rg-danger, #dc2626); }

/* Badges */
.badge[b-adez0xnjb8] { display: inline-block; padding: 0.18rem 0.55rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.badge-yes[b-adez0xnjb8] { background: rgba(22,163,74,0.15); color: #166534; }
.badge-no[b-adez0xnjb8] { background: rgba(100,116,139,0.2); color: #475569; }
[data-mode="dark"] .badge-yes[b-adez0xnjb8] { color: #86efac; }
[data-mode="dark"] .badge-no[b-adez0xnjb8] { color: #cbd5e1; }

/* Caso badges */
.b-est-ABR[b-adez0xnjb8] { background: rgba(37,99,235,0.18); color: #1d4ed8; }
.b-est-ENP[b-adez0xnjb8] { background: rgba(217,119,6,0.18); color: #b45309; }
.b-est-ESP[b-adez0xnjb8] { background: rgba(8,145,178,0.18); color: #0e7490; }
.b-est-ESC[b-adez0xnjb8] { background: rgba(220,38,38,0.2); color: #991b1b; }
.b-est-RES[b-adez0xnjb8] { background: rgba(22,163,74,0.18); color: #15803d; }
.b-est-CER[b-adez0xnjb8] { background: rgba(100,116,139,0.22); color: #475569; }
.b-est-REA[b-adez0xnjb8] { background: rgba(124,58,237,0.18); color: #6d28d9; }
.b-est-ANU[b-adez0xnjb8] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-U[b-adez0xnjb8] { background: rgba(220,38,38,0.22); color: #991b1b; }
.b-prio-A[b-adez0xnjb8] { background: rgba(217,119,6,0.22); color: #b45309; }
.b-prio-N[b-adez0xnjb8] { background: rgba(100,116,139,0.22); color: #475569; }
.b-prio-B[b-adez0xnjb8] { background: rgba(8,145,178,0.18); color: #0e7490; }
[data-mode="dark"] .b-est-ABR[b-adez0xnjb8] { color: #93c5fd; }
[data-mode="dark"] .b-est-ENP[b-adez0xnjb8] { color: #fcd34d; }
[data-mode="dark"] .b-est-ESP[b-adez0xnjb8] { color: #67e8f9; }
[data-mode="dark"] .b-est-ESC[b-adez0xnjb8] { color: #fca5a5; }
[data-mode="dark"] .b-est-RES[b-adez0xnjb8] { color: #86efac; }
[data-mode="dark"] .b-est-CER[b-adez0xnjb8] { color: #cbd5e1; }
[data-mode="dark"] .b-est-REA[b-adez0xnjb8] { color: #c4b5fd; }
[data-mode="dark"] .b-prio-U[b-adez0xnjb8] { color: #fca5a5; }
[data-mode="dark"] .b-prio-A[b-adez0xnjb8] { color: #fcd34d; }
[data-mode="dark"] .b-prio-N[b-adez0xnjb8] { color: #cbd5e1; }

/* Search bar */
.crud-search-bar[b-adez0xnjb8] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.4rem; padding: 0.3rem 0.5rem; }
.crud-search-bar input[b-adez0xnjb8] { flex: 1; border: none; background: transparent; color: var(--rg-text-primary); font-size: 0.88rem; padding: 0.4rem; outline: none; }
.crud-search-btn[b-adez0xnjb8] { background: none; border: none; color: var(--rg-text-muted); cursor: pointer; padding: 0.3rem 0.5rem; font-size: 0.95rem; }
.crud-search-btn:hover[b-adez0xnjb8] { color: var(--rg-accent, #2563eb); }
.crud-count[b-adez0xnjb8] { font-size: 0.78rem; color: var(--rg-text-muted); padding: 0 0.5rem; }

/* Filters */
.ma-filters[b-adez0xnjb8] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.ma-filters select[b-adez0xnjb8], .ma-filters input[b-adez0xnjb8] { padding: 0.4rem 0.65rem; background: var(--rg-bg-card); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.82rem; }

/* Alerts */
.crud-alert[b-adez0xnjb8] { padding: 0.7rem 0.85rem; border-radius: 0.4rem; margin-bottom: 0.85rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.86rem; }
.crud-alert.success[b-adez0xnjb8] { background: rgba(22,163,74,0.12); color: #15803d; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-adez0xnjb8] { background: rgba(220,38,38,0.12); color: #991b1b; border: 1px solid rgba(220,38,38,0.3); }
[data-mode="dark"] .crud-alert.success[b-adez0xnjb8] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-adez0xnjb8] { color: #fca5a5; }
.crud-alert-close[b-adez0xnjb8] { background: none; border: none; cursor: pointer; margin-left: auto; color: inherit; }

/* Form fields */
.form-group[b-adez0xnjb8] { margin-bottom: 0.9rem; }
.form-group label[b-adez0xnjb8] { display: block; font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.25rem; font-weight: 600; }
.form-group input[b-adez0xnjb8], .form-group select[b-adez0xnjb8], .form-group textarea[b-adez0xnjb8] { width: 100%; padding: 0.45rem 0.65rem; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.35rem; font-size: 0.88rem; font-family: inherit; }
.form-group textarea[b-adez0xnjb8] { min-height: 80px; resize: vertical; }
.form-row-2[b-adez0xnjb8] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.form-row-3[b-adez0xnjb8] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.form-check[b-adez0xnjb8] { display: inline-flex; align-items: center; gap: 0.4rem; }
.form-check input[type="checkbox"][b-adez0xnjb8] { width: auto; }

.form-check-group[b-adez0xnjb8] { margin-top: 0.5rem; }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmcierrediario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-dj186lxr55] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-dj186lxr55 0.3s ease-out; }
@keyframes slideUp-b-dj186lxr55 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-dj186lxr55] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-dj186lxr55] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-dj186lxr55] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-dj186lxr55] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-dj186lxr55] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-dj186lxr55] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-dj186lxr55] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-dj186lxr55] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-dj186lxr55] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-dj186lxr55] { filter: brightness(1.1); }
.btn-outline[b-dj186lxr55] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-dj186lxr55] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-dj186lxr55] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-dj186lxr55] { filter: brightness(1.1); }
.btn-icon[b-dj186lxr55] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-dj186lxr55] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-dj186lxr55] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-dj186lxr55] { color: #ef4444; }
.btn-delete:hover[b-dj186lxr55] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-dj186lxr55] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-dj186lxr55] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-dj186lxr55] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-dj186lxr55] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-dj186lxr55] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-dj186lxr55] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-dj186lxr55] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-dj186lxr55] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-dj186lxr55] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-dj186lxr55] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-dj186lxr55] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-dj186lxr55] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-dj186lxr55] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-dj186lxr55] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-dj186lxr55] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-dj186lxr55] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-dj186lxr55] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-dj186lxr55] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-dj186lxr55] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-dj186lxr55] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-dj186lxr55] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-dj186lxr55] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-dj186lxr55] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-dj186lxr55] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-dj186lxr55] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-dj186lxr55] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-dj186lxr55] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-dj186lxr55] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-dj186lxr55] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-dj186lxr55] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-dj186lxr55] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-dj186lxr55] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-dj186lxr55] { display: block; }
.hide-on-cards[b-dj186lxr55] { display: none !important; }
.show-on-cards[b-dj186lxr55] { display: grid; }
.hide-on-grid[b-dj186lxr55] { display: none !important; }

/* Badges */
.badge[b-dj186lxr55] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-dj186lxr55] { background: #ecfdf5; color: #065f46; }
.badge-no[b-dj186lxr55] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-dj186lxr55] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-dj186lxr55] { text-align: center; }
.text-muted[b-dj186lxr55] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-dj186lxr55], .crud-empty-state[b-dj186lxr55] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-dj186lxr55] { font-size: 2rem; }
.crud-spinner[b-dj186lxr55] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-dj186lxr55 0.6s linear infinite; }
.crud-spinner-sm[b-dj186lxr55] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-dj186lxr55 0.6s linear infinite; }
@keyframes spin-b-dj186lxr55 { to { transform: rotate(360deg); } }
.spin[b-dj186lxr55] { animation: spin-b-dj186lxr55 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-dj186lxr55] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-dj186lxr55 0.15s ease-out; }
.modal-container[b-dj186lxr55] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-dj186lxr55] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-dj186lxr55 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-dj186lxr55] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-dj186lxr55] { max-width: 420px; }
@keyframes fadeIn-b-dj186lxr55 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-dj186lxr55 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-dj186lxr55] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-dj186lxr55] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-dj186lxr55] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-dj186lxr55] { color: #dc2626; }
.modal-close[b-dj186lxr55] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-dj186lxr55] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-dj186lxr55] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-dj186lxr55] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-dj186lxr55] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-dj186lxr55] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-dj186lxr55] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-dj186lxr55] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-dj186lxr55] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-dj186lxr55] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-dj186lxr55] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-dj186lxr55] { flex: 2; }
.form-group label[b-dj186lxr55] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-dj186lxr55], .form-group select[b-dj186lxr55], .form-textarea[b-dj186lxr55] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-dj186lxr55], .form-group select:focus[b-dj186lxr55], .form-textarea:focus[b-dj186lxr55] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-dj186lxr55] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-dj186lxr55] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-dj186lxr55] { flex: 1; display: flex; align-items: center; }
.form-check[b-dj186lxr55] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-dj186lxr55] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-dj186lxr55] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-dj186lxr55] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-dj186lxr55] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-dj186lxr55] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-dj186lxr55] { font-size: 3rem; }
.photo-placeholder span[b-dj186lxr55] { font-size: 0.78rem; }
.photo-actions[b-dj186lxr55] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-dj186lxr55] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-dj186lxr55] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-dj186lxr55] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-dj186lxr55] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-dj186lxr55] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-dj186lxr55] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-dj186lxr55] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-dj186lxr55] { filter: brightness(1.15); transform: scale(1.05); }
[b-dj186lxr55] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-dj186lxr55] { padding: 0.75rem; }
    .crud-header[b-dj186lxr55] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-dj186lxr55] { font-size: 1.1rem; }
    .btn-text[b-dj186lxr55] { display: none; }
    .form-row[b-dj186lxr55] { flex-direction: column; }
    .form-row-4[b-dj186lxr55] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-dj186lxr55] { width: 98%; max-height: 95vh; }
    .modal-lg[b-dj186lxr55] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-dj186lxr55] { padding: 0.75rem; }
    .modal-tabs[b-dj186lxr55] { overflow-x: auto; }
    .modal-tab[b-dj186lxr55] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-dj186lxr55] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-dj186lxr55] { display: grid !important; }
    .crud-cards-wrapper[b-dj186lxr55] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-dj186lxr55] { grid-template-columns: 1fr; }
    .card-details[b-dj186lxr55] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-dj186lxr55] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-dj186lxr55] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-dj186lxr55] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-dj186lxr55] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmcolores.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-5eukxif1c8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5eukxif1c8 0.3s ease-out; }
@keyframes slideUp-b-5eukxif1c8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5eukxif1c8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5eukxif1c8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5eukxif1c8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5eukxif1c8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5eukxif1c8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5eukxif1c8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5eukxif1c8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5eukxif1c8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5eukxif1c8] { filter: brightness(1.1); }
.btn-outline[b-5eukxif1c8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5eukxif1c8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5eukxif1c8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5eukxif1c8] { filter: brightness(1.1); }
.btn-icon[b-5eukxif1c8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5eukxif1c8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5eukxif1c8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5eukxif1c8] { color: #ef4444; }
.btn-delete:hover[b-5eukxif1c8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-5eukxif1c8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5eukxif1c8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-5eukxif1c8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-5eukxif1c8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5eukxif1c8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5eukxif1c8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-5eukxif1c8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5eukxif1c8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-5eukxif1c8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5eukxif1c8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5eukxif1c8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5eukxif1c8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-5eukxif1c8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5eukxif1c8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-5eukxif1c8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-5eukxif1c8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-5eukxif1c8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-5eukxif1c8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-5eukxif1c8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-5eukxif1c8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-5eukxif1c8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-5eukxif1c8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-5eukxif1c8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-5eukxif1c8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-5eukxif1c8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-5eukxif1c8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-5eukxif1c8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-5eukxif1c8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-5eukxif1c8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-5eukxif1c8] { display: block; }
.hide-on-cards[b-5eukxif1c8] { display: none !important; }
.show-on-cards[b-5eukxif1c8] { display: grid; }
.hide-on-grid[b-5eukxif1c8] { display: none !important; }

/* Badges */
.badge[b-5eukxif1c8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5eukxif1c8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-5eukxif1c8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-5eukxif1c8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-5eukxif1c8] { text-align: center; }
.text-muted[b-5eukxif1c8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-5eukxif1c8], .crud-empty-state[b-5eukxif1c8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5eukxif1c8] { font-size: 2rem; }
.crud-spinner[b-5eukxif1c8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5eukxif1c8 0.6s linear infinite; }
.crud-spinner-sm[b-5eukxif1c8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5eukxif1c8 0.6s linear infinite; }
@keyframes spin-b-5eukxif1c8 { to { transform: rotate(360deg); } }
.spin[b-5eukxif1c8] { animation: spin-b-5eukxif1c8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-5eukxif1c8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5eukxif1c8 0.15s ease-out; }
.modal-container[b-5eukxif1c8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5eukxif1c8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5eukxif1c8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-5eukxif1c8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-5eukxif1c8] { max-width: 420px; }
@keyframes fadeIn-b-5eukxif1c8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5eukxif1c8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-5eukxif1c8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5eukxif1c8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-5eukxif1c8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-5eukxif1c8] { color: #dc2626; }
.modal-close[b-5eukxif1c8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5eukxif1c8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5eukxif1c8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5eukxif1c8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-5eukxif1c8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-5eukxif1c8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-5eukxif1c8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-5eukxif1c8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-5eukxif1c8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-5eukxif1c8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-5eukxif1c8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-5eukxif1c8] { flex: 2; }
.form-group label[b-5eukxif1c8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5eukxif1c8], .form-group select[b-5eukxif1c8], .form-textarea[b-5eukxif1c8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5eukxif1c8], .form-group select:focus[b-5eukxif1c8], .form-textarea:focus[b-5eukxif1c8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-5eukxif1c8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-5eukxif1c8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-5eukxif1c8] { flex: 1; display: flex; align-items: center; }
.form-check[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-5eukxif1c8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-5eukxif1c8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-5eukxif1c8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-5eukxif1c8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-5eukxif1c8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-5eukxif1c8] { font-size: 3rem; }
.photo-placeholder span[b-5eukxif1c8] { font-size: 0.78rem; }
.photo-actions[b-5eukxif1c8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-5eukxif1c8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-5eukxif1c8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-5eukxif1c8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-5eukxif1c8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-5eukxif1c8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-5eukxif1c8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-5eukxif1c8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-5eukxif1c8] { filter: brightness(1.15); transform: scale(1.05); }
[b-5eukxif1c8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-5eukxif1c8] { padding: 0.75rem; }
    .crud-header[b-5eukxif1c8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5eukxif1c8] { font-size: 1.1rem; }
    .btn-text[b-5eukxif1c8] { display: none; }
    .form-row[b-5eukxif1c8] { flex-direction: column; }
    .form-row-4[b-5eukxif1c8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-5eukxif1c8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-5eukxif1c8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-5eukxif1c8] { padding: 0.75rem; }
    .modal-tabs[b-5eukxif1c8] { overflow-x: auto; }
    .modal-tab[b-5eukxif1c8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-5eukxif1c8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-5eukxif1c8] { display: grid !important; }
    .crud-cards-wrapper[b-5eukxif1c8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-5eukxif1c8] { grid-template-columns: 1fr; }
    .card-details[b-5eukxif1c8] { flex-direction: column; gap: 0.35rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-5eukxif1c8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5eukxif1c8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5eukxif1c8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5eukxif1c8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmmarcavehiculos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-an3pfww6eu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-an3pfww6eu 0.3s ease-out; }
@keyframes slideUp-b-an3pfww6eu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-an3pfww6eu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-an3pfww6eu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-an3pfww6eu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-an3pfww6eu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-an3pfww6eu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-an3pfww6eu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-an3pfww6eu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-an3pfww6eu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-an3pfww6eu] { filter: brightness(1.1); }
.btn-outline[b-an3pfww6eu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-an3pfww6eu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-an3pfww6eu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-an3pfww6eu] { filter: brightness(1.1); }
.btn-icon[b-an3pfww6eu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-an3pfww6eu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-an3pfww6eu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-an3pfww6eu] { color: #ef4444; }
.btn-delete:hover[b-an3pfww6eu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-an3pfww6eu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-an3pfww6eu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-an3pfww6eu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-an3pfww6eu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-an3pfww6eu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-an3pfww6eu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-an3pfww6eu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-an3pfww6eu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-an3pfww6eu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-an3pfww6eu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-an3pfww6eu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-an3pfww6eu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-an3pfww6eu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-an3pfww6eu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-an3pfww6eu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-an3pfww6eu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-an3pfww6eu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-an3pfww6eu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-an3pfww6eu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-an3pfww6eu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-an3pfww6eu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-an3pfww6eu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-an3pfww6eu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-an3pfww6eu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-an3pfww6eu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-an3pfww6eu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-an3pfww6eu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-an3pfww6eu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-an3pfww6eu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-an3pfww6eu] { display: block; }
.hide-on-cards[b-an3pfww6eu] { display: none !important; }
.show-on-cards[b-an3pfww6eu] { display: grid; }
.hide-on-grid[b-an3pfww6eu] { display: none !important; }

/* Badges */
.badge[b-an3pfww6eu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-an3pfww6eu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-an3pfww6eu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-an3pfww6eu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-an3pfww6eu] { text-align: center; }
.text-muted[b-an3pfww6eu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-an3pfww6eu], .crud-empty-state[b-an3pfww6eu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-an3pfww6eu] { font-size: 2rem; }
.crud-spinner[b-an3pfww6eu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-an3pfww6eu 0.6s linear infinite; }
.crud-spinner-sm[b-an3pfww6eu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-an3pfww6eu 0.6s linear infinite; }
@keyframes spin-b-an3pfww6eu { to { transform: rotate(360deg); } }
.spin[b-an3pfww6eu] { animation: spin-b-an3pfww6eu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-an3pfww6eu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-an3pfww6eu 0.15s ease-out; }
.modal-container[b-an3pfww6eu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-an3pfww6eu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-an3pfww6eu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-an3pfww6eu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-an3pfww6eu] { max-width: 420px; }
@keyframes fadeIn-b-an3pfww6eu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-an3pfww6eu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-an3pfww6eu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-an3pfww6eu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-an3pfww6eu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-an3pfww6eu] { color: #dc2626; }
.modal-close[b-an3pfww6eu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-an3pfww6eu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-an3pfww6eu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-an3pfww6eu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-an3pfww6eu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-an3pfww6eu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-an3pfww6eu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-an3pfww6eu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-an3pfww6eu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-an3pfww6eu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-an3pfww6eu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-an3pfww6eu] { flex: 2; }
.form-group label[b-an3pfww6eu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-an3pfww6eu], .form-group select[b-an3pfww6eu], .form-textarea[b-an3pfww6eu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-an3pfww6eu], .form-group select:focus[b-an3pfww6eu], .form-textarea:focus[b-an3pfww6eu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-an3pfww6eu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-an3pfww6eu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-an3pfww6eu] { flex: 1; display: flex; align-items: center; }
.form-check[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-an3pfww6eu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-an3pfww6eu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-an3pfww6eu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-an3pfww6eu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-an3pfww6eu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-an3pfww6eu] { font-size: 3rem; }
.photo-placeholder span[b-an3pfww6eu] { font-size: 0.78rem; }
.photo-actions[b-an3pfww6eu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-an3pfww6eu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-an3pfww6eu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-an3pfww6eu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-an3pfww6eu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-an3pfww6eu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-an3pfww6eu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-an3pfww6eu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-an3pfww6eu] { filter: brightness(1.15); transform: scale(1.05); }
[b-an3pfww6eu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-an3pfww6eu] { padding: 0.75rem; }
    .crud-header[b-an3pfww6eu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-an3pfww6eu] { font-size: 1.1rem; }
    .btn-text[b-an3pfww6eu] { display: none; }
    .form-row[b-an3pfww6eu] { flex-direction: column; }
    .form-row-4[b-an3pfww6eu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-an3pfww6eu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-an3pfww6eu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-an3pfww6eu] { padding: 0.75rem; }
    .modal-tabs[b-an3pfww6eu] { overflow-x: auto; }
    .modal-tab[b-an3pfww6eu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-an3pfww6eu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-an3pfww6eu] { display: grid !important; }
    .crud-cards-wrapper[b-an3pfww6eu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-an3pfww6eu] { grid-template-columns: 1fr; }
    .card-details[b-an3pfww6eu] { flex-direction: column; gap: 0.35rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-an3pfww6eu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-an3pfww6eu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-an3pfww6eu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-an3pfww6eu] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminacamiones.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-j8asni6gyc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-j8asni6gyc 0.3s ease-out; }
@keyframes slideUp-b-j8asni6gyc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-j8asni6gyc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-j8asni6gyc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-j8asni6gyc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-j8asni6gyc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-j8asni6gyc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-j8asni6gyc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-j8asni6gyc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-j8asni6gyc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-j8asni6gyc] { filter: brightness(1.1); }
.btn-outline[b-j8asni6gyc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-j8asni6gyc] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-j8asni6gyc] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-j8asni6gyc] { filter: brightness(1.1); }
.btn-icon[b-j8asni6gyc] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-j8asni6gyc] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-j8asni6gyc] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-j8asni6gyc] { color: #ef4444; }
.btn-delete:hover[b-j8asni6gyc] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-j8asni6gyc] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-j8asni6gyc] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-j8asni6gyc] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-j8asni6gyc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-j8asni6gyc] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-j8asni6gyc] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-j8asni6gyc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-j8asni6gyc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-j8asni6gyc] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-j8asni6gyc] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-j8asni6gyc] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-j8asni6gyc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-j8asni6gyc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-j8asni6gyc] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-j8asni6gyc] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-j8asni6gyc] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-j8asni6gyc] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-j8asni6gyc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-j8asni6gyc] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-j8asni6gyc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-j8asni6gyc] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-j8asni6gyc] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-j8asni6gyc] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-j8asni6gyc] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-j8asni6gyc] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-j8asni6gyc] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-j8asni6gyc] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-j8asni6gyc] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-j8asni6gyc] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-j8asni6gyc] { display: block; }
.hide-on-cards[b-j8asni6gyc] { display: none !important; }
.show-on-cards[b-j8asni6gyc] { display: grid; }
.hide-on-grid[b-j8asni6gyc] { display: none !important; }

/* Badges */
.badge[b-j8asni6gyc] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-j8asni6gyc] { background: #ecfdf5; color: #065f46; }
.badge-no[b-j8asni6gyc] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-j8asni6gyc] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-j8asni6gyc] { text-align: center; }
.text-muted[b-j8asni6gyc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-j8asni6gyc], .crud-empty-state[b-j8asni6gyc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-j8asni6gyc] { font-size: 2rem; }
.crud-spinner[b-j8asni6gyc] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-j8asni6gyc 0.6s linear infinite; }
.crud-spinner-sm[b-j8asni6gyc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-j8asni6gyc 0.6s linear infinite; }
@keyframes spin-b-j8asni6gyc { to { transform: rotate(360deg); } }
.spin[b-j8asni6gyc] { animation: spin-b-j8asni6gyc 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-j8asni6gyc] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-j8asni6gyc 0.15s ease-out; }
.modal-container[b-j8asni6gyc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-j8asni6gyc] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-j8asni6gyc 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-j8asni6gyc] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-j8asni6gyc] { max-width: 420px; }
.modal-md[b-j8asni6gyc] { max-width: 720px; }
/* Modal estilo tarjeta para camiones: compacto, 2 columnas */
.truck-card-modal[b-j8asni6gyc] { max-width: 720px; }
.truck-card-modal .modal-body .form-row[b-j8asni6gyc] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 0.75rem; }
.truck-card-modal .form-row:last-child[b-j8asni6gyc] { margin-bottom: 0; }
.truck-card-modal .form-check-wrap[b-j8asni6gyc] { display: flex; flex-direction: column; justify-content: flex-end; }
.truck-card-modal .form-check-wrap .form-check[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0; }
@media (max-width: 640px) {
    .truck-card-modal .modal-body .form-row[b-j8asni6gyc] { grid-template-columns: 1fr; }
}
@keyframes fadeIn-b-j8asni6gyc { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-j8asni6gyc { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-j8asni6gyc] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-j8asni6gyc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-j8asni6gyc] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-j8asni6gyc] { color: #dc2626; }
.modal-close[b-j8asni6gyc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-j8asni6gyc] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-j8asni6gyc] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-j8asni6gyc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-j8asni6gyc] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-j8asni6gyc] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-j8asni6gyc] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-j8asni6gyc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-j8asni6gyc] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-j8asni6gyc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-j8asni6gyc] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-j8asni6gyc] { flex: 2; }
.form-group label[b-j8asni6gyc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-j8asni6gyc], .form-group select[b-j8asni6gyc], .form-textarea[b-j8asni6gyc] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-j8asni6gyc], .form-group select:focus[b-j8asni6gyc], .form-textarea:focus[b-j8asni6gyc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-j8asni6gyc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-j8asni6gyc] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-j8asni6gyc] { flex: 1; display: flex; align-items: center; }
.form-check[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-j8asni6gyc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-j8asni6gyc] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-j8asni6gyc] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-j8asni6gyc] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-j8asni6gyc] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-j8asni6gyc] { font-size: 3rem; }
.photo-placeholder span[b-j8asni6gyc] { font-size: 0.78rem; }
.photo-actions[b-j8asni6gyc] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-j8asni6gyc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-j8asni6gyc] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-j8asni6gyc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-j8asni6gyc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-j8asni6gyc] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-j8asni6gyc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-j8asni6gyc] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-j8asni6gyc] { filter: brightness(1.15); transform: scale(1.05); }
[b-j8asni6gyc] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-j8asni6gyc] { padding: 0.75rem; }
    .crud-header[b-j8asni6gyc] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-j8asni6gyc] { font-size: 1.1rem; }
    .btn-text[b-j8asni6gyc] { display: none; }
    .form-row[b-j8asni6gyc] { flex-direction: column; }
    .form-row-4[b-j8asni6gyc] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-j8asni6gyc] { width: 98%; max-height: 95vh; }
    .modal-lg[b-j8asni6gyc] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-j8asni6gyc] { padding: 0.75rem; }
    .modal-tabs[b-j8asni6gyc] { overflow-x: auto; }
    .modal-tab[b-j8asni6gyc] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-j8asni6gyc] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-j8asni6gyc] { display: grid !important; }
    .crud-cards-wrapper[b-j8asni6gyc] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-j8asni6gyc] { grid-template-columns: 1fr; }
    .card-details[b-j8asni6gyc] { flex-direction: column; gap: 0.35rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-j8asni6gyc] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-j8asni6gyc] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-j8asni6gyc] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-j8asni6gyc] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminachoferes.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1rsz2gvzcm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1rsz2gvzcm 0.3s ease-out; }
@keyframes slideUp-b-1rsz2gvzcm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1rsz2gvzcm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1rsz2gvzcm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1rsz2gvzcm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1rsz2gvzcm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1rsz2gvzcm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1rsz2gvzcm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1rsz2gvzcm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1rsz2gvzcm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1rsz2gvzcm] { filter: brightness(1.1); }
.btn-outline[b-1rsz2gvzcm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1rsz2gvzcm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1rsz2gvzcm] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1rsz2gvzcm] { filter: brightness(1.1); }
.btn-icon[b-1rsz2gvzcm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1rsz2gvzcm] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1rsz2gvzcm] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1rsz2gvzcm] { color: #ef4444; }
.btn-delete:hover[b-1rsz2gvzcm] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1rsz2gvzcm] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1rsz2gvzcm] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1rsz2gvzcm] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1rsz2gvzcm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1rsz2gvzcm] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1rsz2gvzcm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1rsz2gvzcm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1rsz2gvzcm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1rsz2gvzcm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1rsz2gvzcm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1rsz2gvzcm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1rsz2gvzcm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1rsz2gvzcm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1rsz2gvzcm] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1rsz2gvzcm] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1rsz2gvzcm] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1rsz2gvzcm] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1rsz2gvzcm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1rsz2gvzcm] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1rsz2gvzcm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1rsz2gvzcm] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1rsz2gvzcm] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1rsz2gvzcm] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1rsz2gvzcm] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1rsz2gvzcm] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1rsz2gvzcm] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1rsz2gvzcm] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1rsz2gvzcm] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1rsz2gvzcm] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1rsz2gvzcm] { display: block; }
.hide-on-cards[b-1rsz2gvzcm] { display: none !important; }
.show-on-cards[b-1rsz2gvzcm] { display: grid; }
.hide-on-grid[b-1rsz2gvzcm] { display: none !important; }

/* Badges */
.badge[b-1rsz2gvzcm] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1rsz2gvzcm] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1rsz2gvzcm] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1rsz2gvzcm] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1rsz2gvzcm] { text-align: center; }
.text-muted[b-1rsz2gvzcm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1rsz2gvzcm], .crud-empty-state[b-1rsz2gvzcm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1rsz2gvzcm] { font-size: 2rem; }
.crud-spinner[b-1rsz2gvzcm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1rsz2gvzcm 0.6s linear infinite; }
.crud-spinner-sm[b-1rsz2gvzcm] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1rsz2gvzcm 0.6s linear infinite; }
@keyframes spin-b-1rsz2gvzcm { to { transform: rotate(360deg); } }
.spin[b-1rsz2gvzcm] { animation: spin-b-1rsz2gvzcm 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1rsz2gvzcm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1rsz2gvzcm 0.15s ease-out; }
.modal-container[b-1rsz2gvzcm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1rsz2gvzcm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1rsz2gvzcm 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-1rsz2gvzcm] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1rsz2gvzcm] { max-width: 420px; }
@keyframes fadeIn-b-1rsz2gvzcm { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1rsz2gvzcm { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1rsz2gvzcm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1rsz2gvzcm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1rsz2gvzcm] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1rsz2gvzcm] { color: #dc2626; }
.modal-close[b-1rsz2gvzcm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1rsz2gvzcm] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1rsz2gvzcm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1rsz2gvzcm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1rsz2gvzcm] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1rsz2gvzcm] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1rsz2gvzcm] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1rsz2gvzcm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1rsz2gvzcm] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1rsz2gvzcm] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1rsz2gvzcm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1rsz2gvzcm] { flex: 2; }
.form-group label[b-1rsz2gvzcm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1rsz2gvzcm], .form-group select[b-1rsz2gvzcm], .form-textarea[b-1rsz2gvzcm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1rsz2gvzcm], .form-group select:focus[b-1rsz2gvzcm], .form-textarea:focus[b-1rsz2gvzcm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1rsz2gvzcm] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1rsz2gvzcm] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1rsz2gvzcm] { flex: 1; display: flex; align-items: center; }
.form-check[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1rsz2gvzcm] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1rsz2gvzcm] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1rsz2gvzcm] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1rsz2gvzcm] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1rsz2gvzcm] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1rsz2gvzcm] { font-size: 3rem; }
.photo-placeholder span[b-1rsz2gvzcm] { font-size: 0.78rem; }
.photo-actions[b-1rsz2gvzcm] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1rsz2gvzcm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-1rsz2gvzcm] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1rsz2gvzcm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1rsz2gvzcm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1rsz2gvzcm] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1rsz2gvzcm] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1rsz2gvzcm] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1rsz2gvzcm] { filter: brightness(1.15); transform: scale(1.05); }
[b-1rsz2gvzcm] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1rsz2gvzcm] { padding: 0.75rem; }
    .crud-header[b-1rsz2gvzcm] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1rsz2gvzcm] { font-size: 1.1rem; }
    .btn-text[b-1rsz2gvzcm] { display: none; }
    .form-row[b-1rsz2gvzcm] { flex-direction: column; }
    .form-row-4[b-1rsz2gvzcm] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1rsz2gvzcm] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1rsz2gvzcm] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1rsz2gvzcm] { padding: 0.75rem; }
    .modal-tabs[b-1rsz2gvzcm] { overflow-x: auto; }
    .modal-tab[b-1rsz2gvzcm] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1rsz2gvzcm] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1rsz2gvzcm] { display: grid !important; }
    .crud-cards-wrapper[b-1rsz2gvzcm] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1rsz2gvzcm] { grid-template-columns: 1fr; }
    .card-details[b-1rsz2gvzcm] { flex-direction: column; gap: 0.35rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1rsz2gvzcm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1rsz2gvzcm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1rsz2gvzcm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1rsz2gvzcm] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/FrmminaClienteAutorizadoCredito.razor.rz.scp.css */
/* ============================================================
   FrmminaClienteAutorizadoCredito — Estilos CRUD canónicos
   Copiado de Frmclientes.razor.css + extensiones propias
   ============================================================ */

.crud-container[b-cqtjwf1ti3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-cqtjwf1ti3 0.3s ease-out; }
@keyframes slideUp-b-cqtjwf1ti3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-cqtjwf1ti3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-cqtjwf1ti3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-cqtjwf1ti3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-cqtjwf1ti3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-cqtjwf1ti3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-cqtjwf1ti3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-cqtjwf1ti3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-cqtjwf1ti3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-cqtjwf1ti3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-cqtjwf1ti3] { filter: brightness(1.1); }
.btn-outline[b-cqtjwf1ti3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-cqtjwf1ti3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-cqtjwf1ti3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-cqtjwf1ti3] { filter: brightness(1.1); }
.btn-sm[b-cqtjwf1ti3] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-cqtjwf1ti3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-delete[b-cqtjwf1ti3] { color: #ef4444; }
.btn-delete:hover[b-cqtjwf1ti3] { background: rgba(239, 68, 68, 0.1); }
.btn-toggle-on[b-cqtjwf1ti3]  { color: #22c55e; }
.btn-toggle-on:hover[b-cqtjwf1ti3]  { background: rgba(34, 197, 94, 0.1); }
.btn-toggle-off[b-cqtjwf1ti3] { color: #94a3b8; }
.btn-toggle-off:hover[b-cqtjwf1ti3] { background: rgba(148, 163, 184, 0.1); }

/* Alert */
.crud-alert[b-cqtjwf1ti3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert-success[b-cqtjwf1ti3] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert-error[b-cqtjwf1ti3]   { background: rgba(239,68,68,0.1);  color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-cqtjwf1ti3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert-success[b-cqtjwf1ti3] { color: #86efac; }
[data-mode="dark"] .crud-alert-error[b-cqtjwf1ti3]   { color: #fca5a5; }

/* Search */
.crud-search-bar[b-cqtjwf1ti3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-cqtjwf1ti3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0; display: flex; align-items: center; }
.crud-search-bar input[b-cqtjwf1ti3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-cqtjwf1ti3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-cqtjwf1ti3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-cqtjwf1ti3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-cqtjwf1ti3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-cqtjwf1ti3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-cqtjwf1ti3] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-cqtjwf1ti3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-cqtjwf1ti3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-cqtjwf1ti3] { width: 80px; text-align: center; white-space: nowrap; }

/* Avatar crédito */
.credito-avatar[b-cqtjwf1ti3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-subtle, #f1f5f9); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: var(--rg-accent, #4f46e5); }

/* Badges */
.badge[b-cqtjwf1ti3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-cqtjwf1ti3] { background: rgba(34,197,94,0.15); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.badge-no[b-cqtjwf1ti3]  { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); border: 1px solid var(--rg-border, #e2e8f0); }
[data-mode="dark"] .badge-yes[b-cqtjwf1ti3] { color: #86efac; }

/* Utilities */
.font-mono[b-cqtjwf1ti3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-cqtjwf1ti3] { text-align: center; }
.text-muted[b-cqtjwf1ti3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.text-info[b-cqtjwf1ti3] { color: #0ea5e9; }

/* Loading / Empty */
.crud-loading[b-cqtjwf1ti3], .crud-empty-state[b-cqtjwf1ti3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-loading-sm[b-cqtjwf1ti3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem; color: var(--rg-text-muted, #94a3b8); font-size: 0.8rem; }
.crud-empty-state i[b-cqtjwf1ti3] { font-size: 2rem; }
.crud-spinner[b-cqtjwf1ti3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-cqtjwf1ti3 0.6s linear infinite; }
.crud-spinner-sm[b-cqtjwf1ti3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-cqtjwf1ti3 0.6s linear infinite; }
@keyframes spin-b-cqtjwf1ti3 { to { transform: rotate(360deg); } }
.spin[b-cqtjwf1ti3] { animation: spin-b-cqtjwf1ti3 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-cqtjwf1ti3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-cqtjwf1ti3 0.15s ease-out; }
.modal-container[b-cqtjwf1ti3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-cqtjwf1ti3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-cqtjwf1ti3 0.2s ease-out; }
.modal-sm[b-cqtjwf1ti3] { max-width: 440px; }
@keyframes fadeIn-b-cqtjwf1ti3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-cqtjwf1ti3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-cqtjwf1ti3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-cqtjwf1ti3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-cqtjwf1ti3] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-cqtjwf1ti3] { color: #dc2626; }
.modal-close[b-cqtjwf1ti3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-cqtjwf1ti3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-cqtjwf1ti3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-cqtjwf1ti3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-group[b-cqtjwf1ti3] { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: 0.75rem; }
.form-group label[b-cqtjwf1ti3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group select[b-cqtjwf1ti3], .form-control[b-cqtjwf1ti3] { padding: 0.45rem 0.65rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; width: 100%; }
.form-group select:focus[b-cqtjwf1ti3], .form-control:focus[b-cqtjwf1ti3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Info en modal */
.credito-info-text[b-cqtjwf1ti3] { font-size: 0.8rem; color: var(--rg-text-secondary, #475569); background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.65rem 0.875rem; margin-bottom: 1rem; display: flex; gap: 0.5rem; align-items: flex-start; line-height: 1.5; }

/* ── Responsive helpers ──────────────────────────────────────── */
.hide-mobile[b-cqtjwf1ti3] { display: block; }
.show-mobile[b-cqtjwf1ti3] { display: none;  }

@media (max-width: 768px) {
    .crud-container[b-cqtjwf1ti3] { padding: 0.75rem; }
    .crud-header[b-cqtjwf1ti3] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-cqtjwf1ti3] { display: none; }
    .modal-dialog[b-cqtjwf1ti3] { width: 98%; }
    .hide-mobile[b-cqtjwf1ti3] { display: none !important; }
    .show-mobile[b-cqtjwf1ti3] { display: flex !important; }
}

/* ── Vista de tarjetas (móvil) ───────────────────────────────── */
.credito-cards[b-cqtjwf1ti3] {
    flex-direction: column;
    gap: 0.6rem;
}

.credito-card[b-cqtjwf1ti3] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.6rem;
    padding: 0.75rem;
    transition: box-shadow 0.15s;
}

.credito-card:active[b-cqtjwf1ti3] { box-shadow: 0 2px 10px rgba(0,0,0,0.08); }

.credito-card-inactive[b-cqtjwf1ti3] {
    opacity: 0.65;
    border-style: dashed;
}

/* Avatar grande en tarjeta */
.credito-avatar-lg[b-cqtjwf1ti3] {
    width: 40px;
    height: 40px;
    font-size: 1.35rem;
    flex-shrink: 0;
}

/* Cuerpo de la tarjeta */
.credito-card-body[b-cqtjwf1ti3] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.credito-card-nombre[b-cqtjwf1ti3] {
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.credito-card-id[b-cqtjwf1ti3] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}

.credito-card-meta[b-cqtjwf1ti3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    margin-top: 0.1rem;
}

.credito-card-meta i[b-cqtjwf1ti3] { margin-right: 0.2rem; }

/* Acciones en la tarjeta */
.credito-card-actions[b-cqtjwf1ti3] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* Dark mode para tarjetas */
[data-mode="dark"] .credito-card[b-cqtjwf1ti3] {
    background: var(--rg-bg-card);
    border-color: var(--rg-border);
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-cqtjwf1ti3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cqtjwf1ti3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cqtjwf1ti3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cqtjwf1ti3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminacobrosrealizados.razor.rz.scp.css */
/* ============================================================
   Frmminacobrosrealizados — Cobros Realizados / Reimpresión
   Patrón: copia literal de Frmclientes.razor.css +
           estilos propios del panel de filtros, acordeón y reporte
   ============================================================ */

.crud-container[b-0rmb8kohxr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-0rmb8kohxr 0.3s ease-out; }
@keyframes slideUp-b-0rmb8kohxr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-0rmb8kohxr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-0rmb8kohxr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-0rmb8kohxr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-0rmb8kohxr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-0rmb8kohxr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-0rmb8kohxr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-0rmb8kohxr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-0rmb8kohxr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-0rmb8kohxr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-0rmb8kohxr] { filter: brightness(1.1); }
.btn-outline[b-0rmb8kohxr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-0rmb8kohxr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-0rmb8kohxr] { padding: 0.3rem 0.55rem; font-size: 0.72rem; }
.btn-icon[b-0rmb8kohxr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-print[b-0rmb8kohxr] { color: var(--rg-accent, #4f46e5); }
.btn-print:hover:not(:disabled)[b-0rmb8kohxr] { background: rgba(79, 70, 229, 0.1); }

/* Alert */
.crud-alert[b-0rmb8kohxr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-0rmb8kohxr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-0rmb8kohxr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-0rmb8kohxr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-0rmb8kohxr] { background: rgba(16,185,129,0.12); color: #86efac; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-0rmb8kohxr] { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* Grid */
.crud-grid-wrapper[b-0rmb8kohxr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0 0 0.5rem 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); }
.cr-group-grid[b-0rmb8kohxr] { max-height: 340px; border-top: none; border-radius: 0; }
.crud-table[b-0rmb8kohxr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-0rmb8kohxr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-0rmb8kohxr] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.55rem 0.65rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-0rmb8kohxr] { padding: 0.45rem 0.65rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-0rmb8kohxr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-0rmb8kohxr] { text-align: center; white-space: nowrap; }
.text-right[b-0rmb8kohxr] { text-align: right; }
.text-center[b-0rmb8kohxr] { text-align: center; }
.font-mono[b-0rmb8kohxr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-muted[b-0rmb8kohxr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-0rmb8kohxr], .crud-empty-state[b-0rmb8kohxr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.5rem 1rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-0rmb8kohxr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-0rmb8kohxr 0.6s linear infinite; }
.crud-spinner-sm[b-0rmb8kohxr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-0rmb8kohxr 0.6s linear infinite; }
@keyframes spin-b-0rmb8kohxr { to { transform: rotate(360deg); } }

/* Badges */
.badge[b-0rmb8kohxr] { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem 0.45rem; border-radius: 1rem; font-size: 0.66rem; font-weight: 600; }
.badge-yes[b-0rmb8kohxr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-0rmb8kohxr]  { background: #f1f5f9; color: #64748b; }
.badge-contado[b-0rmb8kohxr] { background: rgba(16,185,129,0.12); color: #065f46; border: 1px solid rgba(16,185,129,0.25); }
.badge-credito[b-0rmb8kohxr] { background: rgba(14,165,233,0.12); color: #0369a1; border: 1px solid rgba(14,165,233,0.25); }
.badge-cupon[b-0rmb8kohxr]   { background: rgba(245,158,11,0.12); color: #92400e; border: 1px solid rgba(245,158,11,0.3); }
.cr-cupon-text[b-0rmb8kohxr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.72rem; padding: 0.2rem 0.55rem; white-space: nowrap; }
[data-mode="dark"] .badge-contado[b-0rmb8kohxr] { color: #86efac; }
[data-mode="dark"] .badge-credito[b-0rmb8kohxr] { color: #7dd3fc; }
[data-mode="dark"] .badge-cupon[b-0rmb8kohxr]   { color: #fcd34d; }

/* Modal */
.modal-backdrop[b-0rmb8kohxr] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(3px); z-index: 1000; animation: fadeIn-b-0rmb8kohxr 0.15s ease-out; }
.modal-container[b-0rmb8kohxr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-0rmb8kohxr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 720px; max-height: 88vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-0rmb8kohxr 0.2s ease-out; border: 1px solid var(--rg-border, #e2e8f0); }
.modal-sm[b-0rmb8kohxr] { max-width: 440px; }
.modal-pdf[b-0rmb8kohxr] { max-width: 960px; width: calc(100% - 2rem); max-height: 92vh; display: flex; flex-direction: column; }
@keyframes fadeIn-b-0rmb8kohxr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-0rmb8kohxr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-0rmb8kohxr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-0rmb8kohxr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-0rmb8kohxr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-0rmb8kohxr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-0rmb8kohxr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-0rmb8kohxr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ============================================================
   Panel de Filtros
   ============================================================ */
.cr-filtros[b-0rmb8kohxr] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.85rem 1rem;
    margin-bottom: 0.85rem;
}

.cr-filtro-group[b-0rmb8kohxr] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    transition: opacity 0.2s;
}

.cr-filtro-group label[b-0rmb8kohxr] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.cr-filtro-group input[type="text"][b-0rmb8kohxr],
.cr-filtro-group input[type="date"][b-0rmb8kohxr] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s;
    height: 2.2rem;
}

.cr-filtro-group input:focus[b-0rmb8kohxr] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79,70,229,0.15);
}

.cr-filtro-group input:disabled[b-0rmb8kohxr] { opacity: 0.45; cursor: not-allowed; }
.cr-disabled[b-0rmb8kohxr] { opacity: 0.45; pointer-events: none; }
.cr-input-orden[b-0rmb8kohxr] { width: 140px; }

.cr-opcional[b-0rmb8kohxr] {
    font-size: 0.6rem;
    font-weight: 400;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: none;
    letter-spacing: 0;
}

.cr-filtro-buscar[b-0rmb8kohxr] { margin-left: auto; }

/* Toggle Todas / Con Cupón */
.cr-toggle-group[b-0rmb8kohxr] {
    display: flex;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.4rem;
    overflow: hidden;
    height: 2.2rem;
}

.cr-toggle-btn[b-0rmb8kohxr] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0 0.75rem;
    border: none;
    background: var(--rg-bg-input, #fff);
    color: var(--rg-text-secondary, #475569);
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    border-right: 1px solid var(--rg-border, #e2e8f0);
}

.cr-toggle-btn:last-child[b-0rmb8kohxr] { border-right: none; }
.cr-toggle-btn:hover:not(:disabled)[b-0rmb8kohxr] { background: var(--rg-bg-hover, #f1f5f9); }
.cr-toggle-btn:disabled[b-0rmb8kohxr] { opacity: 0.45; cursor: not-allowed; }
.cr-toggle-active[b-0rmb8kohxr] { background: var(--rg-accent, #4f46e5) !important; color: #fff !important; }
.cr-toggle-cupon[b-0rmb8kohxr]  { background: rgba(245,158,11,0.85) !important; color: #fff !important; }

/* ============================================================
   Barra de resumen
   ============================================================ */
.cr-count-bar[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
    margin-bottom: 0.6rem;
    padding: 0 0.25rem;
}
.cr-count-bar strong[b-0rmb8kohxr] { color: var(--rg-text-primary, #1e293b); }

/* ============================================================
   Acordeón de grupos
   ============================================================ */
.cr-accordion[b-0rmb8kohxr] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.6rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.cr-accordion-header[b-0rmb8kohxr] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.7rem 1rem;
    border: none;
    cursor: pointer;
    transition: filter 0.15s;
    gap: 0.75rem;
    user-select: none;
}

.cr-accordion-header:hover[b-0rmb8kohxr] { filter: brightness(0.94); }

.cr-accordion-sin[b-0rmb8kohxr] {
    background: var(--rg-accent, #4f46e5);
    color: #fff;
}

.cr-accordion-con[b-0rmb8kohxr] {
    background: rgba(245,158,11,0.88);
    color: #fff;
}

.cr-accordion-left[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.cr-accordion-right[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.9rem;
    font-weight: 700;
}

.cr-accordion-title[b-0rmb8kohxr] { flex: 1; text-align: left; }

.cr-accordion-badge[b-0rmb8kohxr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4rem;
    height: 1.4rem;
    padding: 0 0.35rem;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 700;
}

.cr-badge-sin[b-0rmb8kohxr] { background: rgba(255,255,255,0.25); color: #fff; }
.cr-badge-con[b-0rmb8kohxr] { background: rgba(255,255,255,0.25); color: #fff; }

.cr-accordion-total[b-0rmb8kohxr] { font-size: 0.95rem; font-weight: 800; }

.cr-chevron[b-0rmb8kohxr] {
    font-size: 0.85rem;
    transition: transform 0.2s;
    opacity: 0.85;
}

.cr-accordion-body[b-0rmb8kohxr] {
    animation: slideDown-b-0rmb8kohxr 0.2s ease-out;
}

@keyframes slideDown-b-0rmb8kohxr {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   Subtotales de grupo
   ============================================================ */
.cr-group-subtotal[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.55rem 1rem;
    font-size: 0.82rem;
    font-weight: 600;
}

.cr-subtotal-sin[b-0rmb8kohxr] {
    background: rgba(79,70,229,0.07);
    color: var(--rg-accent, #4f46e5);
    border-top: 1px solid rgba(79,70,229,0.15);
}

.cr-subtotal-sin strong[b-0rmb8kohxr] {
    font-size: 0.95rem;
    color: var(--rg-accent, #4f46e5);
}

.cr-subtotal-con[b-0rmb8kohxr] {
    background: rgba(245,158,11,0.07);
    color: #92400e;
    border-top: 1px solid rgba(245,158,11,0.2);
}

.cr-subtotal-con strong[b-0rmb8kohxr] {
    font-size: 0.95rem;
    color: #92400e;
}

[data-mode="dark"] .cr-subtotal-con[b-0rmb8kohxr] { color: #fcd34d; }
[data-mode="dark"] .cr-subtotal-con strong[b-0rmb8kohxr] { color: #fcd34d; }

/* ============================================================
   Total General
   ============================================================ */
.cr-grand-total[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.75rem;
    padding: 0.85rem 1.25rem;
    background: var(--rg-accent, #4f46e5);
    border-radius: 0.6rem;
    color: #fff;
    box-shadow: 0 4px 14px rgba(79,70,229,0.28);
}

.cr-grand-total-label[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    opacity: 0.95;
}

.cr-grand-total-label span[b-0rmb8kohxr] {
    font-weight: 400;
    opacity: 0.8;
    font-size: 0.82rem;
}

.cr-grand-total-amount[b-0rmb8kohxr] {
    font-size: 1.3rem;
    font-weight: 800;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    letter-spacing: 0.02em;
}

/* ============================================================
   PDF Viewer modal body
   ============================================================ */
.cr-pdf-body[b-0rmb8kohxr] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    padding: 0.5rem;
}

.cr-pdf-iframe[b-0rmb8kohxr] {
    flex: 1;
    width: 100%;
    min-height: 580px;
    border: none;
    border-radius: 6px;
    background: var(--rg-bg-subtle, #f8fafc);
}

.cr-pdf-loading[b-0rmb8kohxr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-secondary, #475569);
    font-size: 0.875rem;
}

/* Dark mode overrides */
[data-mode="dark"] .cr-toggle-btn[b-0rmb8kohxr] { background: var(--rg-bg-input, #1e293b); }
[data-mode="dark"] .cr-toggle-btn:hover:not(:disabled)[b-0rmb8kohxr] { background: var(--rg-bg-hover, #334155); }
[data-mode="dark"] .cr-accordion[b-0rmb8kohxr] { border-color: var(--rg-border, #334155); }
[data-mode="dark"] .cr-grand-total[b-0rmb8kohxr] { box-shadow: 0 4px 14px rgba(79,70,229,0.4); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-0rmb8kohxr] { padding: 0.75rem; }
    .crud-header[b-0rmb8kohxr] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-0rmb8kohxr] { display: none; }
    .cr-filtros[b-0rmb8kohxr] { flex-direction: column; align-items: stretch; }
    .cr-filtro-buscar[b-0rmb8kohxr] { margin-left: 0; }
    .cr-input-orden[b-0rmb8kohxr] { width: 100%; }
    .cr-toggle-group[b-0rmb8kohxr] { width: 100%; }
    .cr-toggle-btn[b-0rmb8kohxr] { flex: 1; justify-content: center; }
    .modal-dialog[b-0rmb8kohxr] { width: 98%; max-height: 94vh; }
    .cr-accordion-right[b-0rmb8kohxr] { display: none; }
    .cr-grand-total-amount[b-0rmb8kohxr] { font-size: 1rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-0rmb8kohxr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-0rmb8kohxr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-0rmb8kohxr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-0rmb8kohxr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/FrmMinaControlTicketsMedioAmbiente.razor.rz.scp.css */
/* ============================================================
   Control Tickets Medio Ambiente — CRUD base + estilos propios
   ============================================================ */

.crud-container[b-x6ltj50wl9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x6ltj50wl9 0.3s ease-out; }
@keyframes slideUp-b-x6ltj50wl9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x6ltj50wl9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x6ltj50wl9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x6ltj50wl9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x6ltj50wl9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x6ltj50wl9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x6ltj50wl9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x6ltj50wl9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x6ltj50wl9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x6ltj50wl9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x6ltj50wl9] { filter: brightness(1.1); }
.btn-outline[b-x6ltj50wl9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x6ltj50wl9] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-x6ltj50wl9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x6ltj50wl9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x6ltj50wl9]   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x6ltj50wl9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-x6ltj50wl9] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.3); }
[data-mode="dark"] .crud-alert.error[b-x6ltj50wl9]   { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* Spinner */
.crud-spinner[b-x6ltj50wl9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x6ltj50wl9 0.6s linear infinite; }
.crud-spinner-sm[b-x6ltj50wl9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x6ltj50wl9 0.6s linear infinite; }
@keyframes spin-b-x6ltj50wl9 { to { transform: rotate(360deg); } }
.font-mono[b-x6ltj50wl9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* ============================================================
   Card de ingreso
   ============================================================ */

.tk-card[b-x6ltj50wl9] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.tk-card-header[b-x6ltj50wl9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
}

.tk-card-header i[b-x6ltj50wl9] { color: var(--rg-accent, #4f46e5); font-size: 1rem; }

.tk-form-body[b-x6ltj50wl9] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ============================================================
   Fila de campos
   ============================================================ */

.tk-fields-row[b-x6ltj50wl9] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-start;
}

.tk-field-group[b-x6ltj50wl9] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 200px;
    flex: 1;
}

.tk-field-summary[b-x6ltj50wl9] {
    flex: 0 0 auto;
    min-width: 130px;
    justify-content: flex-end;
}

.tk-label[b-x6ltj50wl9] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.tk-input[b-x6ltj50wl9] {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.tk-input:focus[b-x6ltj50wl9] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(79,70,229,0.12);
}

.tk-input-error[b-x6ltj50wl9] {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 3px rgba(239,68,68,0.12) !important;
}

.tk-field-error[b-x6ltj50wl9] {
    font-size: 0.68rem;
    color: #ef4444;
    font-weight: 500;
}

/* Resumen de cantidad */
.tk-summary-badge[b-x6ltj50wl9] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    padding: 0.5rem 0.85rem;
    background: rgba(79,70,229,0.1);
    border: 1px solid rgba(79,70,229,0.25);
    border-radius: 0.5rem;
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--rg-accent, #4f46e5);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

.tk-summary-badge span[b-x6ltj50wl9] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    font-family: inherit;
}

[data-mode="dark"] .tk-summary-badge[b-x6ltj50wl9] {
    background: rgba(99,102,241,0.18);
    border-color: rgba(99,102,241,0.35);
    color: #a5b4fc;
}

/* ============================================================
   Estado de validación
   ============================================================ */

.tk-validating[b-x6ltj50wl9] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.82rem;
    color: var(--rg-text-secondary, #475569);
}

.tk-spinner-inline[b-x6ltj50wl9] {
    width: 1.1rem;
    height: 1.1rem;
    border-width: 2px;
}

/* Status banners */
.tk-status[b-x6ltj50wl9] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    border-radius: 0.625rem;
    border: 1.5px solid;
}

.tk-status-ok[b-x6ltj50wl9] {
    background: rgba(16,185,129,0.08);
    border-color: rgba(16,185,129,0.3);
}

.tk-status-error[b-x6ltj50wl9] {
    background: rgba(239,68,68,0.08);
    border-color: rgba(239,68,68,0.3);
}

.tk-status-icon[b-x6ltj50wl9] {
    font-size: 1.3rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.tk-status-ok .tk-status-icon[b-x6ltj50wl9]    { color: #10b981; }
.tk-status-error .tk-status-icon[b-x6ltj50wl9] { color: #ef4444; }

.tk-status-body[b-x6ltj50wl9] {
    flex: 1;
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
    line-height: 1.5;
}

.tk-status-ok .tk-status-body[b-x6ltj50wl9]    { color: #065f46; }
.tk-status-error .tk-status-body[b-x6ltj50wl9] { color: #991b1b; }

[data-mode="dark"] .tk-status-ok[b-x6ltj50wl9]    { background: rgba(16,185,129,0.12); border-color: rgba(16,185,129,0.35); }
[data-mode="dark"] .tk-status-error[b-x6ltj50wl9] { background: rgba(239,68,68,0.12);  border-color: rgba(239,68,68,0.35);  }
[data-mode="dark"] .tk-status-ok .tk-status-body[b-x6ltj50wl9]    { color: #6ee7b7; }
[data-mode="dark"] .tk-status-error .tk-status-body[b-x6ltj50wl9] { color: #fca5a5; }

.tk-ticket-count[b-x6ltj50wl9] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0.5rem;
    background: rgba(16,185,129,0.15);
    border-radius: 1rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: #065f46;
    margin-left: 0.5rem;
}

[data-mode="dark"] .tk-ticket-count[b-x6ltj50wl9] { background: rgba(16,185,129,0.2); color: #6ee7b7; }

/* Botón guardar dentro del status-ok */
.tk-btn-guardar[b-x6ltj50wl9] {
    flex-shrink: 0;
    align-self: center;
    white-space: nowrap;
}

/* ============================================================
   Chips de números conflictivos
   ============================================================ */

.tk-chips-section[b-x6ltj50wl9] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.tk-chips-label[b-x6ltj50wl9] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.tk-chips-wrapper[b-x6ltj50wl9] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.tk-chip[b-x6ltj50wl9] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    border-radius: 0.375rem;
    background: rgba(239,68,68,0.1);
    border: 1px solid rgba(239,68,68,0.25);
    color: #b91c1c;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.tk-chip-more[b-x6ltj50wl9] {
    background: rgba(239,68,68,0.18);
    border-color: rgba(239,68,68,0.4);
    font-family: inherit;
    font-style: italic;
}

[data-mode="dark"] .tk-chip[b-x6ltj50wl9]      { background: rgba(239,68,68,0.15); border-color: rgba(239,68,68,0.35); color: #fca5a5; }
[data-mode="dark"] .tk-chip-more[b-x6ltj50wl9] { background: rgba(239,68,68,0.22); border-color: rgba(239,68,68,0.45); }

/* ============================================================
   Detalle de lotes conflictivos
   ============================================================ */

.tk-conflicto-detalle[b-x6ltj50wl9] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-top: 0.25rem;
}

.tk-conflicto-label[b-x6ltj50wl9] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.25rem;
}

.tk-conflicto-lote[b-x6ltj50wl9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.5rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border-light, #f1f5f9);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    flex-wrap: wrap;
}

.tk-conflicto-lote i[b-x6ltj50wl9] {
    color: #ef4444;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.tk-conflicto-count[b-x6ltj50wl9] {
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.72rem;
}

.tk-conflicto-fecha[b-x6ltj50wl9] {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
    font-weight: 600;
    white-space: nowrap;
}

[data-mode="dark"] .tk-conflicto-detalle[b-x6ltj50wl9] { background: var(--rg-bg-subtle, #1e293b); }
[data-mode="dark"] .tk-conflicto-lote[b-x6ltj50wl9]    { background: var(--rg-bg-card, #0f172a); border-color: var(--rg-border, #334155); }

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 768px) {
    .crud-container[b-x6ltj50wl9] { padding: 0.75rem; }
    .crud-title[b-x6ltj50wl9] { font-size: 1.1rem; }
    .tk-fields-row[b-x6ltj50wl9] { flex-direction: column; }
    .tk-field-group[b-x6ltj50wl9] { min-width: unset; flex: unset; width: 100%; }
    .tk-field-summary[b-x6ltj50wl9] { min-width: unset; width: 100%; }
    .tk-status[b-x6ltj50wl9] { flex-wrap: wrap; }
    .tk-btn-guardar[b-x6ltj50wl9] { width: 100%; justify-content: center; }
    .tk-conflicto-fecha[b-x6ltj50wl9] { margin-left: 0; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-x6ltj50wl9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x6ltj50wl9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x6ltj50wl9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x6ltj50wl9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminaemisionordenes.razor.rz.scp.css */
/* ============================================================
   Frmminaemisionordenes — Emisión de Órdenes Minería
   v2: condición coloreada, placa filtrable, chofer picker,
       botón emitir inferior, tarjetas con vida
   ============================================================ */

.crud-container[b-g9rg9yafop] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-g9rg9yafop 0.3s ease-out; }
@keyframes slideUp-b-g9rg9yafop { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ============ Header ============ */
.crud-header[b-g9rg9yafop] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-g9rg9yafop] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-g9rg9yafop] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-g9rg9yafop] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-g9rg9yafop] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-g9rg9yafop] { display: flex; gap: 0.5rem; }

/* ============ Buttons ============ */
.btn-crud[b-g9rg9yafop] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-g9rg9yafop] { opacity: 0.5; cursor: not-allowed; }
.btn-primary[b-g9rg9yafop] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-g9rg9yafop] { filter: brightness(1.12); }
.btn-outline[b-g9rg9yafop] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-g9rg9yafop] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-outline.active[b-g9rg9yafop] { background: var(--rg-accent, #4f46e5); color: #fff; border-color: var(--rg-accent, #4f46e5); }
.btn-sm[b-g9rg9yafop] { padding: 0.3rem 0.55rem; font-size: 0.72rem; }

/* ============ Alert ============ */
.crud-alert[b-g9rg9yafop] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-g9rg9yafop] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-g9rg9yafop] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-g9rg9yafop] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-g9rg9yafop] { background: rgba(16,185,129,0.12); color: #86efac; border-color: rgba(16,185,129,0.3); }
[data-mode="dark"] .crud-alert.error[b-g9rg9yafop] { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }

/* ============ Secciones ============ */
.em-grid[b-g9rg9yafop] { display: flex; flex-direction: column; gap: 0.85rem; }
.em-section[b-g9rg9yafop] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.85rem 1rem;
}
.em-section-title[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin-bottom: 0.7rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.em-section-title i[b-g9rg9yafop] { color: var(--rg-accent, #4f46e5); }
.em-view-toggle[b-g9rg9yafop] { margin-left: auto; display: flex; gap: 0.25rem; }

/* ============ Form ============ */
.form-row[b-g9rg9yafop] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; align-items: flex-end; }
.form-row:last-child[b-g9rg9yafop] { margin-bottom: 0; }
.form-group[b-g9rg9yafop] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-g9rg9yafop] { flex: 2; }
.form-group label[b-g9rg9yafop] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-g9rg9yafop], .form-group select[b-g9rg9yafop] {
    padding: 0.4rem 0.55rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s;
    height: 34px;
}
.form-group input:focus[b-g9rg9yafop], .form-group select:focus[b-g9rg9yafop] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(79,70,229,0.12);
}
.form-group input.readonly[b-g9rg9yafop], .form-group input[readonly][b-g9rg9yafop] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    cursor: default;
}

/* ============ Productos Grid ============ */
.em-productos-wrapper[b-g9rg9yafop] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    max-height: 340px;
}
.crud-table[b-g9rg9yafop] { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.crud-table thead[b-g9rg9yafop] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-g9rg9yafop] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    text-align: left;
    padding: 0.55rem 0.75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.crud-table td[b-g9rg9yafop] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
}
.crud-table tbody tr:hover[b-g9rg9yafop] { background: var(--rg-bg-hover, #f8fafc); }
.em-row-selected[b-g9rg9yafop] { background: rgba(79,70,229,0.08) !important; }
.em-row-selected td[b-g9rg9yafop] { font-weight: 600; }

/* ============================================================
   Punto 5: Tarjetas de productos con color, hover glass, sunken
   ============================================================ */
.em-productos-cards[b-g9rg9yafop] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0.65rem;
    max-height: 380px;
    overflow-y: auto;
    padding: 0.25rem;
}

/* Paleta de 10 colores (fondo sutil + borde + stripe) */
.em-product-card[b-g9rg9yafop] {
    position: relative;
    border-radius: 0.625rem;
    border: 1.5px solid transparent;
    padding: 0;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: var(--rg-bg-card, #fff);
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

/* Hover: translucent glass lift */
.em-product-card:hover[b-g9rg9yafop] {
    transform: translateY(-3px) scale(1.02);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    backdrop-filter: blur(4px);
}

/* Selected: sunken press effect */
.em-card-selected[b-g9rg9yafop] {
    transform: scale(0.97) !important;
    box-shadow: inset 0 3px 8px rgba(0,0,0,0.18), 0 1px 4px rgba(0,0,0,0.08) !important;
}

/* Stripe lateral (barra de color arriba) */
.em-card-stripe[b-g9rg9yafop] {
    height: 5px;
    width: 100%;
    flex-shrink: 0;
    border-radius: 0.625rem 0.625rem 0 0;
    transition: height 0.18s;
}
.em-product-card:hover .em-card-stripe[b-g9rg9yafop],
.em-card-selected .em-card-stripe[b-g9rg9yafop] { height: 7px; }

.em-card-body[b-g9rg9yafop] { padding: 0.6rem 0.75rem 0.65rem; display: flex; flex-direction: column; gap: 0.25rem; flex: 1; }
.em-card-id[b-g9rg9yafop] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.68rem; font-weight: 700; opacity: 0.6; }
.em-card-desc[b-g9rg9yafop] { font-size: 0.82rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); line-height: 1.3; }
.em-card-price[b-g9rg9yafop] { font-size: 1rem; font-weight: 800; margin-top: 0.15rem; }
.em-card-check[b-g9rg9yafop] {
    position: absolute; top: 0.4rem; right: 0.4rem;
    font-size: 1.1rem;
    animation: popIn-b-g9rg9yafop 0.2s ease-out;
}
@keyframes popIn-b-g9rg9yafop { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* 10 colores — fondo, borde, stripe, precio, id, check */
.em-card-color-0[b-g9rg9yafop] { background: rgba(99,102,241,0.06); border-color: rgba(99,102,241,0.3); }
.em-card-color-0 .em-card-stripe[b-g9rg9yafop] { background: #6366f1; }
.em-card-color-0 .em-card-price[b-g9rg9yafop] { color: #6366f1; }
.em-card-color-0 .em-card-check[b-g9rg9yafop] { color: #6366f1; }
.em-card-color-0.em-card-selected[b-g9rg9yafop] { border-color: #6366f1; background: rgba(99,102,241,0.12); }

.em-card-color-1[b-g9rg9yafop] { background: rgba(14,165,233,0.06); border-color: rgba(14,165,233,0.3); }
.em-card-color-1 .em-card-stripe[b-g9rg9yafop] { background: #0ea5e9; }
.em-card-color-1 .em-card-price[b-g9rg9yafop] { color: #0ea5e9; }
.em-card-color-1 .em-card-check[b-g9rg9yafop] { color: #0ea5e9; }
.em-card-color-1.em-card-selected[b-g9rg9yafop] { border-color: #0ea5e9; background: rgba(14,165,233,0.12); }

.em-card-color-2[b-g9rg9yafop] { background: rgba(16,185,129,0.06); border-color: rgba(16,185,129,0.3); }
.em-card-color-2 .em-card-stripe[b-g9rg9yafop] { background: #10b981; }
.em-card-color-2 .em-card-price[b-g9rg9yafop] { color: #10b981; }
.em-card-color-2 .em-card-check[b-g9rg9yafop] { color: #10b981; }
.em-card-color-2.em-card-selected[b-g9rg9yafop] { border-color: #10b981; background: rgba(16,185,129,0.12); }

.em-card-color-3[b-g9rg9yafop] { background: rgba(245,158,11,0.06); border-color: rgba(245,158,11,0.3); }
.em-card-color-3 .em-card-stripe[b-g9rg9yafop] { background: #f59e0b; }
.em-card-color-3 .em-card-price[b-g9rg9yafop] { color: #d97706; }
.em-card-color-3 .em-card-check[b-g9rg9yafop] { color: #f59e0b; }
.em-card-color-3.em-card-selected[b-g9rg9yafop] { border-color: #f59e0b; background: rgba(245,158,11,0.12); }

.em-card-color-4[b-g9rg9yafop] { background: rgba(239,68,68,0.06); border-color: rgba(239,68,68,0.3); }
.em-card-color-4 .em-card-stripe[b-g9rg9yafop] { background: #ef4444; }
.em-card-color-4 .em-card-price[b-g9rg9yafop] { color: #ef4444; }
.em-card-color-4 .em-card-check[b-g9rg9yafop] { color: #ef4444; }
.em-card-color-4.em-card-selected[b-g9rg9yafop] { border-color: #ef4444; background: rgba(239,68,68,0.12); }

.em-card-color-5[b-g9rg9yafop] { background: rgba(139,92,246,0.06); border-color: rgba(139,92,246,0.3); }
.em-card-color-5 .em-card-stripe[b-g9rg9yafop] { background: #8b5cf6; }
.em-card-color-5 .em-card-price[b-g9rg9yafop] { color: #8b5cf6; }
.em-card-color-5 .em-card-check[b-g9rg9yafop] { color: #8b5cf6; }
.em-card-color-5.em-card-selected[b-g9rg9yafop] { border-color: #8b5cf6; background: rgba(139,92,246,0.12); }

.em-card-color-6[b-g9rg9yafop] { background: rgba(236,72,153,0.06); border-color: rgba(236,72,153,0.3); }
.em-card-color-6 .em-card-stripe[b-g9rg9yafop] { background: #ec4899; }
.em-card-color-6 .em-card-price[b-g9rg9yafop] { color: #ec4899; }
.em-card-color-6 .em-card-check[b-g9rg9yafop] { color: #ec4899; }
.em-card-color-6.em-card-selected[b-g9rg9yafop] { border-color: #ec4899; background: rgba(236,72,153,0.12); }

.em-card-color-7[b-g9rg9yafop] { background: rgba(20,184,166,0.06); border-color: rgba(20,184,166,0.3); }
.em-card-color-7 .em-card-stripe[b-g9rg9yafop] { background: #14b8a6; }
.em-card-color-7 .em-card-price[b-g9rg9yafop] { color: #14b8a6; }
.em-card-color-7 .em-card-check[b-g9rg9yafop] { color: #14b8a6; }
.em-card-color-7.em-card-selected[b-g9rg9yafop] { border-color: #14b8a6; background: rgba(20,184,166,0.12); }

.em-card-color-8[b-g9rg9yafop] { background: rgba(249,115,22,0.06); border-color: rgba(249,115,22,0.3); }
.em-card-color-8 .em-card-stripe[b-g9rg9yafop] { background: #f97316; }
.em-card-color-8 .em-card-price[b-g9rg9yafop] { color: #f97316; }
.em-card-color-8 .em-card-check[b-g9rg9yafop] { color: #f97316; }
.em-card-color-8.em-card-selected[b-g9rg9yafop] { border-color: #f97316; background: rgba(249,115,22,0.12); }

.em-card-color-9[b-g9rg9yafop] { background: rgba(132,204,22,0.06); border-color: rgba(132,204,22,0.3); }
.em-card-color-9 .em-card-stripe[b-g9rg9yafop] { background: #84cc16; }
.em-card-color-9 .em-card-price[b-g9rg9yafop] { color: #65a30d; }
.em-card-color-9 .em-card-check[b-g9rg9yafop] { color: #84cc16; }
.em-card-color-9.em-card-selected[b-g9rg9yafop] { border-color: #84cc16; background: rgba(132,204,22,0.12); }

/* ============================================================
   Punto 1: Footer bar — Condición prominente + Emitir inferior
   ============================================================ */
.em-footer-bar[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.85rem 1.25rem;
    flex-wrap: wrap;
}

.em-condicion-group[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.em-condicion-label[b-g9rg9yafop] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

/* Botones toggle de condición */
.em-cond-btn[b-g9rg9yafop] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 1.25rem;
    border-radius: 2rem;
    border: 2px solid transparent;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.18s ease;
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #64748b);
    letter-spacing: 0.02em;
}
.em-cond-btn:hover[b-g9rg9yafop] { filter: brightness(0.95); }

/* Contado — verde */
.em-cond-contado[b-g9rg9yafop] { border-color: rgba(16,185,129,0.3); }
.em-cond-contado.em-cond-active[b-g9rg9yafop] {
    background: #10b981;
    color: #fff;
    border-color: #10b981;
    box-shadow: 0 4px 14px rgba(16,185,129,0.35);
}
.em-cond-contado:not(.em-cond-active):hover[b-g9rg9yafop] { border-color: #10b981; color: #10b981; background: rgba(16,185,129,0.08); }

/* Crédito — azul */
.em-cond-credito[b-g9rg9yafop] { border-color: rgba(14,165,233,0.3); }
.em-cond-credito.em-cond-active[b-g9rg9yafop] {
    background: #0ea5e9;
    color: #fff;
    border-color: #0ea5e9;
    box-shadow: 0 4px 14px rgba(14,165,233,0.35);
}
.em-cond-credito:not(.em-cond-active):hover[b-g9rg9yafop] { border-color: #0ea5e9; color: #0ea5e9; background: rgba(14,165,233,0.08); }

/* Crédito bloqueado — cliente no autorizado */
.em-cond-locked[b-g9rg9yafop] {
    opacity: 0.45;
    cursor: not-allowed !important;
    border-color: var(--rg-border, #e2e8f0);
    color: var(--rg-text-muted, #94a3b8);
    background: var(--rg-bg-subtle, #f8fafc);
}
.em-cond-locked:hover[b-g9rg9yafop] { filter: none; }

/* Botón emitir en footer — más grande */
.em-btn-emitir-footer[b-g9rg9yafop] {
    padding: 0.65rem 1.75rem;
    font-size: 0.9rem;
    border-radius: 2rem;
    box-shadow: 0 4px 14px rgba(79,70,229,0.3);
    letter-spacing: 0.02em;
}
.em-btn-emitir-footer:hover:not(:disabled)[b-g9rg9yafop] {
    box-shadow: 0 6px 20px rgba(79,70,229,0.45);
    transform: translateY(-1px);
}

/* ============ Cupón badge ============ */
.em-cupon-badge[b-g9rg9yafop] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.6rem;
    border-radius: 0.375rem;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}
.em-cupon-ok[b-g9rg9yafop] { background: rgba(34,197,94,0.15); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.em-cupon-bad[b-g9rg9yafop] { background: rgba(239,68,68,0.12); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .em-cupon-ok[b-g9rg9yafop] { color: #86efac; }
[data-mode="dark"] .em-cupon-bad[b-g9rg9yafop] { color: #fca5a5; }

/* ============ Search bar ============ */
.crud-search-bar[b-g9rg9yafop] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-input, #fff); }
.crud-search-bar i[b-g9rg9yafop] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-g9rg9yafop] { flex: 1; border: none; outline: none; font-size: 0.82rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-g9rg9yafop] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }

/* ============ Loading ============ */
.crud-spinner-sm[b-g9rg9yafop] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(79,70,229,0.25); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-g9rg9yafop 0.6s linear infinite; }
.crud-spinner-sm.white[b-g9rg9yafop] { border-color: rgba(255,255,255,0.3); border-top-color: #fff; }
@keyframes spin-b-g9rg9yafop { to { transform: rotate(360deg); } }

/* ============ Indicador de contacto en el form principal ============ */
.em-contacto-preview[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.4rem;
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}
.em-contacto-empty[b-g9rg9yafop] { font-style: italic; }
.em-contacto-tag[b-g9rg9yafop] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.55rem;
    border-radius: 2rem;
    font-size: 0.72rem;
    font-weight: 600;
    border: 1px solid transparent;
}
.em-tag-wa[b-g9rg9yafop] {
    background: rgba(37,211,102,0.12);
    color: #166534;
    border-color: rgba(37,211,102,0.3);
}
[data-mode="dark"] .em-tag-wa[b-g9rg9yafop] { color: #86efac; }
.em-tag-email[b-g9rg9yafop] {
    background: rgba(79,70,229,0.1);
    color: var(--rg-accent, #4f46e5);
    border-color: rgba(79,70,229,0.25);
}

/* ============ Modal de confirmación de emisión ============ */
.emit-cliente-info[b-g9rg9yafop] {
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem 0.85rem;
    margin-bottom: 0.85rem;
}
.emit-cliente-header[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
    font-size: 0.85rem;
}
.emit-cliente-header > i[b-g9rg9yafop] { font-size: 1.25rem; color: var(--rg-accent, #4f46e5); }
.emit-cliente-header > div[b-g9rg9yafop] { display: flex; flex-direction: column; }
.emit-cliente-nombre[b-g9rg9yafop] { font-weight: 700; color: var(--rg-text-primary, #1e293b); font-size: 0.88rem; }
.emit-cliente-id[b-g9rg9yafop]     { color: var(--rg-text-muted, #94a3b8); font-size: 0.72rem; }
.emit-contacto-loading[b-g9rg9yafop] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; color: var(--rg-text-muted); }

.emit-summary[b-g9rg9yafop] {
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem 0.85rem;
}
.emit-summary-title[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-secondary, #475569);
    margin-bottom: 0.6rem;
}
.emit-summary-row[b-g9rg9yafop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8rem;
    padding: 0.2rem 0;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.emit-summary-row .text-muted[b-g9rg9yafop] { color: var(--rg-text-muted, #94a3b8); font-size: 0.72rem; }
.emit-summary-total[b-g9rg9yafop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
    font-size: 0.88rem;
    color: var(--rg-text-secondary, #475569);
}
.emit-summary-total strong[b-g9rg9yafop] {
    font-size: 1rem;
    font-weight: 800;
    color: var(--rg-accent, #4f46e5);
    font-family: 'Cascadia Code','Fira Code',monospace;
}

/* ============ Campos de contacto requeridos ============ */
/* Asterisco rojo en el label cuando ningún canal está lleno */
.em-required-hint[b-g9rg9yafop] {
    color: var(--rg-danger, #ef4444);
    font-weight: 700;
}

/* Borde rojo en el input cuando ambos están vacíos */
.form-group input.em-input-required[b-g9rg9yafop] {
    border-color: rgba(239, 68, 68, 0.6);
    background: rgba(239, 68, 68, 0.04);
}
.form-group input.em-input-required:focus[b-g9rg9yafop] {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12);
}

/* Mensaje informativo debajo de los campos */
.em-contact-hint[b-g9rg9yafop] {
    margin: 0.3rem 0 0;
    font-size: 0.72rem;
    color: var(--rg-danger, #ef4444);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
[data-mode="dark"] .form-group input.em-input-required[b-g9rg9yafop] {
    border-color: rgba(239, 68, 68, 0.7);
    background: rgba(239, 68, 68, 0.08);
}

/* ============ Utilities ============ */
.font-mono[b-g9rg9yafop] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.78rem; }
.text-center[b-g9rg9yafop] { text-align: center; }
.text-right[b-g9rg9yafop] { text-align: right; }
.text-muted[b-g9rg9yafop] { color: var(--rg-text-muted, #94a3b8); }

/* ============ Modal ============ */
.modal-backdrop[b-g9rg9yafop] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(3px); z-index: 1000; animation: fadeIn-b-g9rg9yafop 0.15s ease-out; }
.modal-container[b-g9rg9yafop] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-g9rg9yafop] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 720px; max-height: 85vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-g9rg9yafop 0.2s ease-out; border: 1px solid var(--rg-border, #e2e8f0); }
.modal-sm[b-g9rg9yafop] { max-width: 440px; }
@keyframes fadeIn-b-g9rg9yafop { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-g9rg9yafop { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-g9rg9yafop] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-g9rg9yafop] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-g9rg9yafop] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-g9rg9yafop] { color: #dc2626; }
.modal-close[b-g9rg9yafop] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-g9rg9yafop] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-g9rg9yafop] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-g9rg9yafop] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

.em-picker-grid[b-g9rg9yafop] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; max-height: 420px; }

/* ============================================================
   Modal preview grande (comprobante)
   ============================================================ */
.modal-preview[b-g9rg9yafop] {
    max-width: 680px;
    width: calc(100% - 2rem);
    max-height: 90vh;
}

/* ============================================================
   Comprobante / Orden Preview
   ============================================================ */
.orden-preview[b-g9rg9yafop] {
    font-family: 'Segoe UI', system-ui, sans-serif;
    color: #1e293b;
    font-size: 0.82rem;
    background: #fff;
    padding: 1rem 0;
}

/* Encabezado empresa */
.op-header[b-g9rg9yafop] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.75rem;
}
.op-empresa-nombre[b-g9rg9yafop] {
    font-size: 1.1rem;
    font-weight: 800;
    color: #1e293b;
    margin-bottom: 0.25rem;
}
.op-empresa-dato[b-g9rg9yafop] {
    font-size: 0.75rem;
    color: #475569;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-bottom: 0.1rem;
}
.op-orden-box[b-g9rg9yafop] {
    text-align: right;
    flex-shrink: 0;
}
.op-orden-label[b-g9rg9yafop] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.op-orden-num[b-g9rg9yafop] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 2rem;
    font-weight: 900;
    color: #4f46e5;
    letter-spacing: 0.15em;
    line-height: 1.1;
}
.op-orden-fecha[b-g9rg9yafop] {
    font-size: 0.72rem;
    color: #64748b;
    margin-top: 0.15rem;
}

/* Divisor */
.op-divider[b-g9rg9yafop] {
    border: none;
    border-top: 2px solid #e2e8f0;
    margin: 0.75rem 0;
}

/* Secciones */
.op-section-title[b-g9rg9yafop] {
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #4f46e5;
    margin: 0.65rem 0 0.35rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e0e7ff;
}

/* Filas de campos */
.op-row-2[b-g9rg9yafop], .op-row-3[b-g9rg9yafop], .op-row-4[b-g9rg9yafop] {
    display: grid;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}
.op-row-2[b-g9rg9yafop] { grid-template-columns: repeat(2, 1fr); }
.op-row-3[b-g9rg9yafop] { grid-template-columns: repeat(3, 1fr); }
.op-row-4[b-g9rg9yafop] { grid-template-columns: repeat(4, 1fr); }

.op-field[b-g9rg9yafop] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.375rem;
    padding: 0.35rem 0.5rem;
}
.op-label[b-g9rg9yafop] {
    font-size: 0.6rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.op-value[b-g9rg9yafop] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
}

/* Totales */
.op-totales[b-g9rg9yafop] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 1rem;
}
.op-totales-row[b-g9rg9yafop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.82rem;
    color: #475569;
}
.op-totales-row:last-child[b-g9rg9yafop] { border-bottom: none; }
.op-total-final[b-g9rg9yafop] {
    background: #4f46e5;
    color: #fff !important;
    font-weight: 800;
    font-size: 1rem;
    padding: 0.6rem 0.75rem;
}
.op-total-final span[b-g9rg9yafop] { color: #fff !important; }

/* Firmas */
.op-firmas[b-g9rg9yafop] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}
.op-firma-box[b-g9rg9yafop] { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
.op-firma-line[b-g9rg9yafop] { width: 100%; border-top: 1.5px solid #cbd5e1; }
.op-firma-label[b-g9rg9yafop] { font-size: 0.7rem; color: #64748b; font-weight: 600; }

/* Footer */
.op-footer-text[b-g9rg9yafop] {
    text-align: center;
    font-size: 0.65rem;
    color: #94a3b8;
    margin-top: 0.5rem;
}

/* ============ PDF Viewer ============ */
.modal-pdf[b-g9rg9yafop] {
    max-width: 920px;
    width: calc(100% - 2rem);
    max-height: 92vh;
    display: flex;
    flex-direction: column;
}

.em-pdf-body[b-g9rg9yafop] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    padding: 0.5rem;
}

.em-pdf-iframe[b-g9rg9yafop] {
    flex: 1;
    width: 100%;
    min-height: 580px;
    border: none;
    border-radius: 6px;
    background: var(--rg-bg-subtle, #f8fafc);
}

.em-pdf-loading[b-g9rg9yafop] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: var(--rg-text-secondary, #475569);
    font-size: 0.875rem;
}

/* ============ Responsive ============ */
@media (max-width: 768px) {
    .crud-container[b-g9rg9yafop] { padding: 0.75rem; }
    .crud-header[b-g9rg9yafop] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-g9rg9yafop] { display: none; }
    .form-row[b-g9rg9yafop] { flex-direction: column; align-items: stretch; }
    .form-group[b-g9rg9yafop] { flex: 1 1 auto !important; }
    .em-productos-cards[b-g9rg9yafop] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-g9rg9yafop] { width: 98%; max-height: 92vh; }
    .em-footer-bar[b-g9rg9yafop] { flex-direction: column; align-items: stretch; }
    .em-btn-emitir-footer[b-g9rg9yafop] { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
    .em-productos-cards[b-g9rg9yafop] { grid-template-columns: 1fr; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-g9rg9yafop] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-g9rg9yafop] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-g9rg9yafop] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-g9rg9yafop] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/FrmminaFacturacionOrdenes.razor.rz.scp.css */
/* ============================================================
   Mina — Facturación de Órdenes
   Estilos CRUD + dos paneles + selección
   ============================================================ */

.crud-container[b-5s4e7g8txl] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-5s4e7g8txl 0.3s ease-out; }
@keyframes slideUp-b-5s4e7g8txl { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-5s4e7g8txl] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-5s4e7g8txl] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-5s4e7g8txl] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-5s4e7g8txl] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-5s4e7g8txl] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-5s4e7g8txl] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-5s4e7g8txl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-5s4e7g8txl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-5s4e7g8txl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-5s4e7g8txl] { filter: brightness(1.1); }
.btn-outline[b-5s4e7g8txl] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-5s4e7g8txl] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-5s4e7g8txl] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-5s4e7g8txl] { filter: brightness(1.1); }
.btn-icon[b-5s4e7g8txl] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-5s4e7g8txl] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-5s4e7g8txl] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-5s4e7g8txl] { color: #ef4444; }
.btn-delete:hover[b-5s4e7g8txl] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-5s4e7g8txl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-5s4e7g8txl] { background: rgba(34,197,94,0.12); color: #065f46; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-5s4e7g8txl]   { background: rgba(239,68,68,0.1);  color: #991b1b; border: 1px solid rgba(239,68,68,0.25); }
[data-mode="dark"] .crud-alert.success[b-5s4e7g8txl] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-5s4e7g8txl]   { color: #fca5a5; }
.crud-alert-close[b-5s4e7g8txl] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-5s4e7g8txl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-5s4e7g8txl] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-5s4e7g8txl] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-5s4e7g8txl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-5s4e7g8txl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-5s4e7g8txl] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-5s4e7g8txl] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-5s4e7g8txl] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-5s4e7g8txl] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table th.text-right[b-5s4e7g8txl] { text-align: right; }
.crud-table td[b-5s4e7g8txl] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-5s4e7g8txl] { background: var(--rg-bg-hover, #f8fafc); }

/* Loading / Empty */
.crud-loading[b-5s4e7g8txl], .crud-empty-state[b-5s4e7g8txl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-5s4e7g8txl] { font-size: 2rem; }
.crud-spinner[b-5s4e7g8txl] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-5s4e7g8txl 0.6s linear infinite; }
.crud-spinner-sm[b-5s4e7g8txl] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-5s4e7g8txl 0.6s linear infinite; }
@keyframes spin-b-5s4e7g8txl { to { transform: rotate(360deg); } }
.spin[b-5s4e7g8txl] { animation: spin-b-5s4e7g8txl 0.8s linear infinite; }

/* Utilities */
.font-mono[b-5s4e7g8txl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-right[b-5s4e7g8txl] { text-align: right; }
.text-center[b-5s4e7g8txl] { text-align: center; }
.text-muted[b-5s4e7g8txl] { color: var(--rg-text-muted, #94a3b8); font-size: 0.75rem; }
.ms-1[b-5s4e7g8txl] { margin-left: 0.25rem; }

/* Badges */
.badge[b-5s4e7g8txl] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-5s4e7g8txl] { background: rgba(34,197,94,0.15); color: #065f46; }
.badge-no[b-5s4e7g8txl]  { background: var(--rg-bg-subtle, #f1f5f9); color: #64748b; }
[data-mode="dark"] .badge-yes[b-5s4e7g8txl] { color: #86efac; }

/* Modal */
.modal-backdrop[b-5s4e7g8txl] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-5s4e7g8txl 0.15s ease-out; }
.modal-container[b-5s4e7g8txl] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-5s4e7g8txl] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-5s4e7g8txl 0.2s ease-out; }
.modal-sm[b-5s4e7g8txl] { max-width: 480px; }
@keyframes fadeIn-b-5s4e7g8txl { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-5s4e7g8txl { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
.modal-header[b-5s4e7g8txl] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-5s4e7g8txl] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-5s4e7g8txl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-5s4e7g8txl] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-5s4e7g8txl] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-5s4e7g8txl] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-5s4e7g8txl] { display: flex; gap: 0.6rem; margin-bottom: 0.75rem; }
.form-group[b-5s4e7g8txl] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-5s4e7g8txl] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-5s4e7g8txl], .form-group select[b-5s4e7g8txl] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-5s4e7g8txl], .form-group select:focus[b-5s4e7g8txl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }

/* ============================================================
   Layout principal — dos paneles
   ============================================================ */
.factura-layout[b-5s4e7g8txl] {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 1rem;
    align-items: start;
}

.factura-list-panel[b-5s4e7g8txl] {
    min-width: 0; /* evita overflow en grid */
}

/* Grid con altura fija para scroll interno */
.factura-grid[b-5s4e7g8txl] {
    max-height: calc(100vh - 260px) !important;
}

/* ============================================================
   Filas especiales de la tabla
   ============================================================ */

/* Cabecera de grupo (cliente) */
.group-header-row td[b-5s4e7g8txl] {
    background: var(--rg-bg-subtle, #f0f4ff);
    color: var(--rg-text-secondary, #475569);
    font-size: 0.76rem;
    padding: 0.35rem 0.75rem;
    border-top: 2px solid var(--rg-border, #e2e8f0);
    user-select: none;
}

[data-mode="dark"] .group-header-row td[b-5s4e7g8txl] {
    background: rgba(79, 70, 229, 0.08);
    border-top-color: rgba(79, 70, 229, 0.2);
}

.group-header-row td i[b-5s4e7g8txl] {
    color: var(--rg-accent, #4f46e5);
    margin-right: 0.35rem;
}

.group-count[b-5s4e7g8txl] {
    margin-left: 0.5rem;
    font-size: 0.68rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    padding: 0 0.4rem;
    border-radius: 1rem;
    color: var(--rg-text-muted, #94a3b8);
}

/* Badge condición de pago (crédito / contado) */
.credito-badge[b-5s4e7g8txl] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.66rem;
    font-weight: 600;
    margin-left: 0.5rem;
    vertical-align: middle;
}

.credito-badge-ok[b-5s4e7g8txl] {
    background: rgba(34, 197, 94, 0.15);
    color: #166534;
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.credito-badge-no[b-5s4e7g8txl] {
    background: rgba(148, 163, 184, 0.15);
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}

[data-mode="dark"] .credito-badge-ok[b-5s4e7g8txl]  { color: #86efac; }
[data-mode="dark"] .credito-badge-no[b-5s4e7g8txl]  { color: var(--rg-text-muted, #94a3b8); }

/* Fila seleccionada */
.row-selected td[b-5s4e7g8txl] {
    background: rgba(79, 70, 229, 0.07) !important;
    border-left: 3px solid var(--rg-accent, #4f46e5);
}

[data-mode="dark"] .row-selected td[b-5s4e7g8txl] {
    background: rgba(99, 102, 241, 0.15) !important;
}

/* Fila deshabilitada (otro cliente seleccionado) */
.row-disabled td[b-5s4e7g8txl] {
    opacity: 0.4;
}

.row-disabled:hover td[b-5s4e7g8txl] {
    background: transparent !important;
}

/* Columna Total — destacada con leve énfasis */
.col-total[b-5s4e7g8txl] {
    font-weight: 600;
    color: var(--rg-accent, #4f46e5);
}

[data-mode="dark"] .col-total[b-5s4e7g8txl] {
    color: #818cf8;
}

/* Checkbox */
.factura-check[b-5s4e7g8txl] {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--rg-accent, #4f46e5);
    cursor: pointer;
}

/* ============================================================
   Panel derecho — selección
   ============================================================ */
.factura-selection-panel[b-5s4e7g8txl] {
    position: sticky;
    top: 1rem;
}

.selection-panel-inner[b-5s4e7g8txl] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.selection-title[b-5s4e7g8txl] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.selection-title i[b-5s4e7g8txl] {
    color: var(--rg-accent, #4f46e5);
}

.selection-empty[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 1.5rem 0.5rem;
    color: var(--rg-text-muted, #94a3b8);
    text-align: center;
}

.selection-empty i[b-5s4e7g8txl] {
    font-size: 2rem;
    opacity: 0.5;
}

.selection-empty span[b-5s4e7g8txl] {
    font-size: 0.78rem;
}

.selection-empty small[b-5s4e7g8txl] {
    font-size: 0.68rem;
    opacity: 0.75;
}

.selection-cliente[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.5rem 0.75rem;
    background: rgba(79, 70, 229, 0.06);
    border-radius: 0.4rem;
    border-left: 3px solid var(--rg-accent, #4f46e5);
}

.selection-label[b-5s4e7g8txl] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.selection-cliente strong[b-5s4e7g8txl] {
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
}

.selection-divider[b-5s4e7g8txl] {
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

.selection-orders[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    max-height: 200px;
    overflow-y: auto;
}

.selection-order-row[b-5s4e7g8txl] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    padding: 0.2rem 0;
}

.selection-amount[b-5s4e7g8txl] {
    margin-left: auto;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.73rem;
    color: var(--rg-text-secondary, #475569);
}

.selection-remove[b-5s4e7g8txl] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    padding: 0 0.2rem;
    border-radius: 0.25rem;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.selection-remove:hover[b-5s4e7g8txl] {
    color: #ef4444;
    background: rgba(239, 68, 68, 0.1);
}

.selection-total[b-5s4e7g8txl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
}

.selection-total strong[b-5s4e7g8txl] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 1rem;
    color: var(--rg-accent, #4f46e5);
}

.selection-count[b-5s4e7g8txl] {
    font-size: 0.68rem;
    color: var(--rg-text-muted, #94a3b8);
    text-align: center;
}

.selection-emit-btn[b-5s4e7g8txl] {
    width: 100%;
    justify-content: center;
}

.selection-clear-btn[b-5s4e7g8txl] {
    width: 100%;
    justify-content: center;
    font-size: 0.75rem;
    padding: 0.35rem;
}

/* ============================================================
   Modal de emisión — resumen de órdenes
   ============================================================ */
.emit-summary[b-5s4e7g8txl] {
    margin-top: 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: hidden;
}

.emit-summary-title[b-5s4e7g8txl] {
    background: var(--rg-bg-subtle, #f8fafc);
    padding: 0.5rem 0.75rem;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

.emit-summary-orders[b-5s4e7g8txl] {
    padding: 0.25rem 0;
    max-height: 200px;
    overflow-y: auto;
}

.emit-summary-row[b-5s4e7g8txl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.3rem 0.75rem;
    font-size: 0.75rem;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}

.emit-summary-row:last-child[b-5s4e7g8txl] {
    border-bottom: none;
}

.emit-summary-row .font-mono:last-of-type[b-5s4e7g8txl] {
    margin-left: auto;
}

.emit-summary-total[b-5s4e7g8txl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-top: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}

.emit-summary-total strong[b-5s4e7g8txl] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    color: var(--rg-accent, #4f46e5);
}

/* Sección de contacto del cliente en modal de emisión */
.emit-cliente-info[b-5s4e7g8txl] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 8px;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
}

.emit-cliente-header[b-5s4e7g8txl] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

.emit-cliente-header > .bi[b-5s4e7g8txl] {
    font-size: 1.4rem;
    color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
}

.emit-cliente-header > div[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.emit-cliente-nombre[b-5s4e7g8txl] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rg-text-primary, #1e293b);
}

.emit-cliente-id[b-5s4e7g8txl] {
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
}

.emit-contacto-loading[b-5s4e7g8txl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
    padding: 0.25rem 0;
}

[data-mode="dark"] .emit-cliente-info[b-5s4e7g8txl] {
    background: var(--rg-bg-card, #1e293b);
}

/* ============================================================
   FAB móvil — siempre oculto en desktop
   ============================================================ */
.mobile-fab[b-5s4e7g8txl] {
    display: none; /* visible solo en móvil via @media */
}

/* ============================================================
   Responsive
   ============================================================ */
/* col-hide-mobile: siempre visible en desktop */
.col-hide-mobile[b-5s4e7g8txl] { }

@media (max-width: 900px) {
    /* En móvil, ocultar el panel lateral fijo */
    .factura-selection-panel[b-5s4e7g8txl] {
        display: none;
    }

    /* Ocultar columnas Fecha y Precio en móvil */
    .col-hide-mobile[b-5s4e7g8txl] {
        display: none;
    }

    .factura-layout[b-5s4e7g8txl] {
        grid-template-columns: 1fr;
    }

    .factura-grid[b-5s4e7g8txl] {
        max-height: 55vh !important;
    }

    /* FAB visible */
    .mobile-fab[b-5s4e7g8txl] {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        bottom: 1.25rem;
        right: 1.25rem;
        width: 3.25rem;
        height: 3.25rem;
        border-radius: 50%;
        border: none;
        cursor: pointer;
        font-size: 1.35rem;
        background: var(--rg-text-secondary, #475569);
        color: #fff;
        box-shadow: 0 4px 16px rgba(0,0,0,0.25);
        transition: background 0.2s, transform 0.15s;
        z-index: 900;
        position: fixed;
    }

    .mobile-fab.fab-has-items[b-5s4e7g8txl] {
        background: var(--rg-accent, #4f46e5);
        animation: fabPulse-b-5s4e7g8txl 2.5s infinite;
    }

    .mobile-fab:hover[b-5s4e7g8txl] {
        transform: scale(1.08);
    }

    @keyframes fabPulse-b-5s4e7g8txl {
        0%, 100% { box-shadow: 0 4px 16px rgba(79,70,229,0.35); }
        50%       { box-shadow: 0 4px 24px rgba(79,70,229,0.65); }
    }

    /* Badge de conteo sobre el FAB */
    .fab-badge[b-5s4e7g8txl] {
        position: absolute;
        top: -4px;
        right: -4px;
        min-width: 1.3rem;
        height: 1.3rem;
        border-radius: 999px;
        background: #ef4444;
        color: #fff;
        font-size: 0.65rem;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 0.25rem;
        line-height: 1;
    }

    /* Backdrop del panel móvil */
    .mobile-panel-backdrop[b-5s4e7g8txl] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.45);
        z-index: 1000;
        animation: fadeInBackdrop-b-5s4e7g8txl 0.2s ease-out;
    }

    @keyframes fadeInBackdrop-b-5s4e7g8txl {
        from { opacity: 0; }
        to   { opacity: 1; }
    }

    /* Sheet deslizante desde abajo */
    .mobile-panel-sheet[b-5s4e7g8txl] {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: var(--rg-bg-card, #fff);
        border-radius: 16px 16px 0 0;
        padding: 0 1rem 1.5rem;
        z-index: 1001;
        max-height: 80vh;
        overflow-y: auto;
        box-shadow: 0 -4px 24px rgba(0,0,0,0.18);
        animation: slideUpSheet-b-5s4e7g8txl 0.25s cubic-bezier(0.34,1.2,0.64,1);
    }

    @keyframes slideUpSheet-b-5s4e7g8txl {
        from { transform: translateY(100%); opacity: 0.6; }
        to   { transform: translateY(0);    opacity: 1;   }
    }

    .mobile-panel-handle[b-5s4e7g8txl] {
        width: 3rem;
        height: 4px;
        border-radius: 2px;
        background: var(--rg-border, #e2e8f0);
        margin: 0.75rem auto 0.25rem;
    }

    .mobile-panel-header[b-5s4e7g8txl] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.5rem 0 0.75rem;
        font-weight: 700;
        font-size: 0.95rem;
        color: var(--rg-text-primary, #1e293b);
        border-bottom: 1px solid var(--rg-border, #e2e8f0);
        margin-bottom: 0.75rem;
    }

    .mobile-panel-header .bi-cart-check-fill[b-5s4e7g8txl] {
        color: var(--rg-accent, #4f46e5);
        margin-right: 0.4rem;
    }

    .mobile-panel-actions[b-5s4e7g8txl] {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        margin-top: 0.75rem;
    }

    .mobile-panel-actions .selection-emit-btn[b-5s4e7g8txl],
    .mobile-panel-actions .selection-clear-btn[b-5s4e7g8txl] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 600px) {
    .crud-container[b-5s4e7g8txl] { padding: 0.75rem; }
    .crud-header[b-5s4e7g8txl] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-5s4e7g8txl] { font-size: 1.1rem; }
    .modal-dialog[b-5s4e7g8txl] { width: 98%; max-height: 95vh; }
    .modal-body[b-5s4e7g8txl] { padding: 0.75rem; }
}

/* ============================================================
   Vista Previa de Factura (fp-*)
   ============================================================ */

.factura-preview-dialog[b-5s4e7g8txl] { max-width: 860px; }
.factura-preview-body[b-5s4e7g8txl]   { padding: 1.5rem; overflow-y: auto; background: var(--rg-bg-page); }

/* Documento impreso */
.fp-doc[b-5s4e7g8txl] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 1.5rem;
    font-size: 0.875rem;
    color: var(--rg-text-primary);
    max-width: 780px;
    margin: 0 auto;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

/* Header del documento */
.fp-header[b-5s4e7g8txl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
    gap: 1rem;
}

.fp-header-empresa[b-5s4e7g8txl] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex: 2;
}

.fp-empresa-logo[b-5s4e7g8txl] {
    width: 52px; height: 52px;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
    color: var(--rg-primary);
    flex-shrink: 0;
}

.fp-empresa-info[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fp-empresa-nombre[b-5s4e7g8txl] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--rg-primary);
}

.fp-empresa-info span[b-5s4e7g8txl] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
}

.fp-header-ncf[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex: 1;
    text-align: right;
}

.fp-ncf-tipo[b-5s4e7g8txl] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
}

.fp-ncf-numero[b-5s4e7g8txl] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-primary);
}

.fp-ncf-vence[b-5s4e7g8txl] {
    font-size: 0.72rem;
    color: var(--rg-text-muted);
}

/* Sección cliente */
.fp-cliente[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1.25rem;
    padding: 0 0.25rem;
}

.fp-cliente-field[b-5s4e7g8txl] {
    display: flex;
    gap: 0.5rem;
    align-items: baseline;
    font-size: 0.875rem;
}

.fp-campo-label[b-5s4e7g8txl] {
    font-weight: 700;
    color: var(--rg-text-primary);
    min-width: 130px;
}

.fp-campo-valor[b-5s4e7g8txl] {
    color: var(--rg-text-primary);
}

/* Tabla de líneas */
.fp-tabla[b-5s4e7g8txl] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.25rem;
    font-size: 0.82rem;
}

.fp-tabla thead tr[b-5s4e7g8txl] {
    background: var(--rg-primary);
}

.fp-tabla thead th[b-5s4e7g8txl] {
    padding: 7px 10px;
    color: #fff;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.03em;
    border: none;
}

.fp-th-id[b-5s4e7g8txl]  { width: 80px;  text-align: center; }
.fp-th-num[b-5s4e7g8txl] { width: 90px;  text-align: right; }

.fp-tabla tbody tr:nth-child(even)[b-5s4e7g8txl] { background: rgba(26,58,92,.04); }

[data-mode="dark"] .fp-tabla tbody tr:nth-child(even)[b-5s4e7g8txl] { background: rgba(255,255,255,.04); }

.fp-tabla tbody td[b-5s4e7g8txl] {
    padding: 6px 10px;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: top;
}

.fp-td-id[b-5s4e7g8txl] {
    text-align: center;
    font-weight: 700;
    color: var(--rg-primary);
    font-size: 0.9rem;
}

.fp-td-desc[b-5s4e7g8txl] { word-break: break-word; }

.fp-td-num[b-5s4e7g8txl] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.fp-td-total[b-5s4e7g8txl] {
    font-weight: 700;
}

/* Totales */
.fp-totales[b-5s4e7g8txl] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    margin-top: 0.5rem;
}

.fp-total-row[b-5s4e7g8txl] {
    display: flex;
    justify-content: space-between;
    width: 220px;
    padding: 5px 10px;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
    border-bottom: 1px solid var(--rg-border);
    gap: 1rem;
}

.fp-total-row span:last-child[b-5s4e7g8txl] {
    font-variant-numeric: tabular-nums;
    text-align: right;
    min-width: 90px;
}

.fp-total-itbis span:last-child[b-5s4e7g8txl] {
    color: var(--rg-danger);
}

.fp-total-final[b-5s4e7g8txl] {
    background: var(--rg-primary);
    color: #fff !important;
    font-weight: 700;
    font-size: 0.95rem;
    border-radius: 0 0 4px 4px;
    border-bottom: none;
}

.fp-total-final span[b-5s4e7g8txl] { color: #fff !important; }

@media (max-width: 600px) {
    .fp-header[b-5s4e7g8txl] { flex-direction: column; }
    .fp-header-ncf[b-5s4e7g8txl] { align-items: flex-start; text-align: left; }
    .fp-cliente-field[b-5s4e7g8txl] { flex-direction: column; gap: 2px; }
    .fp-campo-label[b-5s4e7g8txl] { min-width: unset; }
}

/* ============================================================
   PDF Preview — modal grande con visor PDF nativo del browser
   El visor del browser ya provee print/zoom/download en su toolbar.
   ============================================================ */

/* Modal dialog grande — ocupa casi toda la pantalla para que el PDF se vea bien */
.factura-preview-dialog[b-5s4e7g8txl] {
    width: 95vw !important;
    max-width: 1200px !important;
    height: 92vh !important;
    max-height: 92vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* Body del modal: usa flex:1 para llenar todo el espacio entre header y footer */
.factura-preview-body[b-5s4e7g8txl] {
    padding: 0 !important;
    overflow: hidden !important;
    flex: 1 1 auto !important;
    min-height: 400px;
    background: var(--rg-bg-subtle, #f1f5f9);
    display: flex;
}

/* iframe: llena 100% del body para ver el PDF completo con todos los controles */
.factura-preview-iframe[b-5s4e7g8txl] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    background: #fff;
}
[data-mode="dark"] .factura-preview-iframe[b-5s4e7g8txl] {
    background: #fff;
}

/* Loader/empty centrados verticalmente cuando aún no hay PDF */
.factura-preview-body .crud-loading[b-5s4e7g8txl],
.factura-preview-body .crud-empty-state[b-5s4e7g8txl] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

@media (max-width: 768px) {
    .factura-preview-dialog[b-5s4e7g8txl] {
        width: 100vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
        max-width: 100vw !important;
        border-radius: 0 !important;
    }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-5s4e7g8txl] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-5s4e7g8txl] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-5s4e7g8txl] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-5s4e7g8txl] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/FrmminaFacturaEmitidasReporte.razor.rz.scp.css */
/* ============================================================
   FrmminaFacturaEmitidasReporte — Reporte de facturas emitidas
   Estilos base CRUD + extensiones propias del reporte
   ============================================================ */

.crud-container[b-ud2ean1fdw] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ud2ean1fdw 0.3s ease-out; }
@keyframes slideUp-b-ud2ean1fdw { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ud2ean1fdw] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ud2ean1fdw] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ud2ean1fdw] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ud2ean1fdw] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ud2ean1fdw] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ud2ean1fdw] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ud2ean1fdw] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ud2ean1fdw] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ud2ean1fdw] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ud2ean1fdw] { filter: brightness(1.1); }
.btn-outline[b-ud2ean1fdw] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ud2ean1fdw] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ud2ean1fdw] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ud2ean1fdw] { filter: brightness(1.1); }
.btn-sm[b-ud2ean1fdw] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-icon[b-ud2ean1fdw] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-reprint[b-ud2ean1fdw] { color: var(--rg-accent, #4f46e5); }
.btn-reprint:hover[b-ud2ean1fdw] { background: rgba(79, 70, 229, 0.1); }
.btn-email[b-ud2ean1fdw] { color: #0ea5e9; }
.btn-email:hover[b-ud2ean1fdw] { background: rgba(14, 165, 233, 0.1); }
.btn-ws[b-ud2ean1fdw] { color: #22c55e; }
.btn-ws:hover[b-ud2ean1fdw] { background: rgba(34, 197, 94, 0.1); }
.rpt-btn-send[b-ud2ean1fdw] { color: var(--rg-primary, #1a3a5c) !important; border-color: var(--rg-primary, #1a3a5c) !important; }
.rpt-btn-send:hover:not(:disabled)[b-ud2ean1fdw] { background: rgba(26, 58, 92, 0.08) !important; }

/* Alert */
.crud-alert[b-ud2ean1fdw] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert-success[b-ud2ean1fdw] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert-error[b-ud2ean1fdw] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-ud2ean1fdw] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert-success[b-ud2ean1fdw] { color: #86efac; }
[data-mode="dark"] .crud-alert-error[b-ud2ean1fdw] { color: #fca5a5; }

/* Count */
.crud-count[b-ud2ean1fdw] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ud2ean1fdw] { overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 200px); display: flex; flex-direction: column; gap: 0.75rem; padding: 0.25rem; }
.crud-table[b-ud2ean1fdw] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ud2ean1fdw] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ud2ean1fdw] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.5rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ud2ean1fdw] { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ud2ean1fdw] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ud2ean1fdw] { width: 110px; text-align: center; white-space: nowrap; }
.text-right[b-ud2ean1fdw] { text-align: right; }

/* Badges / Utils */
.badge[b-ud2ean1fdw] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ud2ean1fdw] { background: rgba(34,197,94,0.15); color: #166534; }
.font-mono[b-ud2ean1fdw] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.subtle-text[b-ud2ean1fdw] { color: var(--rg-text-secondary, #475569); }

[data-mode="dark"] .badge-yes[b-ud2ean1fdw] { color: #86efac; }

/* Loading / Empty */
.crud-loading[b-ud2ean1fdw], .crud-empty-state[b-ud2ean1fdw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ud2ean1fdw] { font-size: 2rem; }
.crud-spinner[b-ud2ean1fdw] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ud2ean1fdw 0.6s linear infinite; }
.crud-spinner-sm[b-ud2ean1fdw] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ud2ean1fdw 0.6s linear infinite; }
.spinner-inline[b-ud2ean1fdw] { display: inline-block; width: 0.9rem; height: 0.9rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ud2ean1fdw 0.6s linear infinite; }
@keyframes spin-b-ud2ean1fdw { to { transform: rotate(360deg); } }

/* Modal */
.modal-backdrop[b-ud2ean1fdw] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ud2ean1fdw 0.15s ease-out; }
.modal-container[b-ud2ean1fdw] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ud2ean1fdw] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ud2ean1fdw 0.2s ease-out; }
.modal-sm[b-ud2ean1fdw] { max-width: 420px; }
@keyframes fadeIn-b-ud2ean1fdw { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ud2ean1fdw { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ud2ean1fdw] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ud2ean1fdw] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-actions[b-ud2ean1fdw] { display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-ud2ean1fdw] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ud2ean1fdw] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ud2ean1fdw] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ud2ean1fdw] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-group[b-ud2ean1fdw] { display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: 0.75rem; }
.form-group label[b-ud2ean1fdw] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-control[b-ud2ean1fdw] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; }
.form-control:focus[b-ud2ean1fdw] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* ── Filtros ─────────────────────────────────────────────── */
.rpt-filters[b-ud2ean1fdw] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
}

.rpt-filter-group[b-ud2ean1fdw] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.rpt-filter-group label[b-ud2ean1fdw] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.rpt-filter-group input[type="date"][b-ud2ean1fdw] {
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
}

.rpt-filter-group input[type="date"]:focus[b-ud2ean1fdw] {
    border-color: var(--rg-primary, #1a3a5c);
}

/* ── Grupos por TipoNCF ─────────────────────────────────── */
.rpt-group-block[b-ud2ean1fdw] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--rg-bg-card, #fff);
}

.rpt-tipo-header[b-ud2ean1fdw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
    font-size: 0.78rem;
}

.rpt-tipo-badge[b-ud2ean1fdw] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-primary, #1a3a5c);
    background: rgba(26,58,92,0.1);
    padding: 0.1rem 0.5rem;
    border-radius: 0.375rem;
}

[data-mode="dark"] .rpt-tipo-badge[b-ud2ean1fdw] {
    color: #93c5fd;
    background: rgba(147,197,253,0.15);
}

.rpt-tipo-count[b-ud2ean1fdw] {
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
}

.rpt-table[b-ud2ean1fdw] { border-radius: 0; }

/* Cliente en la tabla */
.rpt-cliente-nombre[b-ud2ean1fdw] {
    display: block;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}

.rpt-cliente-id[b-ud2ean1fdw] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

/* Órdenes — truncar con ellipsis */
.rpt-ordenes-cell[b-ud2ean1fdw] {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Total cell */
.rpt-total-cell[b-ud2ean1fdw] {
    font-weight: 600;
    color: var(--rg-primary, #1a3a5c);
}

[data-mode="dark"] .rpt-total-cell[b-ud2ean1fdw] { color: #93c5fd; }

/* Subtotal row */
.rpt-subtotal-row td[b-ud2ean1fdw] {
    background: var(--rg-bg-subtle, #f8fafc);
    border-top: 2px solid var(--rg-border, #e2e8f0);
    font-size: 0.78rem;
    padding: 0.5rem 0.75rem;
}

.rpt-subtotal-label[b-ud2ean1fdw] {
    color: var(--rg-text-secondary, #475569);
    font-style: italic;
}

.rpt-subtotal-count[b-ud2ean1fdw] {
    margin-left: 0.5rem;
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    font-weight: normal;
}

/* ── Gran Total ─────────────────────────────────────────── */
.rpt-grand-total[b-ud2ean1fdw] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 0.75rem 1rem;
    background: var(--rg-primary, #1a3a5c);
    color: #fff;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
}

.rpt-grand-label[b-ud2ean1fdw] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
}

.rpt-grand-ordenes[b-ud2ean1fdw], .rpt-grand-cantidad[b-ud2ean1fdw] {
    font-size: 0.78rem;
    opacity: 0.85;
}

.rpt-grand-amount[b-ud2ean1fdw] {
    margin-left: auto;
    font-size: 1.05rem;
    font-weight: 700;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

/* ── Modal PDF Preview ─────────────────────────────────── */
.factura-preview-dialog[b-ud2ean1fdw] {
    max-width: none !important;
    width: calc(100% - 2rem) !important;
    height: 92vh !important;
    max-height: 92vh !important;
    border-radius: 0.5rem;
}

.factura-preview-body[b-ud2ean1fdw] {
    padding: 0 !important;
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.factura-preview-iframe[b-ud2ean1fdw] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: none;
}

/* ── Modal Envío ────────────────────────────────────────── */
.envio-ncf-label[b-ud2ean1fdw] {
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
    margin-bottom: 0.25rem;
}

.envio-cliente-label[b-ud2ean1fdw] {
    font-size: 0.8rem;
    color: var(--rg-text-muted, #94a3b8);
    margin-bottom: 0.75rem;
}

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ud2ean1fdw] { padding: 0.75rem; }
    .rpt-grand-total[b-ud2ean1fdw] { flex-wrap: wrap; gap: 0.5rem; }
    .rpt-grand-amount[b-ud2ean1fdw] { margin-left: 0; }
    .factura-preview-dialog[b-ud2ean1fdw] { width: 98% !important; height: 95vh !important; }
    .modal-dialog[b-ud2ean1fdw] { width: 98%; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ud2ean1fdw] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ud2ean1fdw] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ud2ean1fdw] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ud2ean1fdw] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminagastosyotros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3q8jzukr9o] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3q8jzukr9o 0.3s ease-out; }
@keyframes slideUp-b-3q8jzukr9o { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3q8jzukr9o] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3q8jzukr9o] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3q8jzukr9o] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3q8jzukr9o] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3q8jzukr9o] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3q8jzukr9o] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3q8jzukr9o] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3q8jzukr9o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3q8jzukr9o] { filter: brightness(1.1); }
.btn-outline[b-3q8jzukr9o] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3q8jzukr9o] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3q8jzukr9o] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3q8jzukr9o] { filter: brightness(1.1); }
.btn-icon[b-3q8jzukr9o] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3q8jzukr9o] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3q8jzukr9o] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3q8jzukr9o] { color: #ef4444; }
.btn-delete:hover[b-3q8jzukr9o] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3q8jzukr9o] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3q8jzukr9o] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3q8jzukr9o] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3q8jzukr9o] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3q8jzukr9o] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3q8jzukr9o] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3q8jzukr9o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3q8jzukr9o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3q8jzukr9o] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3q8jzukr9o] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3q8jzukr9o] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3q8jzukr9o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3q8jzukr9o] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3q8jzukr9o] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3q8jzukr9o] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3q8jzukr9o] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3q8jzukr9o] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3q8jzukr9o] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3q8jzukr9o] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3q8jzukr9o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3q8jzukr9o] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3q8jzukr9o] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3q8jzukr9o] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3q8jzukr9o] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3q8jzukr9o] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3q8jzukr9o] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3q8jzukr9o] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3q8jzukr9o] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3q8jzukr9o] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3q8jzukr9o] { display: block; }
.hide-on-cards[b-3q8jzukr9o] { display: none !important; }
.show-on-cards[b-3q8jzukr9o] { display: grid; }
.hide-on-grid[b-3q8jzukr9o] { display: none !important; }

/* Badges */
.badge[b-3q8jzukr9o] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3q8jzukr9o] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3q8jzukr9o] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3q8jzukr9o] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3q8jzukr9o] { text-align: center; }
.text-muted[b-3q8jzukr9o] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3q8jzukr9o], .crud-empty-state[b-3q8jzukr9o] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3q8jzukr9o] { font-size: 2rem; }
.crud-spinner[b-3q8jzukr9o] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3q8jzukr9o 0.6s linear infinite; }
.crud-spinner-sm[b-3q8jzukr9o] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3q8jzukr9o 0.6s linear infinite; }
@keyframes spin-b-3q8jzukr9o { to { transform: rotate(360deg); } }
.spin[b-3q8jzukr9o] { animation: spin-b-3q8jzukr9o 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3q8jzukr9o] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3q8jzukr9o 0.15s ease-out; }
.modal-container[b-3q8jzukr9o] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3q8jzukr9o] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3q8jzukr9o 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-3q8jzukr9o] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-3q8jzukr9o] { max-width: 420px; }
@keyframes fadeIn-b-3q8jzukr9o { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3q8jzukr9o { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3q8jzukr9o] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3q8jzukr9o] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3q8jzukr9o] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3q8jzukr9o] { color: #dc2626; }
.modal-close[b-3q8jzukr9o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3q8jzukr9o] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3q8jzukr9o] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3q8jzukr9o] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3q8jzukr9o] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3q8jzukr9o] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3q8jzukr9o] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3q8jzukr9o] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3q8jzukr9o] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3q8jzukr9o] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3q8jzukr9o] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3q8jzukr9o] { flex: 2; }
.form-group label[b-3q8jzukr9o] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3q8jzukr9o], .form-group select[b-3q8jzukr9o], .form-textarea[b-3q8jzukr9o] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3q8jzukr9o], .form-group select:focus[b-3q8jzukr9o], .form-textarea:focus[b-3q8jzukr9o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3q8jzukr9o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3q8jzukr9o] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3q8jzukr9o] { flex: 1; display: flex; align-items: center; }
.form-check[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3q8jzukr9o] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3q8jzukr9o] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3q8jzukr9o] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3q8jzukr9o] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3q8jzukr9o] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3q8jzukr9o] { font-size: 3rem; }
.photo-placeholder span[b-3q8jzukr9o] { font-size: 0.78rem; }
.photo-actions[b-3q8jzukr9o] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3q8jzukr9o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-3q8jzukr9o] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3q8jzukr9o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3q8jzukr9o] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3q8jzukr9o] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3q8jzukr9o] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3q8jzukr9o] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3q8jzukr9o] { filter: brightness(1.15); transform: scale(1.05); }
[b-3q8jzukr9o] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3q8jzukr9o] { padding: 0.75rem; }
    .crud-header[b-3q8jzukr9o] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3q8jzukr9o] { font-size: 1.1rem; }
    .btn-text[b-3q8jzukr9o] { display: none; }
    .form-row[b-3q8jzukr9o] { flex-direction: column; }
    .form-row-4[b-3q8jzukr9o] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3q8jzukr9o] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3q8jzukr9o] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-3q8jzukr9o] { padding: 0.75rem; }
    .modal-tabs[b-3q8jzukr9o] { overflow-x: auto; }
    .modal-tab[b-3q8jzukr9o] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3q8jzukr9o] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3q8jzukr9o] { display: grid !important; }
    .crud-cards-wrapper[b-3q8jzukr9o] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3q8jzukr9o] { grid-template-columns: 1fr; }
    .card-details[b-3q8jzukr9o] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-3q8jzukr9o] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3q8jzukr9o] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3q8jzukr9o] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3q8jzukr9o] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminamedioambiente.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-45w9lc0mbe] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-45w9lc0mbe 0.3s ease-out; }
@keyframes slideUp-b-45w9lc0mbe { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-45w9lc0mbe] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-45w9lc0mbe] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-45w9lc0mbe] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-45w9lc0mbe] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-45w9lc0mbe] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-45w9lc0mbe] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-45w9lc0mbe] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-45w9lc0mbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-45w9lc0mbe] { filter: brightness(1.1); }
.btn-outline[b-45w9lc0mbe] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-45w9lc0mbe] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-45w9lc0mbe] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-45w9lc0mbe] { filter: brightness(1.1); }
.btn-icon[b-45w9lc0mbe] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-45w9lc0mbe] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-45w9lc0mbe] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-45w9lc0mbe] { color: #ef4444; }
.btn-delete:hover[b-45w9lc0mbe] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-45w9lc0mbe] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-45w9lc0mbe] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-45w9lc0mbe] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-45w9lc0mbe] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-45w9lc0mbe] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-45w9lc0mbe] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-45w9lc0mbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-45w9lc0mbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-45w9lc0mbe] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-45w9lc0mbe] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-45w9lc0mbe] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-45w9lc0mbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-45w9lc0mbe] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-45w9lc0mbe] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-45w9lc0mbe] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-45w9lc0mbe] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-45w9lc0mbe] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-45w9lc0mbe] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-45w9lc0mbe] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-45w9lc0mbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-45w9lc0mbe] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-45w9lc0mbe] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-45w9lc0mbe] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-45w9lc0mbe] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-45w9lc0mbe] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-45w9lc0mbe] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-45w9lc0mbe] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-45w9lc0mbe] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-45w9lc0mbe] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-45w9lc0mbe] { display: block; }
.hide-on-cards[b-45w9lc0mbe] { display: none !important; }
.show-on-cards[b-45w9lc0mbe] { display: grid; }
.hide-on-grid[b-45w9lc0mbe] { display: none !important; }

/* Badges */
.badge[b-45w9lc0mbe] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-45w9lc0mbe] { background: #ecfdf5; color: #065f46; }
.badge-no[b-45w9lc0mbe] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-45w9lc0mbe] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-45w9lc0mbe] { text-align: center; }
.text-muted[b-45w9lc0mbe] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-45w9lc0mbe], .crud-empty-state[b-45w9lc0mbe] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-45w9lc0mbe] { font-size: 2rem; }
.crud-spinner[b-45w9lc0mbe] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-45w9lc0mbe 0.6s linear infinite; }
.crud-spinner-sm[b-45w9lc0mbe] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-45w9lc0mbe 0.6s linear infinite; }
@keyframes spin-b-45w9lc0mbe { to { transform: rotate(360deg); } }
.spin[b-45w9lc0mbe] { animation: spin-b-45w9lc0mbe 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-45w9lc0mbe] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-45w9lc0mbe 0.15s ease-out; }
.modal-container[b-45w9lc0mbe] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-45w9lc0mbe] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-45w9lc0mbe 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-45w9lc0mbe] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-45w9lc0mbe] { max-width: 420px; }
@keyframes fadeIn-b-45w9lc0mbe { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-45w9lc0mbe { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-45w9lc0mbe] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-45w9lc0mbe] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-45w9lc0mbe] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-45w9lc0mbe] { color: #dc2626; }
.modal-close[b-45w9lc0mbe] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-45w9lc0mbe] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-45w9lc0mbe] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-45w9lc0mbe] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-45w9lc0mbe] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-45w9lc0mbe] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-45w9lc0mbe] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-45w9lc0mbe] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-45w9lc0mbe] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-45w9lc0mbe] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-45w9lc0mbe] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-45w9lc0mbe] { flex: 2; }
.form-group label[b-45w9lc0mbe] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-45w9lc0mbe], .form-group select[b-45w9lc0mbe], .form-textarea[b-45w9lc0mbe] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-45w9lc0mbe], .form-group select:focus[b-45w9lc0mbe], .form-textarea:focus[b-45w9lc0mbe] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-45w9lc0mbe] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-45w9lc0mbe] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-45w9lc0mbe] { flex: 1; display: flex; align-items: center; }
.form-check[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-45w9lc0mbe] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-45w9lc0mbe] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-45w9lc0mbe] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-45w9lc0mbe] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-45w9lc0mbe] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-45w9lc0mbe] { font-size: 3rem; }
.photo-placeholder span[b-45w9lc0mbe] { font-size: 0.78rem; }
.photo-actions[b-45w9lc0mbe] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-45w9lc0mbe] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-45w9lc0mbe] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-45w9lc0mbe] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-45w9lc0mbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-45w9lc0mbe] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-45w9lc0mbe] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-45w9lc0mbe] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-45w9lc0mbe] { filter: brightness(1.15); transform: scale(1.05); }
[b-45w9lc0mbe] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-45w9lc0mbe] { padding: 0.75rem; }
    .crud-header[b-45w9lc0mbe] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-45w9lc0mbe] { font-size: 1.1rem; }
    .btn-text[b-45w9lc0mbe] { display: none; }
    .form-row[b-45w9lc0mbe] { flex-direction: column; }
    .form-row-4[b-45w9lc0mbe] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-45w9lc0mbe] { width: 98%; max-height: 95vh; }
    .modal-lg[b-45w9lc0mbe] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-45w9lc0mbe] { padding: 0.75rem; }
    .modal-tabs[b-45w9lc0mbe] { overflow-x: auto; }
    .modal-tab[b-45w9lc0mbe] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-45w9lc0mbe] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-45w9lc0mbe] { display: grid !important; }
    .crud-cards-wrapper[b-45w9lc0mbe] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-45w9lc0mbe] { grid-template-columns: 1fr; }
    .card-details[b-45w9lc0mbe] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-45w9lc0mbe] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-45w9lc0mbe] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-45w9lc0mbe] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-45w9lc0mbe] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/FrmminaOrdenesEmitidas.razor.rz.scp.css */
/* ============================================================
   FrmminaOrdenesEmitidas — Reporte de órdenes emitidas
   ============================================================ */

.crud-container[b-vvu1mzz2rz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vvu1mzz2rz 0.3s ease-out; }
@keyframes slideUp-b-vvu1mzz2rz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vvu1mzz2rz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vvu1mzz2rz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vvu1mzz2rz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vvu1mzz2rz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vvu1mzz2rz] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* Buttons */
.btn-crud[b-vvu1mzz2rz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vvu1mzz2rz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vvu1mzz2rz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vvu1mzz2rz] { filter: brightness(1.1); }
.btn-outline[b-vvu1mzz2rz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vvu1mzz2rz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-sm[b-vvu1mzz2rz] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }

/* Alert */
.crud-alert[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert-success[b-vvu1mzz2rz] { background: rgba(34,197,94,0.1); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert-error[b-vvu1mzz2rz]   { background: rgba(239,68,68,0.1);  color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-vvu1mzz2rz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert-success[b-vvu1mzz2rz] { color: #86efac; }
[data-mode="dark"] .crud-alert-error[b-vvu1mzz2rz]   { color: #fca5a5; }

/* Grid */
.crud-grid-wrapper[b-vvu1mzz2rz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 260px); }
.crud-table[b-vvu1mzz2rz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vvu1mzz2rz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vvu1mzz2rz] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.5rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vvu1mzz2rz] { padding: 0.45rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vvu1mzz2rz] { background: var(--rg-bg-hover, #f8fafc); }
.text-right[b-vvu1mzz2rz]  { text-align: right; }
.text-center[b-vvu1mzz2rz] { text-align: center; }
.font-mono[b-vvu1mzz2rz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.subtle-text[b-vvu1mzz2rz] { color: var(--rg-text-secondary, #475569); }
.subtle-ncf[b-vvu1mzz2rz]  { font-size: 0.72rem; color: var(--rg-text-secondary, #475569); font-family: 'Cascadia Code', 'Fira Code', monospace; }

/* Acciones por fila */
.col-actions[b-vvu1mzz2rz] { width: 120px; white-space: nowrap; }
.btn-icon[b-vvu1mzz2rz] { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: none; border-radius: 0.35rem; cursor: pointer; font-size: 0.82rem; transition: all 0.15s; background: transparent; padding: 0; }
.btn-reprint[b-vvu1mzz2rz]      { color: var(--rg-text-secondary, #64748b); }
.btn-reprint:hover[b-vvu1mzz2rz] { background: rgba(100,116,139,0.15); color: var(--rg-text-primary, #1e293b); }
.btn-reprint-fact[b-vvu1mzz2rz] { color: #ef4444; }
.btn-reprint-fact:hover[b-vvu1mzz2rz] { background: rgba(239,68,68,0.12); }
.btn-email[b-vvu1mzz2rz] { color: #0ea5e9; }
.btn-email:hover[b-vvu1mzz2rz] { background: rgba(14,165,233,0.12); }
.btn-ws[b-vvu1mzz2rz]    { color: #22c55e; }
.btn-ws:hover[b-vvu1mzz2rz] { background: rgba(34,197,94,0.12); }
[data-mode="dark"] .btn-reprint[b-vvu1mzz2rz] { color: var(--rg-text-muted, #94a3b8); }
[data-mode="dark"] .btn-reprint:hover[b-vvu1mzz2rz] { background: rgba(255,255,255,0.08); color: var(--rg-text-primary, #f1f5f9); }

/* Fila pendiente de facturar */
.row-pendiente td[b-vvu1mzz2rz] { background: rgba(251, 191, 36, 0.04); }
[data-mode="dark"] .row-pendiente td[b-vvu1mzz2rz] { background: rgba(251, 191, 36, 0.06); }

/* Loading / Empty */
.crud-loading[b-vvu1mzz2rz], .crud-empty-state[b-vvu1mzz2rz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vvu1mzz2rz] { font-size: 2rem; }
.crud-spinner[b-vvu1mzz2rz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vvu1mzz2rz 0.6s linear infinite; }
.crud-spinner-sm[b-vvu1mzz2rz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vvu1mzz2rz 0.6s linear infinite; }
@keyframes spin-b-vvu1mzz2rz { to { transform: rotate(360deg); } }

/* ── Filtros ─────────────────────────────────────────────── */
.rpt-filters[b-vvu1mzz2rz] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
}

.rpt-filter-group[b-vvu1mzz2rz] { display: flex; flex-direction: column; gap: 0.25rem; }
.rpt-filter-group label[b-vvu1mzz2rz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; }

.rpt-date-input[b-vvu1mzz2rz] {
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
}
.rpt-date-input:focus[b-vvu1mzz2rz] { border-color: var(--rg-primary, #1a3a5c); }

/* ── Buscador de cliente (inline icon) ──────────────────── */
.rpt-filter-cliente[b-vvu1mzz2rz] { flex: 1; min-width: 180px; max-width: 300px; }

.rpt-search-wrap[b-vvu1mzz2rz] {
    display: flex;
    align-items: center;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-input, #fff);
    overflow: hidden;
    transition: border-color 0.15s;
}
.rpt-search-wrap:focus-within[b-vvu1mzz2rz] { border-color: var(--rg-primary, #1a3a5c); }

.rpt-search-prefix[b-vvu1mzz2rz] {
    display: flex;
    align-items: center;
    padding: 0 0.4rem 0 0.6rem;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.78rem;
    flex-shrink: 0;
    pointer-events: none;
}

.rpt-search-input[b-vvu1mzz2rz] {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0.375rem 0.25rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    outline: none;
    min-width: 0;
}
.rpt-search-input[b-vvu1mzz2rz]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.rpt-search-clear[b-vvu1mzz2rz] {
    display: flex;
    align-items: center;
    padding: 0 0.4rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.72rem;
    flex-shrink: 0;
    transition: color 0.15s;
}
.rpt-search-clear:hover[b-vvu1mzz2rz] { color: var(--rg-text-primary, #1e293b); }

[data-mode="dark"] .rpt-search-wrap[b-vvu1mzz2rz] { background: var(--rg-bg-input, #1e293b); }
[data-mode="dark"] .rpt-search-input[b-vvu1mzz2rz] { color: var(--rg-text-primary, #f1f5f9); }

/* Pills de resumen */
.rpt-summary-pills[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin-left: auto; }
.rpt-pill[b-vvu1mzz2rz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 600; }
.rpt-pill-total[b-vvu1mzz2rz]   { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.rpt-pill-ok[b-vvu1mzz2rz]      { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.25); }
.rpt-pill-pending[b-vvu1mzz2rz] { background: rgba(251,191,36,0.15); color: #92400e; border: 1px solid rgba(251,191,36,0.3); }
[data-mode="dark"] .rpt-pill-ok[b-vvu1mzz2rz]      { color: #86efac; }
[data-mode="dark"] .rpt-pill-pending[b-vvu1mzz2rz] { color: #fde68a; }

/* ── Selector de agrupación ──────────────────────────────── */
.rpt-agrupacion-bar[b-vvu1mzz2rz] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    padding: 0.6rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    flex-wrap: wrap;
}
.rpt-agrupacion-label[b-vvu1mzz2rz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; display: flex; align-items: center; gap: 0.3rem; }
.rpt-chips[b-vvu1mzz2rz] { display: flex; gap: 0.35rem; flex-wrap: wrap; }
.rpt-chip[b-vvu1mzz2rz] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.75rem; border-radius: 2rem; font-size: 0.72rem; font-weight: 600; cursor: pointer; border: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); transition: all 0.15s; white-space: nowrap; }
.rpt-chip:hover:not(.rpt-chip-active)[b-vvu1mzz2rz] { background: var(--rg-bg-hover, #f1f5f9); border-color: var(--rg-primary, #1a3a5c); color: var(--rg-primary, #1a3a5c); }
.rpt-chip-active[b-vvu1mzz2rz] { background: var(--rg-primary, #1a3a5c); border-color: var(--rg-primary, #1a3a5c); color: #fff; box-shadow: 0 2px 6px rgba(26,58,92,0.25); }
[data-mode="dark"] .rpt-chip[b-vvu1mzz2rz] { background: rgba(255,255,255,0.06); border-color: var(--rg-border, #334155); color: var(--rg-text-secondary, #94a3b8); }
[data-mode="dark"] .rpt-chip:hover:not(.rpt-chip-active)[b-vvu1mzz2rz] { background: rgba(255,255,255,0.1); color: var(--rg-text-primary, #f1f5f9); }
[data-mode="dark"] .rpt-chip-active[b-vvu1mzz2rz] { background: var(--rg-primary, #1a3a5c); color: #e2e8f0; }

/* ── Vista agrupada ──────────────────────────────────────── */
.rpt-grouped-wrapper[b-vvu1mzz2rz] { border: none; background: transparent; overflow: visible; max-height: none; }
.rpt-group-block[b-vvu1mzz2rz] { margin-bottom: 1rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; background: var(--rg-bg-card, #fff); }
.rpt-tipo-header[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 0.6rem; padding: 0.55rem 0.85rem; background: var(--rg-bg-subtle, #f8fafc); border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-wrap: wrap; }
.rpt-grupo-icon[b-vvu1mzz2rz] { font-size: 0.85rem; color: var(--rg-primary, #1a3a5c); }
.rpt-tipo-badge[b-vvu1mzz2rz] { font-size: 0.82rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.rpt-tipo-count[b-vvu1mzz2rz] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); background: var(--rg-bg-hover, #f1f5f9); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 1rem; padding: 0.1rem 0.5rem; }
.rpt-tipo-subtotales[b-vvu1mzz2rz] { display: flex; gap: 1rem; margin-left: auto; font-size: 0.75rem; color: var(--rg-text-secondary, #475569); }
.rpt-tipo-total[b-vvu1mzz2rz] { font-weight: 700; color: var(--rg-primary, #1a3a5c); }
[data-mode="dark"] .rpt-grupo-icon[b-vvu1mzz2rz] { color: #93c5fd; }
[data-mode="dark"] .rpt-tipo-total[b-vvu1mzz2rz] { color: #93c5fd; }
.rpt-table[b-vvu1mzz2rz] { border-top: none; }

/* Subtotal de grupo */
.rpt-subtotal-row td[b-vvu1mzz2rz] { background: rgba(26,58,92,0.06); color: var(--rg-text-primary, #1e293b); border-top: 1px solid var(--rg-border, #e2e8f0); font-size: 0.77rem; }
.rpt-subtotal-label[b-vvu1mzz2rz] { color: var(--rg-text-secondary, #475569); }
.rpt-subtotal-count[b-vvu1mzz2rz] { margin-left: 0.4rem; font-size: 0.68rem; opacity: 0.7; font-weight: normal; }
[data-mode="dark"] .rpt-subtotal-row td[b-vvu1mzz2rz] { background: rgba(255,255,255,0.04); }

/* Gran total (agrupado) */
.rpt-grand-total[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 1.25rem; padding: 0.65rem 1rem; background: var(--rg-primary, #1a3a5c); border-radius: 0.5rem; margin-bottom: 0.5rem; flex-wrap: wrap; }
.rpt-grand-label[b-vvu1mzz2rz]   { font-size: 0.82rem; font-weight: 700; color: rgba(255,255,255,0.95); display: flex; align-items: center; gap: 0.3rem; }
.rpt-grand-ordenes[b-vvu1mzz2rz] { font-size: 0.72rem; color: rgba(255,255,255,0.7); }
.rpt-grand-cantidad[b-vvu1mzz2rz]{ font-size: 0.8rem;  color: rgba(255,255,255,0.85); }
.rpt-grand-amount[b-vvu1mzz2rz]  { font-size: 1rem;    font-weight: 700; color: #fff; margin-left: auto; font-family: 'Cascadia Code', 'Fira Code', monospace; }

/* Gran total (plano — tfoot) */
.rpt-grand-row td[b-vvu1mzz2rz] { background: var(--rg-primary, #1a3a5c); color: #fff; padding: 0.5rem 0.75rem; font-size: 0.78rem; border: none; }
.rpt-grand-label[b-vvu1mzz2rz] { color: rgba(255,255,255,0.9); }

/* Cliente en tabla */
.rpt-cliente-nombre[b-vvu1mzz2rz] { display: block; font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.rpt-cliente-id[b-vvu1mzz2rz]     { display: block; font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); font-family: 'Cascadia Code', 'Fira Code', monospace; }

/* Total cell */
.rpt-total-cell[b-vvu1mzz2rz] { font-weight: 600; color: var(--rg-primary, #1a3a5c); }
[data-mode="dark"] .rpt-total-cell[b-vvu1mzz2rz] { color: #93c5fd; }

/* ── Badges ──────────────────────────────────────────────── */
.badge[b-vvu1mzz2rz] { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem 0.45rem; border-radius: 1rem; font-size: 0.65rem; font-weight: 600; white-space: nowrap; }
.badge-facturada[b-vvu1mzz2rz] { background: rgba(34,197,94,0.15); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.badge-pendiente[b-vvu1mzz2rz] { background: rgba(251,191,36,0.15); color: #92400e; border: 1px solid rgba(251,191,36,0.3); }
.badge-credito[b-vvu1mzz2rz]   { background: rgba(79,70,229,0.12);  color: #4338ca; border: 1px solid rgba(79,70,229,0.25); }
.badge-contado[b-vvu1mzz2rz]   { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
[data-mode="dark"] .badge-facturada[b-vvu1mzz2rz] { color: #86efac; }
[data-mode="dark"] .badge-pendiente[b-vvu1mzz2rz] { color: #fde68a; }
[data-mode="dark"] .badge-credito[b-vvu1mzz2rz]   { color: #a5b4fc; }

/* ── Modal base ──────────────────────────────────────────── */
.modal-backdrop[b-vvu1mzz2rz] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    cursor: pointer;
}
.modal-container[b-vvu1mzz2rz] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001; padding: 1rem;
    pointer-events: none;
}
.modal-dialog[b-vvu1mzz2rz] {
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    pointer-events: all;
}
.modal-lg[b-vvu1mzz2rz] { width: min(900px, 100%); max-height: 90vh; }
.modal-sm[b-vvu1mzz2rz] { width: min(420px, 100%); }
.modal-header[b-vvu1mzz2rz] { display: flex; align-items: center; justify-content: space-between; padding: 0.85rem 1.1rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); gap: 0.5rem; }
.modal-header h2[b-vvu1mzz2rz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.4rem; }
.modal-header-actions[b-vvu1mzz2rz] { display: flex; align-items: center; gap: 0.4rem; flex-shrink: 0; }
.modal-body[b-vvu1mzz2rz] { padding: 1rem 1.1rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vvu1mzz2rz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.85rem 1.1rem; border-top: 1px solid var(--rg-border, #e2e8f0); }

/* Botón cerrar — grande y visible */
.modal-close-btn[b-vvu1mzz2rz] {
    display: flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    background: var(--rg-bg-subtle, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    cursor: pointer;
    color: var(--rg-text-secondary, #475569);
    font-size: 0.9rem;
    transition: all 0.15s;
    flex-shrink: 0;
}
.modal-close-btn:hover[b-vvu1mzz2rz] { background: rgba(239,68,68,0.1); border-color: rgba(239,68,68,0.3); color: #dc2626; }
[data-mode="dark"] .modal-close-btn[b-vvu1mzz2rz] { background: rgba(255,255,255,0.08); border-color: var(--rg-border, #334155); color: var(--rg-text-secondary, #94a3b8); }
[data-mode="dark"] .modal-close-btn:hover[b-vvu1mzz2rz] { background: rgba(239,68,68,0.2); color: #f87171; }

/* Modal — vista previa PDF */
.factura-preview-dialog[b-vvu1mzz2rz] { width: min(960px, 100%); height: min(90vh, 860px); }
.factura-preview-body[b-vvu1mzz2rz]   { padding: 0 !important; flex: 1; display: flex; flex-direction: column; min-height: 0; }
.factura-preview-iframe[b-vvu1mzz2rz] { flex: 1; width: 100%; border: none; display: block; min-height: 0; }

/* Modal — envío */
.envio-ref-label[b-vvu1mzz2rz]    { font-size: 0.85rem; color: var(--rg-text-secondary, #475569); margin: 0 0 0.3rem; display: flex; align-items: center; gap: 0.35rem; }
.envio-cliente-label[b-vvu1mzz2rz]{ font-size: 0.8rem;  color: var(--rg-text-muted, #94a3b8); margin: 0 0 0.85rem; display: flex; align-items: center; gap: 0.35rem; }

.form-group[b-vvu1mzz2rz] { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.75rem; }
.form-group label[b-vvu1mzz2rz] { font-size: 0.75rem; font-weight: 600; color: var(--rg-text-secondary, #475569); }
.form-control[b-vvu1mzz2rz] { padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; width: 100%; box-sizing: border-box; }
.form-control:focus[b-vvu1mzz2rz] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.12); }

.spinner-inline[b-vvu1mzz2rz] { display: inline-block; width: 0.85rem; height: 0.85rem; border: 2px solid rgba(255,255,255,0.35); border-top-color: #fff; border-radius: 50%; animation: spin-b-vvu1mzz2rz 0.6s linear infinite; }

/* ── Columnas ocultas ─────────────────────────────────────── */
@media (max-width: 1024px) { .col-hide-md[b-vvu1mzz2rz] { display: none !important; } }
@media (max-width: 768px)  { .col-hide-sm[b-vvu1mzz2rz] { display: none !important; } }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vvu1mzz2rz] { padding: 0.75rem; }
    .crud-header[b-vvu1mzz2rz] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-vvu1mzz2rz] { display: none; }
    .rpt-filters[b-vvu1mzz2rz] { flex-direction: column; align-items: flex-start; }
    .rpt-filter-cliente[b-vvu1mzz2rz] { max-width: 100%; width: 100%; }
    .rpt-summary-pills[b-vvu1mzz2rz] { margin-left: 0; }
    .rpt-agrupacion-bar[b-vvu1mzz2rz] { flex-direction: column; align-items: flex-start; }
    .rpt-chips[b-vvu1mzz2rz] { gap: 0.3rem; }
    .rpt-chip span[b-vvu1mzz2rz] { display: none; }
    .rpt-tipo-subtotales[b-vvu1mzz2rz] { margin-left: 0; }
    .rpt-grand-total[b-vvu1mzz2rz] { flex-direction: column; gap: 0.4rem; }
    .rpt-grand-amount[b-vvu1mzz2rz] { margin-left: 0; font-size: 1.1rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-vvu1mzz2rz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vvu1mzz2rz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vvu1mzz2rz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vvu1mzz2rz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmmina_productos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-v93ee9skxr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-v93ee9skxr 0.3s ease-out; }
@keyframes slideUp-b-v93ee9skxr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-v93ee9skxr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-v93ee9skxr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-v93ee9skxr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-v93ee9skxr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-v93ee9skxr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-v93ee9skxr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-v93ee9skxr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-v93ee9skxr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-v93ee9skxr] { filter: brightness(1.1); }
.btn-outline[b-v93ee9skxr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-v93ee9skxr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-v93ee9skxr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-v93ee9skxr] { filter: brightness(1.1); }
.btn-icon[b-v93ee9skxr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-v93ee9skxr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-v93ee9skxr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-v93ee9skxr] { color: #ef4444; }
.btn-delete:hover[b-v93ee9skxr] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-v93ee9skxr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-v93ee9skxr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-v93ee9skxr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-v93ee9skxr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-v93ee9skxr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-v93ee9skxr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-v93ee9skxr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-v93ee9skxr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-v93ee9skxr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-v93ee9skxr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-v93ee9skxr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-v93ee9skxr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-v93ee9skxr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-v93ee9skxr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-v93ee9skxr] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-v93ee9skxr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-v93ee9skxr] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-v93ee9skxr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-v93ee9skxr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-v93ee9skxr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-v93ee9skxr] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-v93ee9skxr] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-v93ee9skxr] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-v93ee9skxr] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-v93ee9skxr] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-v93ee9skxr] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-v93ee9skxr] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-v93ee9skxr] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-v93ee9skxr] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-v93ee9skxr] { display: block; }
.hide-on-cards[b-v93ee9skxr] { display: none !important; }
.show-on-cards[b-v93ee9skxr] { display: grid; }
.hide-on-grid[b-v93ee9skxr] { display: none !important; }

/* Badges */
.badge[b-v93ee9skxr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-v93ee9skxr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-v93ee9skxr] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-v93ee9skxr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-v93ee9skxr] { text-align: center; }
.text-muted[b-v93ee9skxr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-v93ee9skxr], .crud-empty-state[b-v93ee9skxr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-v93ee9skxr] { font-size: 2rem; }
.crud-spinner[b-v93ee9skxr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-v93ee9skxr 0.6s linear infinite; }
.crud-spinner-sm[b-v93ee9skxr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-v93ee9skxr 0.6s linear infinite; }
@keyframes spin-b-v93ee9skxr { to { transform: rotate(360deg); } }
.spin[b-v93ee9skxr] { animation: spin-b-v93ee9skxr 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-v93ee9skxr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-v93ee9skxr 0.15s ease-out; }
.modal-container[b-v93ee9skxr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-v93ee9skxr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-v93ee9skxr 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-v93ee9skxr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-v93ee9skxr] { max-width: 420px; }
@keyframes fadeIn-b-v93ee9skxr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-v93ee9skxr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-v93ee9skxr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-v93ee9skxr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-v93ee9skxr] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-v93ee9skxr] { color: #dc2626; }
.modal-close[b-v93ee9skxr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-v93ee9skxr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-v93ee9skxr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-v93ee9skxr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-v93ee9skxr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-v93ee9skxr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-v93ee9skxr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-v93ee9skxr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-v93ee9skxr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-v93ee9skxr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-v93ee9skxr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-v93ee9skxr] { flex: 2; }
.form-group label[b-v93ee9skxr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-v93ee9skxr], .form-group select[b-v93ee9skxr], .form-textarea[b-v93ee9skxr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-v93ee9skxr], .form-group select:focus[b-v93ee9skxr], .form-textarea:focus[b-v93ee9skxr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-v93ee9skxr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-v93ee9skxr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-v93ee9skxr] { flex: 1; display: flex; align-items: center; }
.form-check[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-v93ee9skxr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-v93ee9skxr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-v93ee9skxr] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-v93ee9skxr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-v93ee9skxr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-v93ee9skxr] { font-size: 3rem; }
.photo-placeholder span[b-v93ee9skxr] { font-size: 0.78rem; }
.photo-actions[b-v93ee9skxr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-v93ee9skxr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-v93ee9skxr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-v93ee9skxr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-v93ee9skxr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-v93ee9skxr] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-v93ee9skxr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-v93ee9skxr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-v93ee9skxr] { filter: brightness(1.15); transform: scale(1.05); }
[b-v93ee9skxr] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-v93ee9skxr] { padding: 0.75rem; }
    .crud-header[b-v93ee9skxr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-v93ee9skxr] { font-size: 1.1rem; }
    .btn-text[b-v93ee9skxr] { display: none; }
    .form-row[b-v93ee9skxr] { flex-direction: column; }
    .form-row-4[b-v93ee9skxr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-v93ee9skxr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-v93ee9skxr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-v93ee9skxr] { padding: 0.75rem; }
    .modal-tabs[b-v93ee9skxr] { overflow-x: auto; }
    .modal-tab[b-v93ee9skxr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-v93ee9skxr] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-v93ee9skxr] { display: grid !important; }
    .crud-cards-wrapper[b-v93ee9skxr] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-v93ee9skxr] { grid-template-columns: 1fr; }
    .card-details[b-v93ee9skxr] { flex-direction: column; gap: 0.35rem; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-v93ee9skxr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-v93ee9skxr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-v93ee9skxr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-v93ee9skxr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmmincuadrereporte.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-x2tvot09ya] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x2tvot09ya 0.3s ease-out; }
@keyframes slideUp-b-x2tvot09ya { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x2tvot09ya] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x2tvot09ya] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x2tvot09ya] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x2tvot09ya] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x2tvot09ya] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x2tvot09ya] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x2tvot09ya] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x2tvot09ya] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x2tvot09ya] { filter: brightness(1.1); }
.btn-outline[b-x2tvot09ya] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x2tvot09ya] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x2tvot09ya] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x2tvot09ya] { filter: brightness(1.1); }
.btn-icon[b-x2tvot09ya] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x2tvot09ya] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x2tvot09ya] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-x2tvot09ya] { color: #ef4444; }
.btn-delete:hover[b-x2tvot09ya] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-x2tvot09ya] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x2tvot09ya] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x2tvot09ya] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x2tvot09ya] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-x2tvot09ya] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-x2tvot09ya] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-x2tvot09ya] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-x2tvot09ya] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-x2tvot09ya] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-x2tvot09ya] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x2tvot09ya] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x2tvot09ya] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x2tvot09ya] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x2tvot09ya] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x2tvot09ya] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-x2tvot09ya] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-x2tvot09ya] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-x2tvot09ya] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-x2tvot09ya] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-x2tvot09ya] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-x2tvot09ya] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-x2tvot09ya] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-x2tvot09ya] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-x2tvot09ya] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-x2tvot09ya] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-x2tvot09ya] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-x2tvot09ya] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-x2tvot09ya] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-x2tvot09ya] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-x2tvot09ya] { display: block; }
.hide-on-cards[b-x2tvot09ya] { display: none !important; }
.show-on-cards[b-x2tvot09ya] { display: grid; }
.hide-on-grid[b-x2tvot09ya] { display: none !important; }

/* Badges */
.badge[b-x2tvot09ya] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-x2tvot09ya] { background: #ecfdf5; color: #065f46; }
.badge-no[b-x2tvot09ya] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-x2tvot09ya] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x2tvot09ya] { text-align: center; }
.text-muted[b-x2tvot09ya] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-x2tvot09ya], .crud-empty-state[b-x2tvot09ya] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x2tvot09ya] { font-size: 2rem; }
.crud-spinner[b-x2tvot09ya] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x2tvot09ya 0.6s linear infinite; }
.crud-spinner-sm[b-x2tvot09ya] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x2tvot09ya 0.6s linear infinite; }
@keyframes spin-b-x2tvot09ya { to { transform: rotate(360deg); } }
.spin[b-x2tvot09ya] { animation: spin-b-x2tvot09ya 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-x2tvot09ya] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x2tvot09ya 0.15s ease-out; }
.modal-container[b-x2tvot09ya] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x2tvot09ya] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x2tvot09ya 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-x2tvot09ya] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-x2tvot09ya] { max-width: 420px; }
@keyframes fadeIn-b-x2tvot09ya { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x2tvot09ya { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x2tvot09ya] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x2tvot09ya] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-x2tvot09ya] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-x2tvot09ya] { color: #dc2626; }
.modal-close[b-x2tvot09ya] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x2tvot09ya] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x2tvot09ya] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x2tvot09ya] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-x2tvot09ya] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-x2tvot09ya] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-x2tvot09ya] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-x2tvot09ya] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-x2tvot09ya] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-x2tvot09ya] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-x2tvot09ya] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-x2tvot09ya] { flex: 2; }
.form-group label[b-x2tvot09ya] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-x2tvot09ya], .form-group select[b-x2tvot09ya], .form-textarea[b-x2tvot09ya] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-x2tvot09ya], .form-group select:focus[b-x2tvot09ya], .form-textarea:focus[b-x2tvot09ya] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-x2tvot09ya] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-x2tvot09ya] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-x2tvot09ya] { flex: 1; display: flex; align-items: center; }
.form-check[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-x2tvot09ya] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-x2tvot09ya] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-x2tvot09ya] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-x2tvot09ya] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-x2tvot09ya] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-x2tvot09ya] { font-size: 3rem; }
.photo-placeholder span[b-x2tvot09ya] { font-size: 0.78rem; }
.photo-actions[b-x2tvot09ya] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-x2tvot09ya] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-x2tvot09ya] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-x2tvot09ya] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-x2tvot09ya] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-x2tvot09ya] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-x2tvot09ya] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-x2tvot09ya] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-x2tvot09ya] { filter: brightness(1.15); transform: scale(1.05); }
[b-x2tvot09ya] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-x2tvot09ya] { padding: 0.75rem; }
    .crud-header[b-x2tvot09ya] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x2tvot09ya] { font-size: 1.1rem; }
    .btn-text[b-x2tvot09ya] { display: none; }
    .form-row[b-x2tvot09ya] { flex-direction: column; }
    .form-row-4[b-x2tvot09ya] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-x2tvot09ya] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x2tvot09ya] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-x2tvot09ya] { padding: 0.75rem; }
    .modal-tabs[b-x2tvot09ya] { overflow-x: auto; }
    .modal-tab[b-x2tvot09ya] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-x2tvot09ya] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-x2tvot09ya] { display: grid !important; }
    .crud-cards-wrapper[b-x2tvot09ya] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-x2tvot09ya] { grid-template-columns: 1fr; }
    .card-details[b-x2tvot09ya] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-x2tvot09ya] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x2tvot09ya] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x2tvot09ya] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x2tvot09ya] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmmingasoil.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4k562uw9a2] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4k562uw9a2 0.3s ease-out; }
@keyframes slideUp-b-4k562uw9a2 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4k562uw9a2] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4k562uw9a2] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4k562uw9a2] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4k562uw9a2] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4k562uw9a2] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4k562uw9a2] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4k562uw9a2] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4k562uw9a2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4k562uw9a2] { filter: brightness(1.1); }
.btn-outline[b-4k562uw9a2] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4k562uw9a2] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4k562uw9a2] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4k562uw9a2] { filter: brightness(1.1); }
.btn-icon[b-4k562uw9a2] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4k562uw9a2] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4k562uw9a2] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4k562uw9a2] { color: #ef4444; }
.btn-delete:hover[b-4k562uw9a2] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4k562uw9a2] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4k562uw9a2] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4k562uw9a2] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4k562uw9a2] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4k562uw9a2] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4k562uw9a2] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4k562uw9a2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4k562uw9a2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4k562uw9a2] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4k562uw9a2] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4k562uw9a2] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4k562uw9a2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4k562uw9a2] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4k562uw9a2] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4k562uw9a2] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4k562uw9a2] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4k562uw9a2] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4k562uw9a2] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4k562uw9a2] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4k562uw9a2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4k562uw9a2] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4k562uw9a2] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4k562uw9a2] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4k562uw9a2] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4k562uw9a2] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4k562uw9a2] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4k562uw9a2] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4k562uw9a2] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4k562uw9a2] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4k562uw9a2] { display: block; }
.hide-on-cards[b-4k562uw9a2] { display: none !important; }
.show-on-cards[b-4k562uw9a2] { display: grid; }
.hide-on-grid[b-4k562uw9a2] { display: none !important; }

/* Badges */
.badge[b-4k562uw9a2] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4k562uw9a2] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4k562uw9a2] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4k562uw9a2] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4k562uw9a2] { text-align: center; }
.text-muted[b-4k562uw9a2] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4k562uw9a2], .crud-empty-state[b-4k562uw9a2] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4k562uw9a2] { font-size: 2rem; }
.crud-spinner[b-4k562uw9a2] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4k562uw9a2 0.6s linear infinite; }
.crud-spinner-sm[b-4k562uw9a2] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4k562uw9a2 0.6s linear infinite; }
@keyframes spin-b-4k562uw9a2 { to { transform: rotate(360deg); } }
.spin[b-4k562uw9a2] { animation: spin-b-4k562uw9a2 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4k562uw9a2] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4k562uw9a2 0.15s ease-out; }
.modal-container[b-4k562uw9a2] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4k562uw9a2] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4k562uw9a2 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4k562uw9a2] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4k562uw9a2] { max-width: 420px; }
@keyframes fadeIn-b-4k562uw9a2 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4k562uw9a2 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4k562uw9a2] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4k562uw9a2] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4k562uw9a2] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4k562uw9a2] { color: #dc2626; }
.modal-close[b-4k562uw9a2] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4k562uw9a2] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4k562uw9a2] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4k562uw9a2] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4k562uw9a2] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4k562uw9a2] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4k562uw9a2] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4k562uw9a2] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4k562uw9a2] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4k562uw9a2] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4k562uw9a2] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4k562uw9a2] { flex: 2; }
.form-group label[b-4k562uw9a2] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4k562uw9a2], .form-group select[b-4k562uw9a2], .form-textarea[b-4k562uw9a2] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4k562uw9a2], .form-group select:focus[b-4k562uw9a2], .form-textarea:focus[b-4k562uw9a2] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4k562uw9a2] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4k562uw9a2] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4k562uw9a2] { flex: 1; display: flex; align-items: center; }
.form-check[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4k562uw9a2] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4k562uw9a2] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4k562uw9a2] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4k562uw9a2] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4k562uw9a2] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4k562uw9a2] { font-size: 3rem; }
.photo-placeholder span[b-4k562uw9a2] { font-size: 0.78rem; }
.photo-actions[b-4k562uw9a2] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4k562uw9a2] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4k562uw9a2] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4k562uw9a2] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4k562uw9a2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4k562uw9a2] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4k562uw9a2] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4k562uw9a2] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4k562uw9a2] { filter: brightness(1.15); transform: scale(1.05); }
[b-4k562uw9a2] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4k562uw9a2] { padding: 0.75rem; }
    .crud-header[b-4k562uw9a2] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4k562uw9a2] { font-size: 1.1rem; }
    .btn-text[b-4k562uw9a2] { display: none; }
    .form-row[b-4k562uw9a2] { flex-direction: column; }
    .form-row-4[b-4k562uw9a2] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4k562uw9a2] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4k562uw9a2] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4k562uw9a2] { padding: 0.75rem; }
    .modal-tabs[b-4k562uw9a2] { overflow-x: auto; }
    .modal-tab[b-4k562uw9a2] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4k562uw9a2] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4k562uw9a2] { display: grid !important; }
    .crud-cards-wrapper[b-4k562uw9a2] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4k562uw9a2] { grid-template-columns: 1fr; }
    .card-details[b-4k562uw9a2] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4k562uw9a2] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4k562uw9a2] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4k562uw9a2] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4k562uw9a2] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Mina/Frmminreimpresionordenes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-3gqpg9r8ue] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3gqpg9r8ue 0.3s ease-out; }
@keyframes slideUp-b-3gqpg9r8ue { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-3gqpg9r8ue] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3gqpg9r8ue] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-3gqpg9r8ue] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-3gqpg9r8ue] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-3gqpg9r8ue] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-3gqpg9r8ue] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3gqpg9r8ue] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3gqpg9r8ue] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3gqpg9r8ue] { filter: brightness(1.1); }
.btn-outline[b-3gqpg9r8ue] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-3gqpg9r8ue] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-3gqpg9r8ue] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-3gqpg9r8ue] { filter: brightness(1.1); }
.btn-icon[b-3gqpg9r8ue] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-3gqpg9r8ue] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-3gqpg9r8ue] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-3gqpg9r8ue] { color: #ef4444; }
.btn-delete:hover[b-3gqpg9r8ue] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-3gqpg9r8ue] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3gqpg9r8ue] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-3gqpg9r8ue] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-3gqpg9r8ue] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-3gqpg9r8ue] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-3gqpg9r8ue] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-3gqpg9r8ue] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-3gqpg9r8ue] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-3gqpg9r8ue] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-3gqpg9r8ue] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-3gqpg9r8ue] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-3gqpg9r8ue] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-3gqpg9r8ue] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-3gqpg9r8ue] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-3gqpg9r8ue] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-3gqpg9r8ue] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-3gqpg9r8ue] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-3gqpg9r8ue] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-3gqpg9r8ue] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-3gqpg9r8ue] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-3gqpg9r8ue] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-3gqpg9r8ue] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-3gqpg9r8ue] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-3gqpg9r8ue] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-3gqpg9r8ue] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-3gqpg9r8ue] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-3gqpg9r8ue] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-3gqpg9r8ue] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-3gqpg9r8ue] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-3gqpg9r8ue] { display: block; }
.hide-on-cards[b-3gqpg9r8ue] { display: none !important; }
.show-on-cards[b-3gqpg9r8ue] { display: grid; }
.hide-on-grid[b-3gqpg9r8ue] { display: none !important; }

/* Badges */
.badge[b-3gqpg9r8ue] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3gqpg9r8ue] { background: #ecfdf5; color: #065f46; }
.badge-no[b-3gqpg9r8ue] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-3gqpg9r8ue] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-3gqpg9r8ue] { text-align: center; }
.text-muted[b-3gqpg9r8ue] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-3gqpg9r8ue], .crud-empty-state[b-3gqpg9r8ue] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-3gqpg9r8ue] { font-size: 2rem; }
.crud-spinner[b-3gqpg9r8ue] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-3gqpg9r8ue 0.6s linear infinite; }
.crud-spinner-sm[b-3gqpg9r8ue] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3gqpg9r8ue 0.6s linear infinite; }
@keyframes spin-b-3gqpg9r8ue { to { transform: rotate(360deg); } }
.spin[b-3gqpg9r8ue] { animation: spin-b-3gqpg9r8ue 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-3gqpg9r8ue] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-3gqpg9r8ue 0.15s ease-out; }
.modal-container[b-3gqpg9r8ue] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-3gqpg9r8ue] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-3gqpg9r8ue 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-3gqpg9r8ue] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-3gqpg9r8ue] { max-width: 420px; }
@keyframes fadeIn-b-3gqpg9r8ue { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-3gqpg9r8ue { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-3gqpg9r8ue] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-3gqpg9r8ue] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-3gqpg9r8ue] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-3gqpg9r8ue] { color: #dc2626; }
.modal-close[b-3gqpg9r8ue] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-3gqpg9r8ue] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-3gqpg9r8ue] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-3gqpg9r8ue] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-3gqpg9r8ue] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-3gqpg9r8ue] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-3gqpg9r8ue] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-3gqpg9r8ue] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-3gqpg9r8ue] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-3gqpg9r8ue] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-3gqpg9r8ue] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3gqpg9r8ue] { flex: 2; }
.form-group label[b-3gqpg9r8ue] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3gqpg9r8ue], .form-group select[b-3gqpg9r8ue], .form-textarea[b-3gqpg9r8ue] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3gqpg9r8ue], .form-group select:focus[b-3gqpg9r8ue], .form-textarea:focus[b-3gqpg9r8ue] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-3gqpg9r8ue] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-3gqpg9r8ue] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-3gqpg9r8ue] { flex: 1; display: flex; align-items: center; }
.form-check[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-3gqpg9r8ue] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-3gqpg9r8ue] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-3gqpg9r8ue] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-3gqpg9r8ue] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-3gqpg9r8ue] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-3gqpg9r8ue] { font-size: 3rem; }
.photo-placeholder span[b-3gqpg9r8ue] { font-size: 0.78rem; }
.photo-actions[b-3gqpg9r8ue] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-3gqpg9r8ue] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-3gqpg9r8ue] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-3gqpg9r8ue] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-3gqpg9r8ue] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-3gqpg9r8ue] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-3gqpg9r8ue] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-3gqpg9r8ue] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-3gqpg9r8ue] { filter: brightness(1.15); transform: scale(1.05); }
[b-3gqpg9r8ue] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-3gqpg9r8ue] { padding: 0.75rem; }
    .crud-header[b-3gqpg9r8ue] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-3gqpg9r8ue] { font-size: 1.1rem; }
    .btn-text[b-3gqpg9r8ue] { display: none; }
    .form-row[b-3gqpg9r8ue] { flex-direction: column; }
    .form-row-4[b-3gqpg9r8ue] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-3gqpg9r8ue] { width: 98%; max-height: 95vh; }
    .modal-lg[b-3gqpg9r8ue] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-3gqpg9r8ue] { padding: 0.75rem; }
    .modal-tabs[b-3gqpg9r8ue] { overflow-x: auto; }
    .modal-tab[b-3gqpg9r8ue] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-3gqpg9r8ue] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-3gqpg9r8ue] { display: grid !important; }
    .crud-cards-wrapper[b-3gqpg9r8ue] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-3gqpg9r8ue] { grid-template-columns: 1fr; }
    .card-details[b-3gqpg9r8ue] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-3gqpg9r8ue] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-3gqpg9r8ue] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-3gqpg9r8ue] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-3gqpg9r8ue] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmaplicacionnovedades.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-lsvluwpeox] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-lsvluwpeox 0.3s ease-out; }
@keyframes slideUp-b-lsvluwpeox { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-lsvluwpeox] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-lsvluwpeox] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-lsvluwpeox] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-lsvluwpeox] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-lsvluwpeox] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-lsvluwpeox] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-lsvluwpeox] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-lsvluwpeox] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-lsvluwpeox] { filter: brightness(1.1); }
.btn-outline[b-lsvluwpeox] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-lsvluwpeox] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-lsvluwpeox] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-lsvluwpeox] { filter: brightness(1.1); }
.btn-icon[b-lsvluwpeox] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-lsvluwpeox] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-lsvluwpeox] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-lsvluwpeox] { color: #ef4444; }
.btn-delete:hover[b-lsvluwpeox] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-lsvluwpeox] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-lsvluwpeox] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-lsvluwpeox] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-lsvluwpeox] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-lsvluwpeox] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-lsvluwpeox] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-lsvluwpeox] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-lsvluwpeox] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-lsvluwpeox] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-lsvluwpeox] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-lsvluwpeox] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-lsvluwpeox] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-lsvluwpeox] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-lsvluwpeox] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-lsvluwpeox] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-lsvluwpeox] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-lsvluwpeox] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-lsvluwpeox] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-lsvluwpeox] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-lsvluwpeox] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-lsvluwpeox] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-lsvluwpeox] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-lsvluwpeox] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-lsvluwpeox] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-lsvluwpeox] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-lsvluwpeox] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-lsvluwpeox] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-lsvluwpeox] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-lsvluwpeox] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-lsvluwpeox] { display: block; }
.hide-on-cards[b-lsvluwpeox] { display: none !important; }
.show-on-cards[b-lsvluwpeox] { display: grid; }
.hide-on-grid[b-lsvluwpeox] { display: none !important; }

/* Badges */
.badge[b-lsvluwpeox] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-lsvluwpeox] { background: #ecfdf5; color: #065f46; }
.badge-no[b-lsvluwpeox] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-lsvluwpeox] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-lsvluwpeox] { text-align: center; }
.text-muted[b-lsvluwpeox] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-lsvluwpeox], .crud-empty-state[b-lsvluwpeox] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-lsvluwpeox] { font-size: 2rem; }
.crud-spinner[b-lsvluwpeox] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-lsvluwpeox 0.6s linear infinite; }
.crud-spinner-sm[b-lsvluwpeox] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-lsvluwpeox 0.6s linear infinite; }
@keyframes spin-b-lsvluwpeox { to { transform: rotate(360deg); } }
.spin[b-lsvluwpeox] { animation: spin-b-lsvluwpeox 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-lsvluwpeox] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-lsvluwpeox 0.15s ease-out; }
.modal-container[b-lsvluwpeox] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-lsvluwpeox] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-lsvluwpeox 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-lsvluwpeox] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-lsvluwpeox] { max-width: 420px; }
@keyframes fadeIn-b-lsvluwpeox { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-lsvluwpeox { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-lsvluwpeox] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-lsvluwpeox] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-lsvluwpeox] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-lsvluwpeox] { color: #dc2626; }
.modal-close[b-lsvluwpeox] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-lsvluwpeox] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-lsvluwpeox] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-lsvluwpeox] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-lsvluwpeox] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-lsvluwpeox] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-lsvluwpeox] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-lsvluwpeox] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-lsvluwpeox] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-lsvluwpeox] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-lsvluwpeox] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-lsvluwpeox] { flex: 2; }
.form-group label[b-lsvluwpeox] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-lsvluwpeox], .form-group select[b-lsvluwpeox], .form-textarea[b-lsvluwpeox] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-lsvluwpeox], .form-group select:focus[b-lsvluwpeox], .form-textarea:focus[b-lsvluwpeox] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-lsvluwpeox] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-lsvluwpeox] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-lsvluwpeox] { flex: 1; display: flex; align-items: center; }
.form-check[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-lsvluwpeox] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-lsvluwpeox] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-lsvluwpeox] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-lsvluwpeox] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-lsvluwpeox] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-lsvluwpeox] { font-size: 3rem; }
.photo-placeholder span[b-lsvluwpeox] { font-size: 0.78rem; }
.photo-actions[b-lsvluwpeox] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-lsvluwpeox] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-lsvluwpeox] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-lsvluwpeox] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-lsvluwpeox] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-lsvluwpeox] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-lsvluwpeox] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-lsvluwpeox] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-lsvluwpeox] { filter: brightness(1.15); transform: scale(1.05); }
[b-lsvluwpeox] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-lsvluwpeox] { padding: 0.75rem; }
    .crud-header[b-lsvluwpeox] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-lsvluwpeox] { font-size: 1.1rem; }
    .btn-text[b-lsvluwpeox] { display: none; }
    .form-row[b-lsvluwpeox] { flex-direction: column; }
    .form-row-4[b-lsvluwpeox] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-lsvluwpeox] { width: 98%; max-height: 95vh; }
    .modal-lg[b-lsvluwpeox] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-lsvluwpeox] { padding: 0.75rem; }
    .modal-tabs[b-lsvluwpeox] { overflow-x: auto; }
    .modal-tab[b-lsvluwpeox] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-lsvluwpeox] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-lsvluwpeox] { display: grid !important; }
    .crud-cards-wrapper[b-lsvluwpeox] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-lsvluwpeox] { grid-template-columns: 1fr; }
    .card-details[b-lsvluwpeox] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-lsvluwpeox] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-lsvluwpeox] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-lsvluwpeox] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-lsvluwpeox] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmenlazarusuariozonaclienteynomina.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vk4apsryeg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vk4apsryeg 0.3s ease-out; }
@keyframes slideUp-b-vk4apsryeg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vk4apsryeg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vk4apsryeg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vk4apsryeg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vk4apsryeg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vk4apsryeg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vk4apsryeg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vk4apsryeg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vk4apsryeg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vk4apsryeg] { filter: brightness(1.1); }
.btn-outline[b-vk4apsryeg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vk4apsryeg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vk4apsryeg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vk4apsryeg] { filter: brightness(1.1); }
.btn-icon[b-vk4apsryeg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vk4apsryeg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vk4apsryeg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vk4apsryeg] { color: #ef4444; }
.btn-delete:hover[b-vk4apsryeg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vk4apsryeg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vk4apsryeg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vk4apsryeg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vk4apsryeg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vk4apsryeg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vk4apsryeg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vk4apsryeg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vk4apsryeg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vk4apsryeg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vk4apsryeg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vk4apsryeg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vk4apsryeg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vk4apsryeg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vk4apsryeg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vk4apsryeg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vk4apsryeg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vk4apsryeg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vk4apsryeg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vk4apsryeg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vk4apsryeg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vk4apsryeg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vk4apsryeg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vk4apsryeg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vk4apsryeg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vk4apsryeg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vk4apsryeg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vk4apsryeg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vk4apsryeg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vk4apsryeg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vk4apsryeg] { display: block; }
.hide-on-cards[b-vk4apsryeg] { display: none !important; }
.show-on-cards[b-vk4apsryeg] { display: grid; }
.hide-on-grid[b-vk4apsryeg] { display: none !important; }

/* Badges */
.badge[b-vk4apsryeg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vk4apsryeg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vk4apsryeg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vk4apsryeg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vk4apsryeg] { text-align: center; }
.text-muted[b-vk4apsryeg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vk4apsryeg], .crud-empty-state[b-vk4apsryeg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vk4apsryeg] { font-size: 2rem; }
.crud-spinner[b-vk4apsryeg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vk4apsryeg 0.6s linear infinite; }
.crud-spinner-sm[b-vk4apsryeg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vk4apsryeg 0.6s linear infinite; }
@keyframes spin-b-vk4apsryeg { to { transform: rotate(360deg); } }
.spin[b-vk4apsryeg] { animation: spin-b-vk4apsryeg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vk4apsryeg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vk4apsryeg 0.15s ease-out; }
.modal-container[b-vk4apsryeg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vk4apsryeg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vk4apsryeg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vk4apsryeg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vk4apsryeg] { max-width: 420px; }
@keyframes fadeIn-b-vk4apsryeg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vk4apsryeg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vk4apsryeg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vk4apsryeg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vk4apsryeg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vk4apsryeg] { color: #dc2626; }
.modal-close[b-vk4apsryeg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vk4apsryeg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vk4apsryeg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vk4apsryeg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vk4apsryeg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vk4apsryeg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vk4apsryeg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vk4apsryeg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vk4apsryeg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vk4apsryeg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vk4apsryeg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vk4apsryeg] { flex: 2; }
.form-group label[b-vk4apsryeg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vk4apsryeg], .form-group select[b-vk4apsryeg], .form-textarea[b-vk4apsryeg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vk4apsryeg], .form-group select:focus[b-vk4apsryeg], .form-textarea:focus[b-vk4apsryeg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vk4apsryeg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vk4apsryeg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vk4apsryeg] { flex: 1; display: flex; align-items: center; }
.form-check[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vk4apsryeg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vk4apsryeg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vk4apsryeg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vk4apsryeg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vk4apsryeg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vk4apsryeg] { font-size: 3rem; }
.photo-placeholder span[b-vk4apsryeg] { font-size: 0.78rem; }
.photo-actions[b-vk4apsryeg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vk4apsryeg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vk4apsryeg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vk4apsryeg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vk4apsryeg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vk4apsryeg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vk4apsryeg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vk4apsryeg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vk4apsryeg] { filter: brightness(1.15); transform: scale(1.05); }
[b-vk4apsryeg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vk4apsryeg] { padding: 0.75rem; }
    .crud-header[b-vk4apsryeg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vk4apsryeg] { font-size: 1.1rem; }
    .btn-text[b-vk4apsryeg] { display: none; }
    .form-row[b-vk4apsryeg] { flex-direction: column; }
    .form-row-4[b-vk4apsryeg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vk4apsryeg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vk4apsryeg] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vk4apsryeg] { padding: 0.75rem; }
    .modal-tabs[b-vk4apsryeg] { overflow-x: auto; }
    .modal-tab[b-vk4apsryeg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vk4apsryeg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vk4apsryeg] { display: grid !important; }
    .crud-cards-wrapper[b-vk4apsryeg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vk4apsryeg] { grid-template-columns: 1fr; }
    .card-details[b-vk4apsryeg] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vk4apsryeg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vk4apsryeg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vk4apsryeg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vk4apsryeg] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmgruponomina.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zx9oqx8ak5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zx9oqx8ak5 0.3s ease-out; }
@keyframes slideUp-b-zx9oqx8ak5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zx9oqx8ak5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zx9oqx8ak5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zx9oqx8ak5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zx9oqx8ak5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zx9oqx8ak5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zx9oqx8ak5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zx9oqx8ak5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zx9oqx8ak5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zx9oqx8ak5] { filter: brightness(1.1); }
.btn-outline[b-zx9oqx8ak5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zx9oqx8ak5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zx9oqx8ak5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zx9oqx8ak5] { filter: brightness(1.1); }
.btn-icon[b-zx9oqx8ak5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zx9oqx8ak5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zx9oqx8ak5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zx9oqx8ak5] { color: #ef4444; }
.btn-delete:hover[b-zx9oqx8ak5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zx9oqx8ak5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zx9oqx8ak5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zx9oqx8ak5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zx9oqx8ak5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zx9oqx8ak5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zx9oqx8ak5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zx9oqx8ak5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zx9oqx8ak5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zx9oqx8ak5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zx9oqx8ak5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zx9oqx8ak5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zx9oqx8ak5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zx9oqx8ak5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zx9oqx8ak5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zx9oqx8ak5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zx9oqx8ak5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zx9oqx8ak5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zx9oqx8ak5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zx9oqx8ak5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zx9oqx8ak5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zx9oqx8ak5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zx9oqx8ak5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zx9oqx8ak5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zx9oqx8ak5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zx9oqx8ak5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zx9oqx8ak5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zx9oqx8ak5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zx9oqx8ak5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zx9oqx8ak5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zx9oqx8ak5] { display: block; }
.hide-on-cards[b-zx9oqx8ak5] { display: none !important; }
.show-on-cards[b-zx9oqx8ak5] { display: grid; }
.hide-on-grid[b-zx9oqx8ak5] { display: none !important; }

/* Badges */
.badge[b-zx9oqx8ak5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zx9oqx8ak5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zx9oqx8ak5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zx9oqx8ak5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zx9oqx8ak5] { text-align: center; }
.text-muted[b-zx9oqx8ak5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zx9oqx8ak5], .crud-empty-state[b-zx9oqx8ak5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zx9oqx8ak5] { font-size: 2rem; }
.crud-spinner[b-zx9oqx8ak5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zx9oqx8ak5 0.6s linear infinite; }
.crud-spinner-sm[b-zx9oqx8ak5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zx9oqx8ak5 0.6s linear infinite; }
@keyframes spin-b-zx9oqx8ak5 { to { transform: rotate(360deg); } }
.spin[b-zx9oqx8ak5] { animation: spin-b-zx9oqx8ak5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zx9oqx8ak5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zx9oqx8ak5 0.15s ease-out; }
.modal-container[b-zx9oqx8ak5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zx9oqx8ak5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zx9oqx8ak5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zx9oqx8ak5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zx9oqx8ak5] { max-width: 420px; }
@keyframes fadeIn-b-zx9oqx8ak5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zx9oqx8ak5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zx9oqx8ak5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zx9oqx8ak5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zx9oqx8ak5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zx9oqx8ak5] { color: #dc2626; }
.modal-close[b-zx9oqx8ak5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zx9oqx8ak5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zx9oqx8ak5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zx9oqx8ak5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zx9oqx8ak5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zx9oqx8ak5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zx9oqx8ak5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zx9oqx8ak5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zx9oqx8ak5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zx9oqx8ak5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zx9oqx8ak5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zx9oqx8ak5] { flex: 2; }
.form-group label[b-zx9oqx8ak5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zx9oqx8ak5], .form-group select[b-zx9oqx8ak5], .form-textarea[b-zx9oqx8ak5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zx9oqx8ak5], .form-group select:focus[b-zx9oqx8ak5], .form-textarea:focus[b-zx9oqx8ak5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zx9oqx8ak5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zx9oqx8ak5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zx9oqx8ak5] { flex: 1; display: flex; align-items: center; }
.form-check[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zx9oqx8ak5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zx9oqx8ak5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zx9oqx8ak5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zx9oqx8ak5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zx9oqx8ak5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zx9oqx8ak5] { font-size: 3rem; }
.photo-placeholder span[b-zx9oqx8ak5] { font-size: 0.78rem; }
.photo-actions[b-zx9oqx8ak5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zx9oqx8ak5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zx9oqx8ak5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zx9oqx8ak5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zx9oqx8ak5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zx9oqx8ak5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zx9oqx8ak5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zx9oqx8ak5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zx9oqx8ak5] { filter: brightness(1.15); transform: scale(1.05); }
[b-zx9oqx8ak5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zx9oqx8ak5] { padding: 0.75rem; }
    .crud-header[b-zx9oqx8ak5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zx9oqx8ak5] { font-size: 1.1rem; }
    .btn-text[b-zx9oqx8ak5] { display: none; }
    .form-row[b-zx9oqx8ak5] { flex-direction: column; }
    .form-row-4[b-zx9oqx8ak5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zx9oqx8ak5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zx9oqx8ak5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zx9oqx8ak5] { padding: 0.75rem; }
    .modal-tabs[b-zx9oqx8ak5] { overflow-x: auto; }
    .modal-tab[b-zx9oqx8ak5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zx9oqx8ak5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zx9oqx8ak5] { display: grid !important; }
    .crud-cards-wrapper[b-zx9oqx8ak5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zx9oqx8ak5] { grid-template-columns: 1fr; }
    .card-details[b-zx9oqx8ak5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zx9oqx8ak5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zx9oqx8ak5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zx9oqx8ak5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zx9oqx8ak5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominaenlazarauxiliarempleado.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yjx6uswimd] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yjx6uswimd 0.3s ease-out; }
@keyframes slideUp-b-yjx6uswimd { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yjx6uswimd] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yjx6uswimd] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yjx6uswimd] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yjx6uswimd] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yjx6uswimd] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yjx6uswimd] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yjx6uswimd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yjx6uswimd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yjx6uswimd] { filter: brightness(1.1); }
.btn-outline[b-yjx6uswimd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yjx6uswimd] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yjx6uswimd] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yjx6uswimd] { filter: brightness(1.1); }
.btn-icon[b-yjx6uswimd] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yjx6uswimd] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yjx6uswimd] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yjx6uswimd] { color: #ef4444; }
.btn-delete:hover[b-yjx6uswimd] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yjx6uswimd] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yjx6uswimd] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yjx6uswimd] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yjx6uswimd] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yjx6uswimd] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yjx6uswimd] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yjx6uswimd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yjx6uswimd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yjx6uswimd] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yjx6uswimd] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yjx6uswimd] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yjx6uswimd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yjx6uswimd] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yjx6uswimd] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yjx6uswimd] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yjx6uswimd] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yjx6uswimd] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yjx6uswimd] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yjx6uswimd] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yjx6uswimd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yjx6uswimd] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yjx6uswimd] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yjx6uswimd] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yjx6uswimd] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yjx6uswimd] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yjx6uswimd] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yjx6uswimd] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yjx6uswimd] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yjx6uswimd] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yjx6uswimd] { display: block; }
.hide-on-cards[b-yjx6uswimd] { display: none !important; }
.show-on-cards[b-yjx6uswimd] { display: grid; }
.hide-on-grid[b-yjx6uswimd] { display: none !important; }

/* Badges */
.badge[b-yjx6uswimd] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yjx6uswimd] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yjx6uswimd] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yjx6uswimd] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yjx6uswimd] { text-align: center; }
.text-muted[b-yjx6uswimd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yjx6uswimd], .crud-empty-state[b-yjx6uswimd] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yjx6uswimd] { font-size: 2rem; }
.crud-spinner[b-yjx6uswimd] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yjx6uswimd 0.6s linear infinite; }
.crud-spinner-sm[b-yjx6uswimd] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yjx6uswimd 0.6s linear infinite; }
@keyframes spin-b-yjx6uswimd { to { transform: rotate(360deg); } }
.spin[b-yjx6uswimd] { animation: spin-b-yjx6uswimd 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yjx6uswimd] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yjx6uswimd 0.15s ease-out; }
.modal-container[b-yjx6uswimd] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yjx6uswimd] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yjx6uswimd 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yjx6uswimd] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yjx6uswimd] { max-width: 420px; }
@keyframes fadeIn-b-yjx6uswimd { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yjx6uswimd { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yjx6uswimd] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yjx6uswimd] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yjx6uswimd] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yjx6uswimd] { color: #dc2626; }
.modal-close[b-yjx6uswimd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yjx6uswimd] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yjx6uswimd] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yjx6uswimd] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yjx6uswimd] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yjx6uswimd] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yjx6uswimd] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yjx6uswimd] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yjx6uswimd] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yjx6uswimd] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yjx6uswimd] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yjx6uswimd] { flex: 2; }
.form-group label[b-yjx6uswimd] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yjx6uswimd], .form-group select[b-yjx6uswimd], .form-textarea[b-yjx6uswimd] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yjx6uswimd], .form-group select:focus[b-yjx6uswimd], .form-textarea:focus[b-yjx6uswimd] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yjx6uswimd] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yjx6uswimd] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yjx6uswimd] { flex: 1; display: flex; align-items: center; }
.form-check[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yjx6uswimd] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yjx6uswimd] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yjx6uswimd] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yjx6uswimd] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yjx6uswimd] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yjx6uswimd] { font-size: 3rem; }
.photo-placeholder span[b-yjx6uswimd] { font-size: 0.78rem; }
.photo-actions[b-yjx6uswimd] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yjx6uswimd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yjx6uswimd] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yjx6uswimd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yjx6uswimd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yjx6uswimd] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yjx6uswimd] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yjx6uswimd] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yjx6uswimd] { filter: brightness(1.15); transform: scale(1.05); }
[b-yjx6uswimd] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yjx6uswimd] { padding: 0.75rem; }
    .crud-header[b-yjx6uswimd] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yjx6uswimd] { font-size: 1.1rem; }
    .btn-text[b-yjx6uswimd] { display: none; }
    .form-row[b-yjx6uswimd] { flex-direction: column; }
    .form-row-4[b-yjx6uswimd] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yjx6uswimd] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yjx6uswimd] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yjx6uswimd] { padding: 0.75rem; }
    .modal-tabs[b-yjx6uswimd] { overflow-x: auto; }
    .modal-tab[b-yjx6uswimd] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yjx6uswimd] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yjx6uswimd] { display: grid !important; }
    .crud-cards-wrapper[b-yjx6uswimd] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yjx6uswimd] { grid-template-columns: 1fr; }
    .card-details[b-yjx6uswimd] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yjx6uswimd] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yjx6uswimd] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yjx6uswimd] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yjx6uswimd] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominahoratrabajadasplantilla.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4w3ryq6zl3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4w3ryq6zl3 0.3s ease-out; }
@keyframes slideUp-b-4w3ryq6zl3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4w3ryq6zl3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4w3ryq6zl3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4w3ryq6zl3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4w3ryq6zl3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4w3ryq6zl3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4w3ryq6zl3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4w3ryq6zl3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4w3ryq6zl3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4w3ryq6zl3] { filter: brightness(1.1); }
.btn-outline[b-4w3ryq6zl3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4w3ryq6zl3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4w3ryq6zl3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4w3ryq6zl3] { filter: brightness(1.1); }
.btn-icon[b-4w3ryq6zl3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4w3ryq6zl3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4w3ryq6zl3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4w3ryq6zl3] { color: #ef4444; }
.btn-delete:hover[b-4w3ryq6zl3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4w3ryq6zl3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4w3ryq6zl3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4w3ryq6zl3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4w3ryq6zl3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4w3ryq6zl3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4w3ryq6zl3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4w3ryq6zl3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4w3ryq6zl3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4w3ryq6zl3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4w3ryq6zl3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4w3ryq6zl3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4w3ryq6zl3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4w3ryq6zl3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4w3ryq6zl3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4w3ryq6zl3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4w3ryq6zl3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4w3ryq6zl3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4w3ryq6zl3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4w3ryq6zl3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4w3ryq6zl3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4w3ryq6zl3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4w3ryq6zl3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4w3ryq6zl3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4w3ryq6zl3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4w3ryq6zl3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4w3ryq6zl3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4w3ryq6zl3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4w3ryq6zl3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4w3ryq6zl3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4w3ryq6zl3] { display: block; }
.hide-on-cards[b-4w3ryq6zl3] { display: none !important; }
.show-on-cards[b-4w3ryq6zl3] { display: grid; }
.hide-on-grid[b-4w3ryq6zl3] { display: none !important; }

/* Badges */
.badge[b-4w3ryq6zl3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4w3ryq6zl3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4w3ryq6zl3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4w3ryq6zl3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4w3ryq6zl3] { text-align: center; }
.text-muted[b-4w3ryq6zl3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4w3ryq6zl3], .crud-empty-state[b-4w3ryq6zl3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4w3ryq6zl3] { font-size: 2rem; }
.crud-spinner[b-4w3ryq6zl3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4w3ryq6zl3 0.6s linear infinite; }
.crud-spinner-sm[b-4w3ryq6zl3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4w3ryq6zl3 0.6s linear infinite; }
@keyframes spin-b-4w3ryq6zl3 { to { transform: rotate(360deg); } }
.spin[b-4w3ryq6zl3] { animation: spin-b-4w3ryq6zl3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4w3ryq6zl3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4w3ryq6zl3 0.15s ease-out; }
.modal-container[b-4w3ryq6zl3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4w3ryq6zl3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4w3ryq6zl3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4w3ryq6zl3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4w3ryq6zl3] { max-width: 420px; }
@keyframes fadeIn-b-4w3ryq6zl3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4w3ryq6zl3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4w3ryq6zl3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4w3ryq6zl3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4w3ryq6zl3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4w3ryq6zl3] { color: #dc2626; }
.modal-close[b-4w3ryq6zl3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4w3ryq6zl3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4w3ryq6zl3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4w3ryq6zl3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4w3ryq6zl3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4w3ryq6zl3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4w3ryq6zl3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4w3ryq6zl3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4w3ryq6zl3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4w3ryq6zl3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4w3ryq6zl3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4w3ryq6zl3] { flex: 2; }
.form-group label[b-4w3ryq6zl3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4w3ryq6zl3], .form-group select[b-4w3ryq6zl3], .form-textarea[b-4w3ryq6zl3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4w3ryq6zl3], .form-group select:focus[b-4w3ryq6zl3], .form-textarea:focus[b-4w3ryq6zl3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4w3ryq6zl3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4w3ryq6zl3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4w3ryq6zl3] { flex: 1; display: flex; align-items: center; }
.form-check[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4w3ryq6zl3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4w3ryq6zl3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4w3ryq6zl3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4w3ryq6zl3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4w3ryq6zl3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4w3ryq6zl3] { font-size: 3rem; }
.photo-placeholder span[b-4w3ryq6zl3] { font-size: 0.78rem; }
.photo-actions[b-4w3ryq6zl3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4w3ryq6zl3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4w3ryq6zl3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4w3ryq6zl3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4w3ryq6zl3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4w3ryq6zl3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4w3ryq6zl3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4w3ryq6zl3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4w3ryq6zl3] { filter: brightness(1.15); transform: scale(1.05); }
[b-4w3ryq6zl3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4w3ryq6zl3] { padding: 0.75rem; }
    .crud-header[b-4w3ryq6zl3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4w3ryq6zl3] { font-size: 1.1rem; }
    .btn-text[b-4w3ryq6zl3] { display: none; }
    .form-row[b-4w3ryq6zl3] { flex-direction: column; }
    .form-row-4[b-4w3ryq6zl3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4w3ryq6zl3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4w3ryq6zl3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4w3ryq6zl3] { padding: 0.75rem; }
    .modal-tabs[b-4w3ryq6zl3] { overflow-x: auto; }
    .modal-tab[b-4w3ryq6zl3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4w3ryq6zl3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4w3ryq6zl3] { display: grid !important; }
    .crud-cards-wrapper[b-4w3ryq6zl3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4w3ryq6zl3] { grid-template-columns: 1fr; }
    .card-details[b-4w3ryq6zl3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4w3ryq6zl3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4w3ryq6zl3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4w3ryq6zl3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4w3ryq6zl3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominamaestradepartamento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qq5d84yi8s] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qq5d84yi8s 0.3s ease-out; }
@keyframes slideUp-b-qq5d84yi8s { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qq5d84yi8s] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qq5d84yi8s] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qq5d84yi8s] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qq5d84yi8s] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qq5d84yi8s] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qq5d84yi8s] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qq5d84yi8s] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qq5d84yi8s] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qq5d84yi8s] { filter: brightness(1.1); }
.btn-outline[b-qq5d84yi8s] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qq5d84yi8s] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qq5d84yi8s] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qq5d84yi8s] { filter: brightness(1.1); }
.btn-icon[b-qq5d84yi8s] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qq5d84yi8s] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qq5d84yi8s] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qq5d84yi8s] { color: #ef4444; }
.btn-delete:hover[b-qq5d84yi8s] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qq5d84yi8s] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qq5d84yi8s] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qq5d84yi8s] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qq5d84yi8s] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qq5d84yi8s] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qq5d84yi8s] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qq5d84yi8s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qq5d84yi8s] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qq5d84yi8s] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qq5d84yi8s] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qq5d84yi8s] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qq5d84yi8s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qq5d84yi8s] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qq5d84yi8s] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qq5d84yi8s] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qq5d84yi8s] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qq5d84yi8s] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qq5d84yi8s] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qq5d84yi8s] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qq5d84yi8s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qq5d84yi8s] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qq5d84yi8s] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qq5d84yi8s] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qq5d84yi8s] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qq5d84yi8s] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qq5d84yi8s] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qq5d84yi8s] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qq5d84yi8s] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qq5d84yi8s] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qq5d84yi8s] { display: block; }
.hide-on-cards[b-qq5d84yi8s] { display: none !important; }
.show-on-cards[b-qq5d84yi8s] { display: grid; }
.hide-on-grid[b-qq5d84yi8s] { display: none !important; }

/* Badges */
.badge[b-qq5d84yi8s] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qq5d84yi8s] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qq5d84yi8s] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qq5d84yi8s] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qq5d84yi8s] { text-align: center; }
.text-muted[b-qq5d84yi8s] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qq5d84yi8s], .crud-empty-state[b-qq5d84yi8s] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qq5d84yi8s] { font-size: 2rem; }
.crud-spinner[b-qq5d84yi8s] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qq5d84yi8s 0.6s linear infinite; }
.crud-spinner-sm[b-qq5d84yi8s] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qq5d84yi8s 0.6s linear infinite; }
@keyframes spin-b-qq5d84yi8s { to { transform: rotate(360deg); } }
.spin[b-qq5d84yi8s] { animation: spin-b-qq5d84yi8s 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qq5d84yi8s] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qq5d84yi8s 0.15s ease-out; }
.modal-container[b-qq5d84yi8s] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qq5d84yi8s] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qq5d84yi8s 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qq5d84yi8s] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qq5d84yi8s] { max-width: 420px; }
@keyframes fadeIn-b-qq5d84yi8s { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qq5d84yi8s { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qq5d84yi8s] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qq5d84yi8s] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qq5d84yi8s] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qq5d84yi8s] { color: #dc2626; }
.modal-close[b-qq5d84yi8s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qq5d84yi8s] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qq5d84yi8s] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qq5d84yi8s] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qq5d84yi8s] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qq5d84yi8s] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qq5d84yi8s] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qq5d84yi8s] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qq5d84yi8s] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qq5d84yi8s] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qq5d84yi8s] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qq5d84yi8s] { flex: 2; }
.form-group label[b-qq5d84yi8s] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qq5d84yi8s], .form-group select[b-qq5d84yi8s], .form-textarea[b-qq5d84yi8s] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qq5d84yi8s], .form-group select:focus[b-qq5d84yi8s], .form-textarea:focus[b-qq5d84yi8s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qq5d84yi8s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qq5d84yi8s] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qq5d84yi8s] { flex: 1; display: flex; align-items: center; }
.form-check[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qq5d84yi8s] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qq5d84yi8s] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qq5d84yi8s] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qq5d84yi8s] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qq5d84yi8s] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qq5d84yi8s] { font-size: 3rem; }
.photo-placeholder span[b-qq5d84yi8s] { font-size: 0.78rem; }
.photo-actions[b-qq5d84yi8s] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qq5d84yi8s] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qq5d84yi8s] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qq5d84yi8s] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qq5d84yi8s] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qq5d84yi8s] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qq5d84yi8s] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qq5d84yi8s] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qq5d84yi8s] { filter: brightness(1.15); transform: scale(1.05); }
[b-qq5d84yi8s] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qq5d84yi8s] { padding: 0.75rem; }
    .crud-header[b-qq5d84yi8s] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qq5d84yi8s] { font-size: 1.1rem; }
    .btn-text[b-qq5d84yi8s] { display: none; }
    .form-row[b-qq5d84yi8s] { flex-direction: column; }
    .form-row-4[b-qq5d84yi8s] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qq5d84yi8s] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qq5d84yi8s] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qq5d84yi8s] { padding: 0.75rem; }
    .modal-tabs[b-qq5d84yi8s] { overflow-x: auto; }
    .modal-tab[b-qq5d84yi8s] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qq5d84yi8s] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qq5d84yi8s] { display: grid !important; }
    .crud-cards-wrapper[b-qq5d84yi8s] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qq5d84yi8s] { grid-template-columns: 1fr; }
    .card-details[b-qq5d84yi8s] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qq5d84yi8s] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qq5d84yi8s] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qq5d84yi8s] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qq5d84yi8s] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominamaestrapuesto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kzafuck5dq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kzafuck5dq 0.3s ease-out; }
@keyframes slideUp-b-kzafuck5dq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kzafuck5dq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kzafuck5dq] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kzafuck5dq] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kzafuck5dq] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kzafuck5dq] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kzafuck5dq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kzafuck5dq] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kzafuck5dq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kzafuck5dq] { filter: brightness(1.1); }
.btn-outline[b-kzafuck5dq] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kzafuck5dq] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kzafuck5dq] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kzafuck5dq] { filter: brightness(1.1); }
.btn-icon[b-kzafuck5dq] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kzafuck5dq] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kzafuck5dq] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kzafuck5dq] { color: #ef4444; }
.btn-delete:hover[b-kzafuck5dq] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kzafuck5dq] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kzafuck5dq] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kzafuck5dq] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kzafuck5dq] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kzafuck5dq] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kzafuck5dq] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kzafuck5dq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kzafuck5dq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kzafuck5dq] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kzafuck5dq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kzafuck5dq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kzafuck5dq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kzafuck5dq] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kzafuck5dq] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kzafuck5dq] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kzafuck5dq] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kzafuck5dq] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kzafuck5dq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kzafuck5dq] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kzafuck5dq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kzafuck5dq] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kzafuck5dq] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kzafuck5dq] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kzafuck5dq] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kzafuck5dq] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kzafuck5dq] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kzafuck5dq] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kzafuck5dq] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kzafuck5dq] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kzafuck5dq] { display: block; }
.hide-on-cards[b-kzafuck5dq] { display: none !important; }
.show-on-cards[b-kzafuck5dq] { display: grid; }
.hide-on-grid[b-kzafuck5dq] { display: none !important; }

/* Badges */
.badge[b-kzafuck5dq] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kzafuck5dq] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kzafuck5dq] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kzafuck5dq] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kzafuck5dq] { text-align: center; }
.text-muted[b-kzafuck5dq] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kzafuck5dq], .crud-empty-state[b-kzafuck5dq] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kzafuck5dq] { font-size: 2rem; }
.crud-spinner[b-kzafuck5dq] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kzafuck5dq 0.6s linear infinite; }
.crud-spinner-sm[b-kzafuck5dq] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kzafuck5dq 0.6s linear infinite; }
@keyframes spin-b-kzafuck5dq { to { transform: rotate(360deg); } }
.spin[b-kzafuck5dq] { animation: spin-b-kzafuck5dq 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kzafuck5dq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kzafuck5dq 0.15s ease-out; }
.modal-container[b-kzafuck5dq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kzafuck5dq] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kzafuck5dq 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kzafuck5dq] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kzafuck5dq] { max-width: 420px; }
@keyframes fadeIn-b-kzafuck5dq { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kzafuck5dq { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kzafuck5dq] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kzafuck5dq] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kzafuck5dq] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kzafuck5dq] { color: #dc2626; }
.modal-close[b-kzafuck5dq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kzafuck5dq] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kzafuck5dq] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kzafuck5dq] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kzafuck5dq] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kzafuck5dq] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kzafuck5dq] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kzafuck5dq] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kzafuck5dq] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kzafuck5dq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kzafuck5dq] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kzafuck5dq] { flex: 2; }
.form-group label[b-kzafuck5dq] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kzafuck5dq], .form-group select[b-kzafuck5dq], .form-textarea[b-kzafuck5dq] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kzafuck5dq], .form-group select:focus[b-kzafuck5dq], .form-textarea:focus[b-kzafuck5dq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kzafuck5dq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kzafuck5dq] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kzafuck5dq] { flex: 1; display: flex; align-items: center; }
.form-check[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kzafuck5dq] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kzafuck5dq] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kzafuck5dq] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kzafuck5dq] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kzafuck5dq] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kzafuck5dq] { font-size: 3rem; }
.photo-placeholder span[b-kzafuck5dq] { font-size: 0.78rem; }
.photo-actions[b-kzafuck5dq] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kzafuck5dq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kzafuck5dq] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kzafuck5dq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kzafuck5dq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kzafuck5dq] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kzafuck5dq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kzafuck5dq] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kzafuck5dq] { filter: brightness(1.15); transform: scale(1.05); }
[b-kzafuck5dq] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kzafuck5dq] { padding: 0.75rem; }
    .crud-header[b-kzafuck5dq] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kzafuck5dq] { font-size: 1.1rem; }
    .btn-text[b-kzafuck5dq] { display: none; }
    .form-row[b-kzafuck5dq] { flex-direction: column; }
    .form-row-4[b-kzafuck5dq] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kzafuck5dq] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kzafuck5dq] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kzafuck5dq] { padding: 0.75rem; }
    .modal-tabs[b-kzafuck5dq] { overflow-x: auto; }
    .modal-tab[b-kzafuck5dq] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kzafuck5dq] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kzafuck5dq] { display: grid !important; }
    .crud-cards-wrapper[b-kzafuck5dq] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kzafuck5dq] { grid-template-columns: 1fr; }
    .card-details[b-kzafuck5dq] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kzafuck5dq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kzafuck5dq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kzafuck5dq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kzafuck5dq] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominaparametros.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-n6pr7bzi3f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-n6pr7bzi3f 0.3s ease-out; }
@keyframes slideUp-b-n6pr7bzi3f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-n6pr7bzi3f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-n6pr7bzi3f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-n6pr7bzi3f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-n6pr7bzi3f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-n6pr7bzi3f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-n6pr7bzi3f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-n6pr7bzi3f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-n6pr7bzi3f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-n6pr7bzi3f] { filter: brightness(1.1); }
.btn-outline[b-n6pr7bzi3f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-n6pr7bzi3f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-n6pr7bzi3f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-n6pr7bzi3f] { filter: brightness(1.1); }
.btn-icon[b-n6pr7bzi3f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-n6pr7bzi3f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-n6pr7bzi3f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-n6pr7bzi3f] { color: #ef4444; }
.btn-delete:hover[b-n6pr7bzi3f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-n6pr7bzi3f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-n6pr7bzi3f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-n6pr7bzi3f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-n6pr7bzi3f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-n6pr7bzi3f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-n6pr7bzi3f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-n6pr7bzi3f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-n6pr7bzi3f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-n6pr7bzi3f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-n6pr7bzi3f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-n6pr7bzi3f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-n6pr7bzi3f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-n6pr7bzi3f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-n6pr7bzi3f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-n6pr7bzi3f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-n6pr7bzi3f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-n6pr7bzi3f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-n6pr7bzi3f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-n6pr7bzi3f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-n6pr7bzi3f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-n6pr7bzi3f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-n6pr7bzi3f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-n6pr7bzi3f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-n6pr7bzi3f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-n6pr7bzi3f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-n6pr7bzi3f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-n6pr7bzi3f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-n6pr7bzi3f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-n6pr7bzi3f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-n6pr7bzi3f] { display: block; }
.hide-on-cards[b-n6pr7bzi3f] { display: none !important; }
.show-on-cards[b-n6pr7bzi3f] { display: grid; }
.hide-on-grid[b-n6pr7bzi3f] { display: none !important; }

/* Badges */
.badge[b-n6pr7bzi3f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-n6pr7bzi3f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-n6pr7bzi3f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-n6pr7bzi3f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-n6pr7bzi3f] { text-align: center; }
.text-muted[b-n6pr7bzi3f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-n6pr7bzi3f], .crud-empty-state[b-n6pr7bzi3f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-n6pr7bzi3f] { font-size: 2rem; }
.crud-spinner[b-n6pr7bzi3f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-n6pr7bzi3f 0.6s linear infinite; }
.crud-spinner-sm[b-n6pr7bzi3f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-n6pr7bzi3f 0.6s linear infinite; }
@keyframes spin-b-n6pr7bzi3f { to { transform: rotate(360deg); } }
.spin[b-n6pr7bzi3f] { animation: spin-b-n6pr7bzi3f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-n6pr7bzi3f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-n6pr7bzi3f 0.15s ease-out; }
.modal-container[b-n6pr7bzi3f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-n6pr7bzi3f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-n6pr7bzi3f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-n6pr7bzi3f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-n6pr7bzi3f] { max-width: 420px; }
@keyframes fadeIn-b-n6pr7bzi3f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-n6pr7bzi3f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-n6pr7bzi3f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-n6pr7bzi3f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-n6pr7bzi3f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-n6pr7bzi3f] { color: #dc2626; }
.modal-close[b-n6pr7bzi3f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-n6pr7bzi3f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-n6pr7bzi3f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-n6pr7bzi3f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-n6pr7bzi3f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-n6pr7bzi3f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-n6pr7bzi3f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-n6pr7bzi3f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-n6pr7bzi3f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-n6pr7bzi3f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-n6pr7bzi3f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-n6pr7bzi3f] { flex: 2; }
.form-group label[b-n6pr7bzi3f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-n6pr7bzi3f], .form-group select[b-n6pr7bzi3f], .form-textarea[b-n6pr7bzi3f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-n6pr7bzi3f], .form-group select:focus[b-n6pr7bzi3f], .form-textarea:focus[b-n6pr7bzi3f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-n6pr7bzi3f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-n6pr7bzi3f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-n6pr7bzi3f] { flex: 1; display: flex; align-items: center; }
.form-check[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-n6pr7bzi3f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-n6pr7bzi3f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-n6pr7bzi3f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-n6pr7bzi3f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-n6pr7bzi3f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-n6pr7bzi3f] { font-size: 3rem; }
.photo-placeholder span[b-n6pr7bzi3f] { font-size: 0.78rem; }
.photo-actions[b-n6pr7bzi3f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-n6pr7bzi3f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-n6pr7bzi3f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-n6pr7bzi3f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-n6pr7bzi3f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-n6pr7bzi3f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-n6pr7bzi3f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-n6pr7bzi3f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-n6pr7bzi3f] { filter: brightness(1.15); transform: scale(1.05); }
[b-n6pr7bzi3f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-n6pr7bzi3f] { padding: 0.75rem; }
    .crud-header[b-n6pr7bzi3f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-n6pr7bzi3f] { font-size: 1.1rem; }
    .btn-text[b-n6pr7bzi3f] { display: none; }
    .form-row[b-n6pr7bzi3f] { flex-direction: column; }
    .form-row-4[b-n6pr7bzi3f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-n6pr7bzi3f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-n6pr7bzi3f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-n6pr7bzi3f] { padding: 0.75rem; }
    .modal-tabs[b-n6pr7bzi3f] { overflow-x: auto; }
    .modal-tab[b-n6pr7bzi3f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-n6pr7bzi3f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-n6pr7bzi3f] { display: grid !important; }
    .crud-cards-wrapper[b-n6pr7bzi3f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-n6pr7bzi3f] { grid-template-columns: 1fr; }
    .card-details[b-n6pr7bzi3f] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-n6pr7bzi3f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-n6pr7bzi3f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-n6pr7bzi3f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-n6pr7bzi3f] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominaplantillav2.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vpxfcl6lte] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vpxfcl6lte 0.3s ease-out; }
@keyframes slideUp-b-vpxfcl6lte { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vpxfcl6lte] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vpxfcl6lte] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vpxfcl6lte] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vpxfcl6lte] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vpxfcl6lte] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vpxfcl6lte] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vpxfcl6lte] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vpxfcl6lte] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vpxfcl6lte] { filter: brightness(1.1); }
.btn-outline[b-vpxfcl6lte] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vpxfcl6lte] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vpxfcl6lte] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vpxfcl6lte] { filter: brightness(1.1); }
.btn-icon[b-vpxfcl6lte] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vpxfcl6lte] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vpxfcl6lte] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vpxfcl6lte] { color: #ef4444; }
.btn-delete:hover[b-vpxfcl6lte] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vpxfcl6lte] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vpxfcl6lte] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vpxfcl6lte] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vpxfcl6lte] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vpxfcl6lte] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vpxfcl6lte] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vpxfcl6lte] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vpxfcl6lte] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vpxfcl6lte] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vpxfcl6lte] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vpxfcl6lte] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vpxfcl6lte] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vpxfcl6lte] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vpxfcl6lte] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vpxfcl6lte] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vpxfcl6lte] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vpxfcl6lte] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vpxfcl6lte] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vpxfcl6lte] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vpxfcl6lte] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vpxfcl6lte] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vpxfcl6lte] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vpxfcl6lte] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vpxfcl6lte] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vpxfcl6lte] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vpxfcl6lte] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vpxfcl6lte] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vpxfcl6lte] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vpxfcl6lte] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vpxfcl6lte] { display: block; }
.hide-on-cards[b-vpxfcl6lte] { display: none !important; }
.show-on-cards[b-vpxfcl6lte] { display: grid; }
.hide-on-grid[b-vpxfcl6lte] { display: none !important; }

/* Badges */
.badge[b-vpxfcl6lte] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vpxfcl6lte] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vpxfcl6lte] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vpxfcl6lte] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vpxfcl6lte] { text-align: center; }
.text-muted[b-vpxfcl6lte] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vpxfcl6lte], .crud-empty-state[b-vpxfcl6lte] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vpxfcl6lte] { font-size: 2rem; }
.crud-spinner[b-vpxfcl6lte] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vpxfcl6lte 0.6s linear infinite; }
.crud-spinner-sm[b-vpxfcl6lte] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vpxfcl6lte 0.6s linear infinite; }
@keyframes spin-b-vpxfcl6lte { to { transform: rotate(360deg); } }
.spin[b-vpxfcl6lte] { animation: spin-b-vpxfcl6lte 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vpxfcl6lte] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vpxfcl6lte 0.15s ease-out; }
.modal-container[b-vpxfcl6lte] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vpxfcl6lte] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vpxfcl6lte 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vpxfcl6lte] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vpxfcl6lte] { max-width: 420px; }
@keyframes fadeIn-b-vpxfcl6lte { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vpxfcl6lte { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vpxfcl6lte] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vpxfcl6lte] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vpxfcl6lte] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vpxfcl6lte] { color: #dc2626; }
.modal-close[b-vpxfcl6lte] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vpxfcl6lte] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vpxfcl6lte] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vpxfcl6lte] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vpxfcl6lte] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vpxfcl6lte] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vpxfcl6lte] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vpxfcl6lte] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vpxfcl6lte] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vpxfcl6lte] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vpxfcl6lte] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vpxfcl6lte] { flex: 2; }
.form-group label[b-vpxfcl6lte] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vpxfcl6lte], .form-group select[b-vpxfcl6lte], .form-textarea[b-vpxfcl6lte] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vpxfcl6lte], .form-group select:focus[b-vpxfcl6lte], .form-textarea:focus[b-vpxfcl6lte] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vpxfcl6lte] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vpxfcl6lte] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vpxfcl6lte] { flex: 1; display: flex; align-items: center; }
.form-check[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vpxfcl6lte] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vpxfcl6lte] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vpxfcl6lte] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vpxfcl6lte] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vpxfcl6lte] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vpxfcl6lte] { font-size: 3rem; }
.photo-placeholder span[b-vpxfcl6lte] { font-size: 0.78rem; }
.photo-actions[b-vpxfcl6lte] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vpxfcl6lte] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vpxfcl6lte] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vpxfcl6lte] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vpxfcl6lte] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vpxfcl6lte] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vpxfcl6lte] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vpxfcl6lte] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vpxfcl6lte] { filter: brightness(1.15); transform: scale(1.05); }
[b-vpxfcl6lte] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vpxfcl6lte] { padding: 0.75rem; }
    .crud-header[b-vpxfcl6lte] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vpxfcl6lte] { font-size: 1.1rem; }
    .btn-text[b-vpxfcl6lte] { display: none; }
    .form-row[b-vpxfcl6lte] { flex-direction: column; }
    .form-row-4[b-vpxfcl6lte] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vpxfcl6lte] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vpxfcl6lte] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vpxfcl6lte] { padding: 0.75rem; }
    .modal-tabs[b-vpxfcl6lte] { overflow-x: auto; }
    .modal-tab[b-vpxfcl6lte] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vpxfcl6lte] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vpxfcl6lte] { display: grid !important; }
    .crud-cards-wrapper[b-vpxfcl6lte] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vpxfcl6lte] { grid-template-columns: 1fr; }
    .card-details[b-vpxfcl6lte] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vpxfcl6lte] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vpxfcl6lte] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vpxfcl6lte] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vpxfcl6lte] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnominareportepersonalpornomina.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9qjtvay7x3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9qjtvay7x3 0.3s ease-out; }
@keyframes slideUp-b-9qjtvay7x3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9qjtvay7x3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9qjtvay7x3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9qjtvay7x3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9qjtvay7x3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9qjtvay7x3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9qjtvay7x3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9qjtvay7x3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9qjtvay7x3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9qjtvay7x3] { filter: brightness(1.1); }
.btn-outline[b-9qjtvay7x3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9qjtvay7x3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9qjtvay7x3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9qjtvay7x3] { filter: brightness(1.1); }
.btn-icon[b-9qjtvay7x3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9qjtvay7x3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9qjtvay7x3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9qjtvay7x3] { color: #ef4444; }
.btn-delete:hover[b-9qjtvay7x3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9qjtvay7x3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9qjtvay7x3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9qjtvay7x3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9qjtvay7x3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9qjtvay7x3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9qjtvay7x3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9qjtvay7x3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9qjtvay7x3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9qjtvay7x3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9qjtvay7x3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9qjtvay7x3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9qjtvay7x3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9qjtvay7x3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9qjtvay7x3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9qjtvay7x3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9qjtvay7x3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9qjtvay7x3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9qjtvay7x3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9qjtvay7x3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9qjtvay7x3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9qjtvay7x3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9qjtvay7x3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9qjtvay7x3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9qjtvay7x3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9qjtvay7x3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9qjtvay7x3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9qjtvay7x3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9qjtvay7x3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9qjtvay7x3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9qjtvay7x3] { display: block; }
.hide-on-cards[b-9qjtvay7x3] { display: none !important; }
.show-on-cards[b-9qjtvay7x3] { display: grid; }
.hide-on-grid[b-9qjtvay7x3] { display: none !important; }

/* Badges */
.badge[b-9qjtvay7x3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9qjtvay7x3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9qjtvay7x3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9qjtvay7x3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9qjtvay7x3] { text-align: center; }
.text-muted[b-9qjtvay7x3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9qjtvay7x3], .crud-empty-state[b-9qjtvay7x3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9qjtvay7x3] { font-size: 2rem; }
.crud-spinner[b-9qjtvay7x3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9qjtvay7x3 0.6s linear infinite; }
.crud-spinner-sm[b-9qjtvay7x3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9qjtvay7x3 0.6s linear infinite; }
@keyframes spin-b-9qjtvay7x3 { to { transform: rotate(360deg); } }
.spin[b-9qjtvay7x3] { animation: spin-b-9qjtvay7x3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9qjtvay7x3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9qjtvay7x3 0.15s ease-out; }
.modal-container[b-9qjtvay7x3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9qjtvay7x3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9qjtvay7x3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9qjtvay7x3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9qjtvay7x3] { max-width: 420px; }
@keyframes fadeIn-b-9qjtvay7x3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9qjtvay7x3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9qjtvay7x3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9qjtvay7x3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9qjtvay7x3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9qjtvay7x3] { color: #dc2626; }
.modal-close[b-9qjtvay7x3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9qjtvay7x3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9qjtvay7x3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9qjtvay7x3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9qjtvay7x3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9qjtvay7x3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9qjtvay7x3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9qjtvay7x3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9qjtvay7x3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9qjtvay7x3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9qjtvay7x3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9qjtvay7x3] { flex: 2; }
.form-group label[b-9qjtvay7x3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9qjtvay7x3], .form-group select[b-9qjtvay7x3], .form-textarea[b-9qjtvay7x3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9qjtvay7x3], .form-group select:focus[b-9qjtvay7x3], .form-textarea:focus[b-9qjtvay7x3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9qjtvay7x3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9qjtvay7x3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9qjtvay7x3] { flex: 1; display: flex; align-items: center; }
.form-check[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9qjtvay7x3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9qjtvay7x3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9qjtvay7x3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9qjtvay7x3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9qjtvay7x3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9qjtvay7x3] { font-size: 3rem; }
.photo-placeholder span[b-9qjtvay7x3] { font-size: 0.78rem; }
.photo-actions[b-9qjtvay7x3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9qjtvay7x3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9qjtvay7x3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9qjtvay7x3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9qjtvay7x3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9qjtvay7x3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9qjtvay7x3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9qjtvay7x3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9qjtvay7x3] { filter: brightness(1.15); transform: scale(1.05); }
[b-9qjtvay7x3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9qjtvay7x3] { padding: 0.75rem; }
    .crud-header[b-9qjtvay7x3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9qjtvay7x3] { font-size: 1.1rem; }
    .btn-text[b-9qjtvay7x3] { display: none; }
    .form-row[b-9qjtvay7x3] { flex-direction: column; }
    .form-row-4[b-9qjtvay7x3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9qjtvay7x3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9qjtvay7x3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9qjtvay7x3] { padding: 0.75rem; }
    .modal-tabs[b-9qjtvay7x3] { overflow-x: auto; }
    .modal-tab[b-9qjtvay7x3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9qjtvay7x3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9qjtvay7x3] { display: grid !important; }
    .crud-cards-wrapper[b-9qjtvay7x3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9qjtvay7x3] { grid-template-columns: 1fr; }
    .card-details[b-9qjtvay7x3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9qjtvay7x3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9qjtvay7x3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9qjtvay7x3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9qjtvay7x3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Nomina/Frmnovedades.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-n6zecc79fo] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-n6zecc79fo 0.3s ease-out; }
@keyframes slideUp-b-n6zecc79fo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-n6zecc79fo] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-n6zecc79fo] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-n6zecc79fo] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-n6zecc79fo] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-n6zecc79fo] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-n6zecc79fo] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-n6zecc79fo] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-n6zecc79fo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-n6zecc79fo] { filter: brightness(1.1); }
.btn-outline[b-n6zecc79fo] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-n6zecc79fo] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-n6zecc79fo] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-n6zecc79fo] { filter: brightness(1.1); }
.btn-icon[b-n6zecc79fo] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-n6zecc79fo] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-n6zecc79fo] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-n6zecc79fo] { color: #ef4444; }
.btn-delete:hover[b-n6zecc79fo] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-n6zecc79fo] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-n6zecc79fo] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-n6zecc79fo] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-n6zecc79fo] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-n6zecc79fo] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-n6zecc79fo] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-n6zecc79fo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-n6zecc79fo] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-n6zecc79fo] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-n6zecc79fo] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-n6zecc79fo] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-n6zecc79fo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-n6zecc79fo] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-n6zecc79fo] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-n6zecc79fo] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-n6zecc79fo] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-n6zecc79fo] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-n6zecc79fo] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-n6zecc79fo] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-n6zecc79fo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-n6zecc79fo] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-n6zecc79fo] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-n6zecc79fo] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-n6zecc79fo] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-n6zecc79fo] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-n6zecc79fo] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-n6zecc79fo] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-n6zecc79fo] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-n6zecc79fo] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-n6zecc79fo] { display: block; }
.hide-on-cards[b-n6zecc79fo] { display: none !important; }
.show-on-cards[b-n6zecc79fo] { display: grid; }
.hide-on-grid[b-n6zecc79fo] { display: none !important; }

/* Badges */
.badge[b-n6zecc79fo] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-n6zecc79fo] { background: #ecfdf5; color: #065f46; }
.badge-no[b-n6zecc79fo] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-n6zecc79fo] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-n6zecc79fo] { text-align: center; }
.text-muted[b-n6zecc79fo] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-n6zecc79fo], .crud-empty-state[b-n6zecc79fo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-n6zecc79fo] { font-size: 2rem; }
.crud-spinner[b-n6zecc79fo] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-n6zecc79fo 0.6s linear infinite; }
.crud-spinner-sm[b-n6zecc79fo] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-n6zecc79fo 0.6s linear infinite; }
@keyframes spin-b-n6zecc79fo { to { transform: rotate(360deg); } }
.spin[b-n6zecc79fo] { animation: spin-b-n6zecc79fo 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-n6zecc79fo] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-n6zecc79fo 0.15s ease-out; }
.modal-container[b-n6zecc79fo] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-n6zecc79fo] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-n6zecc79fo 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-n6zecc79fo] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-n6zecc79fo] { max-width: 420px; }
@keyframes fadeIn-b-n6zecc79fo { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-n6zecc79fo { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-n6zecc79fo] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-n6zecc79fo] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-n6zecc79fo] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-n6zecc79fo] { color: #dc2626; }
.modal-close[b-n6zecc79fo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-n6zecc79fo] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-n6zecc79fo] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-n6zecc79fo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-n6zecc79fo] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-n6zecc79fo] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-n6zecc79fo] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-n6zecc79fo] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-n6zecc79fo] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-n6zecc79fo] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-n6zecc79fo] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-n6zecc79fo] { flex: 2; }
.form-group label[b-n6zecc79fo] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-n6zecc79fo], .form-group select[b-n6zecc79fo], .form-textarea[b-n6zecc79fo] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-n6zecc79fo], .form-group select:focus[b-n6zecc79fo], .form-textarea:focus[b-n6zecc79fo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-n6zecc79fo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-n6zecc79fo] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-n6zecc79fo] { flex: 1; display: flex; align-items: center; }
.form-check[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-n6zecc79fo] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-n6zecc79fo] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-n6zecc79fo] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-n6zecc79fo] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-n6zecc79fo] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-n6zecc79fo] { font-size: 3rem; }
.photo-placeholder span[b-n6zecc79fo] { font-size: 0.78rem; }
.photo-actions[b-n6zecc79fo] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-n6zecc79fo] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-n6zecc79fo] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-n6zecc79fo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-n6zecc79fo] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-n6zecc79fo] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-n6zecc79fo] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-n6zecc79fo] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-n6zecc79fo] { filter: brightness(1.15); transform: scale(1.05); }
[b-n6zecc79fo] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-n6zecc79fo] { padding: 0.75rem; }
    .crud-header[b-n6zecc79fo] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-n6zecc79fo] { font-size: 1.1rem; }
    .btn-text[b-n6zecc79fo] { display: none; }
    .form-row[b-n6zecc79fo] { flex-direction: column; }
    .form-row-4[b-n6zecc79fo] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-n6zecc79fo] { width: 98%; max-height: 95vh; }
    .modal-lg[b-n6zecc79fo] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-n6zecc79fo] { padding: 0.75rem; }
    .modal-tabs[b-n6zecc79fo] { overflow-x: auto; }
    .modal-tab[b-n6zecc79fo] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-n6zecc79fo] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-n6zecc79fo] { display: grid !important; }
    .crud-cards-wrapper[b-n6zecc79fo] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-n6zecc79fo] { grid-template-columns: 1fr; }
    .card-details[b-n6zecc79fo] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-n6zecc79fo] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-n6zecc79fo] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-n6zecc79fo] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-n6zecc79fo] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Ocr/Frmocrconfiguracion.razor.rz.scp.css */
/* ============================================================
   OCR Configuración — Estilos CRUD + Cards OCR
   ============================================================ */

.crud-container[b-nrc9wevq5w] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-nrc9wevq5w 0.3s ease-out; }
@keyframes slideUp-b-nrc9wevq5w { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-nrc9wevq5w] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-nrc9wevq5w] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-nrc9wevq5w] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-nrc9wevq5w] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-nrc9wevq5w] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-nrc9wevq5w] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-nrc9wevq5w] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-nrc9wevq5w] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-nrc9wevq5w] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-nrc9wevq5w] { filter: brightness(1.1); }
.btn-outline[b-nrc9wevq5w] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-nrc9wevq5w] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-nrc9wevq5w] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-nrc9wevq5w] { filter: brightness(1.1); }
.btn-sm[b-nrc9wevq5w] { padding: 0.35rem 0.7rem; font-size: 0.72rem; }

/* Alert */
.crud-alert[b-nrc9wevq5w] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-nrc9wevq5w] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.danger[b-nrc9wevq5w],
.crud-alert.error[b-nrc9wevq5w] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-nrc9wevq5w] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-nrc9wevq5w] { background: rgba(16, 185, 129, 0.15); color: #86efac; border-color: rgba(16, 185, 129, 0.3); }
[data-mode="dark"] .crud-alert.danger[b-nrc9wevq5w],
[data-mode="dark"] .crud-alert.error[b-nrc9wevq5w] { background: rgba(239, 68, 68, 0.15); color: #fca5a5; border-color: rgba(239, 68, 68, 0.3); }

/* Badges */
.badge[b-nrc9wevq5w] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-nrc9wevq5w] { background: #ecfdf5; color: #065f46; }
.badge-no[b-nrc9wevq5w] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-nrc9wevq5w] { background: rgba(16, 185, 129, 0.2); color: #86efac; }
[data-mode="dark"] .badge-no[b-nrc9wevq5w] { background: rgba(100, 116, 139, 0.2); color: #cbd5e1; }

/* Loading */
.crud-loading[b-nrc9wevq5w] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-spinner[b-nrc9wevq5w] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-nrc9wevq5w 0.6s linear infinite; }
.crud-spinner-sm[b-nrc9wevq5w] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-nrc9wevq5w 0.6s linear infinite; vertical-align: middle; }
@keyframes spin-b-nrc9wevq5w { to { transform: rotate(360deg); } }
.spin[b-nrc9wevq5w] { animation: spin-b-nrc9wevq5w 0.8s linear infinite; }

/* ===============================================================
   OCR specific cards
   =============================================================== */

.ocr-card[b-nrc9wevq5w] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.ocr-card-title[b-nrc9wevq5w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0 0 1rem 0;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

.ocr-card-title i[b-nrc9wevq5w] { color: var(--rg-accent, #4f46e5); font-size: 1.1rem; }

.ocr-grid[b-nrc9wevq5w] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.ocr-field[b-nrc9wevq5w] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.65rem 0.85rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
}

.ocr-label[b-nrc9wevq5w] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ocr-value[b-nrc9wevq5w] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}

.ocr-note[b-nrc9wevq5w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    margin: 0.75rem 0;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
}

.ocr-note i[b-nrc9wevq5w] { color: var(--rg-accent, #4f46e5); }

.ocr-note-warn[b-nrc9wevq5w] {
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.3);
    color: #92400e;
}

.ocr-note-warn i[b-nrc9wevq5w] { color: #d97706; }

[data-mode="dark"] .ocr-note-warn[b-nrc9wevq5w] { color: #fcd34d; background: rgba(245, 158, 11, 0.15); }

/* Form controls within OCR cards */
.form-row[b-nrc9wevq5w] { display: flex; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.form-group[b-nrc9wevq5w] { flex: 1; display: flex; flex-direction: column; gap: 0.3rem; min-width: 220px; }
.form-group label[b-nrc9wevq5w] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }

.ocr-input-sm[b-nrc9wevq5w] {
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.4rem;
    font-size: 0.85rem;
    background: var(--rg-bg-input, #fff);
    color: var(--rg-text-primary, #1e293b);
    width: 120px;
    outline: none;
    transition: border-color 0.15s;
}

.ocr-input-sm:focus[b-nrc9wevq5w] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15);
}

.field-desc[b-nrc9wevq5w] {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
}

.ocr-check[b-nrc9wevq5w] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--rg-text-primary, #1e293b);
    padding: 0.45rem 0;
}

.ocr-check input[type="checkbox"][b-nrc9wevq5w] {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--rg-accent, #4f46e5);
    cursor: pointer;
}

/* File upload */
.ocr-file-input[b-nrc9wevq5w] {
    display: block;
    margin: 0.75rem 0;
    padding: 0.5rem;
    border: 1px dashed var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.8rem;
    width: 100%;
}

.ocr-hint[b-nrc9wevq5w] { font-size: 0.78rem; color: var(--rg-text-secondary, #475569); margin: 0 0 0.5rem 0; }

/* Resultado de prueba */
.ocr-result[b-nrc9wevq5w] {
    margin-top: 0.85rem;
    padding: 0.85rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
}

.ocr-result-meta[b-nrc9wevq5w] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.65rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.75rem;
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
}

.ocr-result-meta i[b-nrc9wevq5w] { margin-right: 0.25rem; color: var(--rg-accent, #4f46e5); }

.ocr-lines[b-nrc9wevq5w] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 240px;
    overflow-y: auto;
}

.ocr-lines li[b-nrc9wevq5w] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.82rem;
}

.ocr-lines li:last-child[b-nrc9wevq5w] { border-bottom: none; }

.ocr-conf[b-nrc9wevq5w] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rg-accent, #4f46e5);
    min-width: 45px;
}

.ocr-text[b-nrc9wevq5w] {
    color: var(--rg-text-primary, #1e293b);
    word-break: break-word;
}

.ocr-empty[b-nrc9wevq5w] {
    text-align: center;
    color: var(--rg-text-muted, #94a3b8);
    font-style: italic;
    margin: 0.5rem 0;
}

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-nrc9wevq5w] { padding: 0.75rem; }
    .crud-header[b-nrc9wevq5w] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-nrc9wevq5w] { font-size: 1.1rem; }
    .btn-text[b-nrc9wevq5w] { display: none; }
    .form-row[b-nrc9wevq5w] { flex-direction: column; }
    .ocr-grid[b-nrc9wevq5w] { grid-template-columns: 1fr; }
    .ocr-card[b-nrc9wevq5w] { padding: 0.85rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmcodificadocumentooptical.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-22cv4fo7um] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-22cv4fo7um 0.3s ease-out; }
@keyframes slideUp-b-22cv4fo7um { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-22cv4fo7um] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-22cv4fo7um] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-22cv4fo7um] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-22cv4fo7um] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-22cv4fo7um] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-22cv4fo7um] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-22cv4fo7um] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-22cv4fo7um] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-22cv4fo7um] { filter: brightness(1.1); }
.btn-outline[b-22cv4fo7um] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-22cv4fo7um] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-22cv4fo7um] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-22cv4fo7um] { filter: brightness(1.1); }
.btn-icon[b-22cv4fo7um] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-22cv4fo7um] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-22cv4fo7um] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-22cv4fo7um] { color: #ef4444; }
.btn-delete:hover[b-22cv4fo7um] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-22cv4fo7um] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-22cv4fo7um] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-22cv4fo7um] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-22cv4fo7um] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-22cv4fo7um] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-22cv4fo7um] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-22cv4fo7um] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-22cv4fo7um] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-22cv4fo7um] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-22cv4fo7um] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-22cv4fo7um] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-22cv4fo7um] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-22cv4fo7um] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-22cv4fo7um] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-22cv4fo7um] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-22cv4fo7um] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-22cv4fo7um] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-22cv4fo7um] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-22cv4fo7um] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-22cv4fo7um] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-22cv4fo7um] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-22cv4fo7um] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-22cv4fo7um] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-22cv4fo7um] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-22cv4fo7um] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-22cv4fo7um] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-22cv4fo7um] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-22cv4fo7um] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-22cv4fo7um] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-22cv4fo7um] { display: block; }
.hide-on-cards[b-22cv4fo7um] { display: none !important; }
.show-on-cards[b-22cv4fo7um] { display: grid; }
.hide-on-grid[b-22cv4fo7um] { display: none !important; }

/* Badges */
.badge[b-22cv4fo7um] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-22cv4fo7um] { background: #ecfdf5; color: #065f46; }
.badge-no[b-22cv4fo7um] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-22cv4fo7um] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-22cv4fo7um] { text-align: center; }
.text-muted[b-22cv4fo7um] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-22cv4fo7um], .crud-empty-state[b-22cv4fo7um] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-22cv4fo7um] { font-size: 2rem; }
.crud-spinner[b-22cv4fo7um] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-22cv4fo7um 0.6s linear infinite; }
.crud-spinner-sm[b-22cv4fo7um] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-22cv4fo7um 0.6s linear infinite; }
@keyframes spin-b-22cv4fo7um { to { transform: rotate(360deg); } }
.spin[b-22cv4fo7um] { animation: spin-b-22cv4fo7um 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-22cv4fo7um] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-22cv4fo7um 0.15s ease-out; }
.modal-container[b-22cv4fo7um] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-22cv4fo7um] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-22cv4fo7um 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-22cv4fo7um] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-22cv4fo7um] { max-width: 420px; }
@keyframes fadeIn-b-22cv4fo7um { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-22cv4fo7um { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-22cv4fo7um] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-22cv4fo7um] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-22cv4fo7um] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-22cv4fo7um] { color: #dc2626; }
.modal-close[b-22cv4fo7um] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-22cv4fo7um] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-22cv4fo7um] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-22cv4fo7um] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-22cv4fo7um] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-22cv4fo7um] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-22cv4fo7um] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-22cv4fo7um] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-22cv4fo7um] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-22cv4fo7um] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-22cv4fo7um] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-22cv4fo7um] { flex: 2; }
.form-group label[b-22cv4fo7um] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-22cv4fo7um], .form-group select[b-22cv4fo7um], .form-textarea[b-22cv4fo7um] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-22cv4fo7um], .form-group select:focus[b-22cv4fo7um], .form-textarea:focus[b-22cv4fo7um] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-22cv4fo7um] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-22cv4fo7um] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-22cv4fo7um] { flex: 1; display: flex; align-items: center; }
.form-check[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-22cv4fo7um] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-22cv4fo7um] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-22cv4fo7um] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-22cv4fo7um] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-22cv4fo7um] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-22cv4fo7um] { font-size: 3rem; }
.photo-placeholder span[b-22cv4fo7um] { font-size: 0.78rem; }
.photo-actions[b-22cv4fo7um] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-22cv4fo7um] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-22cv4fo7um] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-22cv4fo7um] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-22cv4fo7um] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-22cv4fo7um] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-22cv4fo7um] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-22cv4fo7um] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-22cv4fo7um] { filter: brightness(1.15); transform: scale(1.05); }
[b-22cv4fo7um] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-22cv4fo7um] { padding: 0.75rem; }
    .crud-header[b-22cv4fo7um] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-22cv4fo7um] { font-size: 1.1rem; }
    .btn-text[b-22cv4fo7um] { display: none; }
    .form-row[b-22cv4fo7um] { flex-direction: column; }
    .form-row-4[b-22cv4fo7um] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-22cv4fo7um] { width: 98%; max-height: 95vh; }
    .modal-lg[b-22cv4fo7um] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-22cv4fo7um] { padding: 0.75rem; }
    .modal-tabs[b-22cv4fo7um] { overflow-x: auto; }
    .modal-tab[b-22cv4fo7um] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-22cv4fo7um] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-22cv4fo7um] { display: grid !important; }
    .crud-cards-wrapper[b-22cv4fo7um] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-22cv4fo7um] { grid-template-columns: 1fr; }
    .card-details[b-22cv4fo7um] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-22cv4fo7um] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-22cv4fo7um] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-22cv4fo7um] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-22cv4fo7um] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmfacturaemitidas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h97781fxho] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h97781fxho 0.3s ease-out; }
@keyframes slideUp-b-h97781fxho { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h97781fxho] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h97781fxho] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h97781fxho] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h97781fxho] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h97781fxho] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h97781fxho] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h97781fxho] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h97781fxho] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h97781fxho] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h97781fxho] { filter: brightness(1.1); }
.btn-outline[b-h97781fxho] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h97781fxho] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h97781fxho] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h97781fxho] { filter: brightness(1.1); }
.btn-icon[b-h97781fxho] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h97781fxho] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h97781fxho] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h97781fxho] { color: #ef4444; }
.btn-delete:hover[b-h97781fxho] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h97781fxho] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h97781fxho] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h97781fxho] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h97781fxho] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h97781fxho] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h97781fxho] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h97781fxho] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h97781fxho] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h97781fxho] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h97781fxho] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h97781fxho] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h97781fxho] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h97781fxho] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h97781fxho] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h97781fxho] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h97781fxho] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h97781fxho] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h97781fxho] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h97781fxho] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h97781fxho] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h97781fxho] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h97781fxho] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h97781fxho] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h97781fxho] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h97781fxho] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h97781fxho] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h97781fxho] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h97781fxho] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h97781fxho] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h97781fxho] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h97781fxho] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h97781fxho] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h97781fxho] { display: block; }
.hide-on-cards[b-h97781fxho] { display: none !important; }
.show-on-cards[b-h97781fxho] { display: grid; }
.hide-on-grid[b-h97781fxho] { display: none !important; }

/* Badges */
.badge[b-h97781fxho] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h97781fxho] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h97781fxho] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h97781fxho] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h97781fxho] { text-align: center; }
.text-muted[b-h97781fxho] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h97781fxho], .crud-empty-state[b-h97781fxho] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h97781fxho] { font-size: 2rem; }
.crud-spinner[b-h97781fxho] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h97781fxho 0.6s linear infinite; }
.crud-spinner-sm[b-h97781fxho] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h97781fxho 0.6s linear infinite; }
@keyframes spin-b-h97781fxho { to { transform: rotate(360deg); } }
.spin[b-h97781fxho] { animation: spin-b-h97781fxho 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h97781fxho] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h97781fxho 0.15s ease-out; }
.modal-container[b-h97781fxho] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h97781fxho] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h97781fxho 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h97781fxho] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h97781fxho] { max-width: 420px; }
@keyframes fadeIn-b-h97781fxho { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h97781fxho { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h97781fxho] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h97781fxho] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h97781fxho] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h97781fxho] { color: #dc2626; }
.modal-close[b-h97781fxho] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h97781fxho] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h97781fxho] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h97781fxho] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h97781fxho] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h97781fxho] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h97781fxho] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h97781fxho] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h97781fxho] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h97781fxho] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h97781fxho] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h97781fxho] { flex: 2; }
.form-group label[b-h97781fxho] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h97781fxho], .form-group select[b-h97781fxho], .form-textarea[b-h97781fxho] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h97781fxho], .form-group select:focus[b-h97781fxho], .form-textarea:focus[b-h97781fxho] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h97781fxho] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h97781fxho] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h97781fxho] { flex: 1; display: flex; align-items: center; }
.form-check[b-h97781fxho] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h97781fxho] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h97781fxho] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h97781fxho] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h97781fxho] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h97781fxho] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h97781fxho] { font-size: 3rem; }
.photo-placeholder span[b-h97781fxho] { font-size: 0.78rem; }
.photo-actions[b-h97781fxho] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h97781fxho] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h97781fxho] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h97781fxho] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h97781fxho] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h97781fxho] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h97781fxho] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h97781fxho] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h97781fxho] { filter: brightness(1.15); transform: scale(1.05); }
[b-h97781fxho] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h97781fxho] { padding: 0.75rem; }
    .crud-header[b-h97781fxho] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h97781fxho] { font-size: 1.1rem; }
    .btn-text[b-h97781fxho] { display: none; }
    .form-row[b-h97781fxho] { flex-direction: column; }
    .form-row-4[b-h97781fxho] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h97781fxho] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h97781fxho] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h97781fxho] { padding: 0.75rem; }
    .modal-tabs[b-h97781fxho] { overflow-x: auto; }
    .modal-tab[b-h97781fxho] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h97781fxho] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h97781fxho] { display: grid !important; }
    .crud-cards-wrapper[b-h97781fxho] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h97781fxho] { grid-template-columns: 1fr; }
    .card-details[b-h97781fxho] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h97781fxho] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h97781fxho] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h97781fxho] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h97781fxho] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmfacturasemitidas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-nhdsbs7a12] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-nhdsbs7a12 0.3s ease-out; }
@keyframes slideUp-b-nhdsbs7a12 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-nhdsbs7a12] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-nhdsbs7a12] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-nhdsbs7a12] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-nhdsbs7a12] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-nhdsbs7a12] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-nhdsbs7a12] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-nhdsbs7a12] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-nhdsbs7a12] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-nhdsbs7a12] { filter: brightness(1.1); }
.btn-outline[b-nhdsbs7a12] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-nhdsbs7a12] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-nhdsbs7a12] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-nhdsbs7a12] { filter: brightness(1.1); }
.btn-icon[b-nhdsbs7a12] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-nhdsbs7a12] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-nhdsbs7a12] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-nhdsbs7a12] { color: #ef4444; }
.btn-delete:hover[b-nhdsbs7a12] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-nhdsbs7a12] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-nhdsbs7a12] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-nhdsbs7a12] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-nhdsbs7a12] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-nhdsbs7a12] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-nhdsbs7a12] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-nhdsbs7a12] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-nhdsbs7a12] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-nhdsbs7a12] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-nhdsbs7a12] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-nhdsbs7a12] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-nhdsbs7a12] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-nhdsbs7a12] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-nhdsbs7a12] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-nhdsbs7a12] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-nhdsbs7a12] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-nhdsbs7a12] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-nhdsbs7a12] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-nhdsbs7a12] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-nhdsbs7a12] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-nhdsbs7a12] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-nhdsbs7a12] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-nhdsbs7a12] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-nhdsbs7a12] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-nhdsbs7a12] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-nhdsbs7a12] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-nhdsbs7a12] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-nhdsbs7a12] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-nhdsbs7a12] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-nhdsbs7a12] { display: block; }
.hide-on-cards[b-nhdsbs7a12] { display: none !important; }
.show-on-cards[b-nhdsbs7a12] { display: grid; }
.hide-on-grid[b-nhdsbs7a12] { display: none !important; }

/* Badges */
.badge[b-nhdsbs7a12] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-nhdsbs7a12] { background: #ecfdf5; color: #065f46; }
.badge-no[b-nhdsbs7a12] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-nhdsbs7a12] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-nhdsbs7a12] { text-align: center; }
.text-muted[b-nhdsbs7a12] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-nhdsbs7a12], .crud-empty-state[b-nhdsbs7a12] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-nhdsbs7a12] { font-size: 2rem; }
.crud-spinner[b-nhdsbs7a12] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-nhdsbs7a12 0.6s linear infinite; }
.crud-spinner-sm[b-nhdsbs7a12] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-nhdsbs7a12 0.6s linear infinite; }
@keyframes spin-b-nhdsbs7a12 { to { transform: rotate(360deg); } }
.spin[b-nhdsbs7a12] { animation: spin-b-nhdsbs7a12 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-nhdsbs7a12] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-nhdsbs7a12 0.15s ease-out; }
.modal-container[b-nhdsbs7a12] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-nhdsbs7a12] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-nhdsbs7a12 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-nhdsbs7a12] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-nhdsbs7a12] { max-width: 420px; }
@keyframes fadeIn-b-nhdsbs7a12 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-nhdsbs7a12 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-nhdsbs7a12] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-nhdsbs7a12] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-nhdsbs7a12] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-nhdsbs7a12] { color: #dc2626; }
.modal-close[b-nhdsbs7a12] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-nhdsbs7a12] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-nhdsbs7a12] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-nhdsbs7a12] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-nhdsbs7a12] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-nhdsbs7a12] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-nhdsbs7a12] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-nhdsbs7a12] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-nhdsbs7a12] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-nhdsbs7a12] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-nhdsbs7a12] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-nhdsbs7a12] { flex: 2; }
.form-group label[b-nhdsbs7a12] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-nhdsbs7a12], .form-group select[b-nhdsbs7a12], .form-textarea[b-nhdsbs7a12] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-nhdsbs7a12], .form-group select:focus[b-nhdsbs7a12], .form-textarea:focus[b-nhdsbs7a12] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-nhdsbs7a12] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-nhdsbs7a12] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-nhdsbs7a12] { flex: 1; display: flex; align-items: center; }
.form-check[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-nhdsbs7a12] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-nhdsbs7a12] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-nhdsbs7a12] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-nhdsbs7a12] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-nhdsbs7a12] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-nhdsbs7a12] { font-size: 3rem; }
.photo-placeholder span[b-nhdsbs7a12] { font-size: 0.78rem; }
.photo-actions[b-nhdsbs7a12] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-nhdsbs7a12] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-nhdsbs7a12] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-nhdsbs7a12] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-nhdsbs7a12] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-nhdsbs7a12] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-nhdsbs7a12] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-nhdsbs7a12] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-nhdsbs7a12] { filter: brightness(1.15); transform: scale(1.05); }
[b-nhdsbs7a12] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-nhdsbs7a12] { padding: 0.75rem; }
    .crud-header[b-nhdsbs7a12] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-nhdsbs7a12] { font-size: 1.1rem; }
    .btn-text[b-nhdsbs7a12] { display: none; }
    .form-row[b-nhdsbs7a12] { flex-direction: column; }
    .form-row-4[b-nhdsbs7a12] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-nhdsbs7a12] { width: 98%; max-height: 95vh; }
    .modal-lg[b-nhdsbs7a12] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-nhdsbs7a12] { padding: 0.75rem; }
    .modal-tabs[b-nhdsbs7a12] { overflow-x: auto; }
    .modal-tab[b-nhdsbs7a12] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-nhdsbs7a12] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-nhdsbs7a12] { display: grid !important; }
    .crud-cards-wrapper[b-nhdsbs7a12] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-nhdsbs7a12] { grid-template-columns: 1fr; }
    .card-details[b-nhdsbs7a12] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-nhdsbs7a12] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-nhdsbs7a12] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-nhdsbs7a12] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-nhdsbs7a12] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmfacturatipoexcel.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-o1h34vusmf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-o1h34vusmf 0.3s ease-out; }
@keyframes slideUp-b-o1h34vusmf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-o1h34vusmf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-o1h34vusmf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-o1h34vusmf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-o1h34vusmf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-o1h34vusmf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-o1h34vusmf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-o1h34vusmf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-o1h34vusmf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-o1h34vusmf] { filter: brightness(1.1); }
.btn-outline[b-o1h34vusmf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-o1h34vusmf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-o1h34vusmf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-o1h34vusmf] { filter: brightness(1.1); }
.btn-icon[b-o1h34vusmf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-o1h34vusmf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-o1h34vusmf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-o1h34vusmf] { color: #ef4444; }
.btn-delete:hover[b-o1h34vusmf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-o1h34vusmf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-o1h34vusmf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-o1h34vusmf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-o1h34vusmf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-o1h34vusmf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-o1h34vusmf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-o1h34vusmf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-o1h34vusmf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-o1h34vusmf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-o1h34vusmf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-o1h34vusmf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-o1h34vusmf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-o1h34vusmf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-o1h34vusmf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-o1h34vusmf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-o1h34vusmf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-o1h34vusmf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-o1h34vusmf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-o1h34vusmf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-o1h34vusmf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-o1h34vusmf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-o1h34vusmf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-o1h34vusmf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-o1h34vusmf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-o1h34vusmf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-o1h34vusmf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-o1h34vusmf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-o1h34vusmf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-o1h34vusmf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-o1h34vusmf] { display: block; }
.hide-on-cards[b-o1h34vusmf] { display: none !important; }
.show-on-cards[b-o1h34vusmf] { display: grid; }
.hide-on-grid[b-o1h34vusmf] { display: none !important; }

/* Badges */
.badge[b-o1h34vusmf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-o1h34vusmf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-o1h34vusmf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-o1h34vusmf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-o1h34vusmf] { text-align: center; }
.text-muted[b-o1h34vusmf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-o1h34vusmf], .crud-empty-state[b-o1h34vusmf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-o1h34vusmf] { font-size: 2rem; }
.crud-spinner[b-o1h34vusmf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-o1h34vusmf 0.6s linear infinite; }
.crud-spinner-sm[b-o1h34vusmf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-o1h34vusmf 0.6s linear infinite; }
@keyframes spin-b-o1h34vusmf { to { transform: rotate(360deg); } }
.spin[b-o1h34vusmf] { animation: spin-b-o1h34vusmf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-o1h34vusmf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-o1h34vusmf 0.15s ease-out; }
.modal-container[b-o1h34vusmf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-o1h34vusmf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-o1h34vusmf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-o1h34vusmf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-o1h34vusmf] { max-width: 420px; }
@keyframes fadeIn-b-o1h34vusmf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-o1h34vusmf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-o1h34vusmf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-o1h34vusmf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-o1h34vusmf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-o1h34vusmf] { color: #dc2626; }
.modal-close[b-o1h34vusmf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-o1h34vusmf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-o1h34vusmf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-o1h34vusmf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-o1h34vusmf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-o1h34vusmf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-o1h34vusmf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-o1h34vusmf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-o1h34vusmf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-o1h34vusmf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-o1h34vusmf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-o1h34vusmf] { flex: 2; }
.form-group label[b-o1h34vusmf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-o1h34vusmf], .form-group select[b-o1h34vusmf], .form-textarea[b-o1h34vusmf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-o1h34vusmf], .form-group select:focus[b-o1h34vusmf], .form-textarea:focus[b-o1h34vusmf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-o1h34vusmf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-o1h34vusmf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-o1h34vusmf] { flex: 1; display: flex; align-items: center; }
.form-check[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-o1h34vusmf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-o1h34vusmf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-o1h34vusmf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-o1h34vusmf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-o1h34vusmf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-o1h34vusmf] { font-size: 3rem; }
.photo-placeholder span[b-o1h34vusmf] { font-size: 0.78rem; }
.photo-actions[b-o1h34vusmf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-o1h34vusmf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-o1h34vusmf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-o1h34vusmf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-o1h34vusmf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-o1h34vusmf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-o1h34vusmf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-o1h34vusmf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-o1h34vusmf] { filter: brightness(1.15); transform: scale(1.05); }
[b-o1h34vusmf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-o1h34vusmf] { padding: 0.75rem; }
    .crud-header[b-o1h34vusmf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-o1h34vusmf] { font-size: 1.1rem; }
    .btn-text[b-o1h34vusmf] { display: none; }
    .form-row[b-o1h34vusmf] { flex-direction: column; }
    .form-row-4[b-o1h34vusmf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-o1h34vusmf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-o1h34vusmf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-o1h34vusmf] { padding: 0.75rem; }
    .modal-tabs[b-o1h34vusmf] { overflow-x: auto; }
    .modal-tab[b-o1h34vusmf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-o1h34vusmf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-o1h34vusmf] { display: grid !important; }
    .crud-cards-wrapper[b-o1h34vusmf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-o1h34vusmf] { grid-template-columns: 1fr; }
    .card-details[b-o1h34vusmf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-o1h34vusmf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-o1h34vusmf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-o1h34vusmf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-o1h34vusmf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptaentradaproducto.razor.rz.scp.css */
/* ============================================================
   Frmoptaentradaproducto — Entrada de Productos Optical v2
   ============================================================ */

.crud-container[b-oy2gy57y6h] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-oy2gy57y6h 0.3s ease-out; }
@keyframes slideUp-b-oy2gy57y6h { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-oy2gy57y6h] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-oy2gy57y6h] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-oy2gy57y6h] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-oy2gy57y6h] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-oy2gy57y6h] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-oy2gy57y6h] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-oy2gy57y6h] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-oy2gy57y6h] { opacity: 0.6; cursor: not-allowed; }
.btn-sm[b-oy2gy57y6h] { padding: 0.4rem 0.7rem; font-size: 0.75rem; }
.btn-primary[b-oy2gy57y6h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-oy2gy57y6h] { filter: brightness(1.1); }
.btn-outline[b-oy2gy57y6h] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-oy2gy57y6h] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-oy2gy57y6h] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-oy2gy57y6h] { filter: brightness(1.1); }
.btn-icon[b-oy2gy57y6h] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-oy2gy57y6h] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-oy2gy57y6h] { background: rgba(79,70,229,0.1); }
.btn-delete[b-oy2gy57y6h] { color: #ef4444; }
.btn-delete:hover[b-oy2gy57y6h] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-oy2gy57y6h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-oy2gy57y6h] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-oy2gy57y6h] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-oy2gy57y6h] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-oy2gy57y6h] { color: #fca5a5; }
.crud-alert-close[b-oy2gy57y6h] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filters + Search */
.filter-row[b-oy2gy57y6h] { display: flex; gap: 0.75rem; align-items: flex-end; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-oy2gy57y6h] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-oy2gy57y6h] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-oy2gy57y6h], .form-group select[b-oy2gy57y6h] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-oy2gy57y6h], .form-group select:focus[b-oy2gy57y6h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.crud-search-bar[b-oy2gy57y6h] { display: flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); margin-bottom: 0.75rem; }
.crud-search-btn[b-oy2gy57y6h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-oy2gy57y6h] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-oy2gy57y6h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-oy2gy57y6h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-oy2gy57y6h] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-oy2gy57y6h] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-oy2gy57y6h] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-oy2gy57y6h] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-oy2gy57y6h] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-oy2gy57y6h] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-oy2gy57y6h] { width: 80px; text-align: center; }
.text-right[b-oy2gy57y6h] { text-align: right; }
.text-center[b-oy2gy57y6h] { text-align: center; }

/* Badges */
.badge[b-oy2gy57y6h] { display: inline-flex; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-oy2gy57y6h] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-oy2gy57y6h] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-yes[b-oy2gy57y6h] { color: #86efac; }

/* Utilities */
.font-mono[b-oy2gy57y6h] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-oy2gy57y6h] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-oy2gy57y6h], .crud-empty-state[b-oy2gy57y6h] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-oy2gy57y6h] { font-size: 2rem; }
.crud-spinner[b-oy2gy57y6h] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-oy2gy57y6h 0.6s linear infinite; }
@keyframes spin-b-oy2gy57y6h { to { transform: rotate(360deg); } }
.spin[b-oy2gy57y6h] { animation: spin-b-oy2gy57y6h 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-oy2gy57y6h] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-oy2gy57y6h] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-oy2gy57y6h] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 860px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-entrada[b-oy2gy57y6h] { max-width: 920px; }
.modal-header[b-oy2gy57y6h] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-oy2gy57y6h] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-oy2gy57y6h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-oy2gy57y6h] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-oy2gy57y6h] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Cabecera de entrada */
.entrada-header-grid[b-oy2gy57y6h] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

/* Agregar línea */
.linea-add-row[b-oy2gy57y6h] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-end;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

/* Búsqueda de producto */
.prod-search-results[b-oy2gy57y6h] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-card, #fff);
    overflow: hidden;
    margin-bottom: 0.75rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.prod-search-item[b-oy2gy57y6h] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    font-size: 0.78rem;
}
.prod-search-item:last-child[b-oy2gy57y6h] { border-bottom: none; }
.prod-search-item:hover[b-oy2gy57y6h] { background: var(--rg-bg-hover, #f8fafc); }

/* Grid líneas */
.lineas-grid-wrapper[b-oy2gy57y6h] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: 260px;
    margin-bottom: 0.5rem;
}

/* Totales */
.totales-bar[b-oy2gy57y6h] {
    display: flex;
    justify-content: flex-end;
    gap: 1.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
}
.totales-total[b-oy2gy57y6h] { font-weight: 700; color: var(--rg-text-primary, #1e293b); font-size: 0.9rem; }

@media (max-width: 768px) {
    .crud-container[b-oy2gy57y6h] { padding: 0.75rem; }
    .entrada-header-grid[b-oy2gy57y6h] { grid-template-columns: repeat(2, 1fr); }
    .linea-add-row[b-oy2gy57y6h] { flex-direction: column; }
    .btn-text[b-oy2gy57y6h] { display: none; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-oy2gy57y6h] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-oy2gy57y6h] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-oy2gy57y6h] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-oy2gy57y6h] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptanulacionfactura.razor.rz.scp.css */
/* ============================================================
   Frmoptanulacionfactura — Anulación de Facturas Optical v2
   ============================================================ */

.crud-container[b-s07cnzcubn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-s07cnzcubn 0.3s ease-out; }
@keyframes slideUp-b-s07cnzcubn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-s07cnzcubn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-s07cnzcubn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-s07cnzcubn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-s07cnzcubn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-s07cnzcubn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-s07cnzcubn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-s07cnzcubn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-s07cnzcubn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-s07cnzcubn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-s07cnzcubn] { filter: brightness(1.1); }
.btn-outline[b-s07cnzcubn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-s07cnzcubn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-s07cnzcubn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-s07cnzcubn] { filter: brightness(1.1); }
.btn-icon[b-s07cnzcubn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-delete[b-s07cnzcubn] { color: #ef4444; }
.btn-delete:hover[b-s07cnzcubn] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-s07cnzcubn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-s07cnzcubn] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-s07cnzcubn] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-s07cnzcubn] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-s07cnzcubn] { color: #fca5a5; }
.crud-alert-close[b-s07cnzcubn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Filters */
.filter-row[b-s07cnzcubn] { display: flex; gap: 0.75rem; align-items: flex-end; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-s07cnzcubn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-s07cnzcubn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-s07cnzcubn], .form-group select[b-s07cnzcubn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-s07cnzcubn], .form-group select:focus[b-s07cnzcubn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.form-group small[b-s07cnzcubn] { font-size: 0.68rem; color: var(--rg-text-muted, #94a3b8); }

.crud-search-bar[b-s07cnzcubn] { display: flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); margin-bottom: 0.75rem; }
.crud-search-btn[b-s07cnzcubn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-s07cnzcubn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-s07cnzcubn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-s07cnzcubn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-s07cnzcubn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 300px); }
.crud-table[b-s07cnzcubn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-s07cnzcubn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-s07cnzcubn] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-s07cnzcubn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-s07cnzcubn] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tbody tr.row-anulada[b-s07cnzcubn] { opacity: 0.5; }
.col-actions[b-s07cnzcubn] { width: 60px; text-align: center; }
.text-right[b-s07cnzcubn] { text-align: right; }
.text-center[b-s07cnzcubn] { text-align: center; }

/* Badges */
.badge[b-s07cnzcubn] { display: inline-flex; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-s07cnzcubn] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-s07cnzcubn] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
.badge-anulada[b-s07cnzcubn] { background: rgba(239,68,68,0.12); color: #991b1b; }
[data-mode="dark"] .badge-yes[b-s07cnzcubn] { color: #86efac; }
[data-mode="dark"] .badge-anulada[b-s07cnzcubn] { color: #fca5a5; }

/* Utilities */
.font-mono[b-s07cnzcubn] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-s07cnzcubn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-s07cnzcubn], .crud-empty-state[b-s07cnzcubn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-s07cnzcubn] { font-size: 2rem; }
.crud-spinner[b-s07cnzcubn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-s07cnzcubn 0.6s linear infinite; }
@keyframes spin-b-s07cnzcubn { to { transform: rotate(360deg); } }
.spin[b-s07cnzcubn] { animation: spin-b-s07cnzcubn 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-s07cnzcubn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-s07cnzcubn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-s07cnzcubn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 480px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-s07cnzcubn] { max-width: 460px; }
.modal-header[b-s07cnzcubn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-s07cnzcubn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-s07cnzcubn] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-s07cnzcubn] { color: #dc2626; }
.modal-close[b-s07cnzcubn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-s07cnzcubn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-s07cnzcubn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Panel información de la factura a anular */
.anulacion-info[b-s07cnzcubn] {
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.info-row[b-s07cnzcubn] { display: flex; justify-content: space-between; align-items: baseline; font-size: 0.82rem; }
.info-label[b-s07cnzcubn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.info-value[b-s07cnzcubn] { color: var(--rg-text-primary, #1e293b); font-weight: 500; }

@media (max-width: 768px) {
    .crud-container[b-s07cnzcubn] { padding: 0.75rem; }
    .filter-row[b-s07cnzcubn] { flex-direction: column; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-s07cnzcubn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-s07cnzcubn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-s07cnzcubn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-s07cnzcubn] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptbtransferenciamercancia.razor.rz.scp.css */
/* ============================================================
   Frmoptbtransferenciamercancia — Transferencia Optical v2
   ============================================================ */

.crud-container[b-c5qu4me3qk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c5qu4me3qk 0.3s ease-out; }
@keyframes slideUp-b-c5qu4me3qk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-c5qu4me3qk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c5qu4me3qk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c5qu4me3qk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c5qu4me3qk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c5qu4me3qk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c5qu4me3qk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-c5qu4me3qk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c5qu4me3qk] { opacity: 0.6; cursor: not-allowed; }
.btn-sm[b-c5qu4me3qk] { padding: 0.4rem 0.7rem; font-size: 0.75rem; }
.btn-primary[b-c5qu4me3qk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c5qu4me3qk] { filter: brightness(1.1); }
.btn-outline[b-c5qu4me3qk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c5qu4me3qk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-c5qu4me3qk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-delete[b-c5qu4me3qk] { color: #ef4444; }
.btn-delete:hover[b-c5qu4me3qk] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-c5qu4me3qk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c5qu4me3qk] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-c5qu4me3qk] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-c5qu4me3qk] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-c5qu4me3qk] { color: #fca5a5; }
.crud-alert-close[b-c5qu4me3qk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Flujo de pasos */
.flujo-info[b-c5qu4me3qk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    font-size: 0.8rem;
}
.flujo-step[b-c5qu4me3qk] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--rg-text-muted, #94a3b8);
    padding: 0.25rem 0.6rem;
    border-radius: 0.375rem;
    transition: all 0.2s;
}
.flujo-step.active[b-c5qu4me3qk] {
    color: var(--rg-accent, #4f46e5);
    background: rgba(79,70,229,0.08);
    font-weight: 600;
}
.flujo-step.done[b-c5qu4me3qk] {
    color: #22c55e;
}
.flujo-num[b-c5qu4me3qk] {
    width: 1.4rem; height: 1.4rem;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.7rem; font-weight: 700;
    background: currentColor;
    color: #fff;
    flex-shrink: 0;
}
.flujo-step[b-c5qu4me3qk] { }
.flujo-step .flujo-num[b-c5qu4me3qk] { background: var(--rg-border, #e2e8f0); color: var(--rg-text-muted, #94a3b8); }
.flujo-step.active .flujo-num[b-c5qu4me3qk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.flujo-step.done .flujo-num[b-c5qu4me3qk] { background: #22c55e; color: #fff; }
.flujo-sep[b-c5qu4me3qk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.65rem; }

/* Tarjeta principal */
.trans-card[b-c5qu4me3qk] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    padding: 1.25rem;
}

/* Grid cabecera transferencia */
.trans-header-grid[b-c5qu4me3qk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

/* Form groups */
.form-group[b-c5qu4me3qk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-c5qu4me3qk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-c5qu4me3qk], .form-group select[b-c5qu4me3qk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-c5qu4me3qk], .form-group select:focus[b-c5qu4me3qk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Agregar línea */
.linea-add-row[b-c5qu4me3qk] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-end;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem;
    flex-wrap: wrap;
}

/* Búsqueda producto */
.prod-search-results[b-c5qu4me3qk] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-card, #fff);
    overflow: hidden;
    margin-bottom: 0.75rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.prod-search-item[b-c5qu4me3qk] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    font-size: 0.78rem;
}
.prod-search-item:last-child[b-c5qu4me3qk] { border-bottom: none; }
.prod-search-item:hover[b-c5qu4me3qk] { background: var(--rg-bg-hover, #f8fafc); }

/* Grid líneas */
.lineas-grid-wrapper[b-c5qu4me3qk] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: 220px;
    margin-bottom: 0.5rem;
}
.crud-table[b-c5qu4me3qk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c5qu4me3qk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c5qu4me3qk] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-c5qu4me3qk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c5qu4me3qk] { background: var(--rg-bg-hover, #f8fafc); }
.text-right[b-c5qu4me3qk] { text-align: right; }

/* Totales */
.totales-bar[b-c5qu4me3qk] {
    display: flex;
    gap: 1.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
}

/* Panel de confirmación (paso 2) */
.confirm-icon[b-c5qu4me3qk] {
    display: flex;
    justify-content: center;
    font-size: 3rem;
    color: var(--rg-accent, #4f46e5);
    margin-bottom: 1rem;
}
.confirm-title[b-c5qu4me3qk] {
    text-align: center;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0 0 0.5rem;
}
.confirm-desc[b-c5qu4me3qk] {
    text-align: center;
    font-size: 0.85rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0 0 0.5rem;
}

/* Utilities */
.font-mono[b-c5qu4me3qk] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-c5qu4me3qk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-c5qu4me3qk], .crud-empty-state[b-c5qu4me3qk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c5qu4me3qk] { font-size: 2rem; }
.spin[b-c5qu4me3qk] { animation: spin-b-c5qu4me3qk 0.8s linear infinite; }
@keyframes spin-b-c5qu4me3qk { to { transform: rotate(360deg); } }

@media (max-width: 768px) {
    .crud-container[b-c5qu4me3qk] { padding: 0.75rem; }
    .trans-header-grid[b-c5qu4me3qk] { grid-template-columns: repeat(2, 1fr); }
    .linea-add-row[b-c5qu4me3qk] { flex-direction: column; }
    .btn-text[b-c5qu4me3qk] { display: none; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-c5qu4me3qk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-c5qu4me3qk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-c5qu4me3qk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-c5qu4me3qk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptcancelacionultimafacturaemitida.razor.rz.scp.css */
/* ============================================================
   Frmoptcancelacionultimafacturaemitida — Optical v2
   ============================================================ */

.crud-container[b-33qk9hxqy1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-33qk9hxqy1 0.3s ease-out; }
@keyframes slideUp-b-33qk9hxqy1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-33qk9hxqy1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-33qk9hxqy1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-33qk9hxqy1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-33qk9hxqy1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-33qk9hxqy1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-33qk9hxqy1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-33qk9hxqy1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-33qk9hxqy1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-33qk9hxqy1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-outline[b-33qk9hxqy1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-33qk9hxqy1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-33qk9hxqy1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-33qk9hxqy1] { filter: brightness(1.1); }

/* Alert */
.crud-alert[b-33qk9hxqy1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-33qk9hxqy1] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-33qk9hxqy1] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-33qk9hxqy1] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-33qk9hxqy1] { color: #fca5a5; }
.crud-alert-close[b-33qk9hxqy1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Form */
.form-group[b-33qk9hxqy1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-33qk9hxqy1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-33qk9hxqy1], .form-group select[b-33qk9hxqy1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-33qk9hxqy1], .form-group select:focus[b-33qk9hxqy1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Tarjeta principal */
.cancel-card[b-33qk9hxqy1] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    padding: 1.5rem;
    max-width: 680px;
    margin: 0 auto;
}

/* Aviso */
.aviso-box[b-33qk9hxqy1] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    background: rgba(239,68,68,0.06);
    border: 1px solid rgba(239,68,68,0.25);
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
}
.aviso-icon[b-33qk9hxqy1] { font-size: 1.75rem; color: #ef4444; flex-shrink: 0; }
.aviso-box strong[b-33qk9hxqy1] { display: block; color: #991b1b; margin-bottom: 0.25rem; font-size: 0.85rem; }
.aviso-box p[b-33qk9hxqy1] { margin: 0; font-size: 0.8rem; color: var(--rg-text-secondary, #475569); line-height: 1.5; }
[data-mode="dark"] .aviso-box p[b-33qk9hxqy1] { color: var(--rg-text-muted, #94a3b8); }

/* Panel última factura */
.ultima-factura-panel[b-33qk9hxqy1] {
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 1rem;
}
.uf-header[b-33qk9hxqy1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.uf-numero[b-33qk9hxqy1] { font-size: 1.2rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.uf-sub[b-33qk9hxqy1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }
.uf-datos[b-33qk9hxqy1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; }
.uf-dato[b-33qk9hxqy1] { display: flex; flex-direction: column; gap: 0.15rem; }
.uf-label[b-33qk9hxqy1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.uf-value[b-33qk9hxqy1] { font-size: 0.82rem; color: var(--rg-text-primary, #1e293b); }

/* Badges */
.badge[b-33qk9hxqy1] { display: inline-flex; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-33qk9hxqy1] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-anulada[b-33qk9hxqy1] { background: rgba(239,68,68,0.12); color: #991b1b; }
[data-mode="dark"] .badge-yes[b-33qk9hxqy1] { color: #86efac; }
[data-mode="dark"] .badge-anulada[b-33qk9hxqy1] { color: #fca5a5; }

/* Utilities */
.font-mono[b-33qk9hxqy1] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-33qk9hxqy1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-33qk9hxqy1], .crud-empty-state[b-33qk9hxqy1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-33qk9hxqy1] { font-size: 2rem; }
.crud-spinner[b-33qk9hxqy1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-33qk9hxqy1 0.6s linear infinite; }
@keyframes spin-b-33qk9hxqy1 { to { transform: rotate(360deg); } }
.spin[b-33qk9hxqy1] { animation: spin-b-33qk9hxqy1 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-33qk9hxqy1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-33qk9hxqy1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-33qk9hxqy1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 440px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-33qk9hxqy1] { max-width: 440px; }
.modal-header[b-33qk9hxqy1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-33qk9hxqy1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-33qk9hxqy1] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-33qk9hxqy1] { color: #dc2626; }
.modal-close[b-33qk9hxqy1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-33qk9hxqy1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-33qk9hxqy1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

@media (max-width: 768px) {
    .crud-container[b-33qk9hxqy1] { padding: 0.75rem; }
    .uf-datos[b-33qk9hxqy1] { grid-template-columns: repeat(2, 1fr); }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-33qk9hxqy1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-33qk9hxqy1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-33qk9hxqy1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-33qk9hxqy1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptcasadistribuidormarca.razor.rz.scp.css */
/* ============================================================
   Frmoptcasadistribuidormarca — Catálogos Optical v2
   CSS isolation Blazor — basado en patrón Frmclientes.razor.css
   ============================================================ */

.crud-container[b-z22ycdid74] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-z22ycdid74 0.3s ease-out; }
@keyframes slideUp-b-z22ycdid74 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-z22ycdid74] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-z22ycdid74] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-z22ycdid74] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-z22ycdid74] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-z22ycdid74] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-z22ycdid74] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-z22ycdid74] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-z22ycdid74] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-z22ycdid74] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-z22ycdid74] { filter: brightness(1.1); }
.btn-outline[b-z22ycdid74] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-z22ycdid74] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-z22ycdid74] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-z22ycdid74] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-z22ycdid74] { background: rgba(79, 70, 229, 0.1); }

/* Alert */
.crud-alert[b-z22ycdid74] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-z22ycdid74] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-z22ycdid74]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-z22ycdid74] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-z22ycdid74]   { color: #fca5a5; }
.crud-alert-close[b-z22ycdid74] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tab de catálogos */
.cat-tabs[b-z22ycdid74] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; flex-wrap: wrap; }
.cat-tab[b-z22ycdid74] { background: none; border: none; padding: 0.6rem 1.1rem; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.cat-tab:hover[b-z22ycdid74] { color: var(--rg-text-primary, #1e293b); }
.cat-tab.active[b-z22ycdid74] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Panel contenedor */
.cat-panel[b-z22ycdid74] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 1rem; }

/* Catálogos simples (Grupos, Casas, Canales) */
.simple-cat[b-z22ycdid74] { display: flex; flex-direction: column; gap: 0.75rem; }
.cat-add-row[b-z22ycdid74] { display: flex; gap: 0.5rem; align-items: center; padding: 0.75rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; flex-wrap: wrap; }
.cat-input-id[b-z22ycdid74] { width: 110px; padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); font-family: monospace; }
.cat-input-desc[b-z22ycdid74] { flex: 1; min-width: 180px; padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); }
.cat-input-id:focus[b-z22ycdid74], .cat-input-desc:focus[b-z22ycdid74] { border-color: var(--rg-accent, #4f46e5); outline: none; box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Distribuidores/Marcas panel */
.dist-panel[b-z22ycdid74] { display: flex; flex-direction: column; gap: 0.75rem; }
.cat-header-row[b-z22ycdid74] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.5rem; }
.cat-count[b-z22ycdid74] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }

/* Grid */
.crud-grid-wrapper[b-z22ycdid74] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 340px); }
.crud-table[b-z22ycdid74] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-z22ycdid74] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-z22ycdid74] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-z22ycdid74] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-z22ycdid74] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-z22ycdid74] { width: 60px; text-align: center; }

/* Badges */
.badge[b-z22ycdid74] { display: inline-flex; align-items: center; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-z22ycdid74] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-z22ycdid74]  { background: var(--rg-bg-subtle,#f1f5f9); color: var(--rg-text-muted,#64748b); }
[data-mode="dark"] .badge-yes[b-z22ycdid74] { color: #86efac; }

/* Utilities */
.font-mono[b-z22ycdid74] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-z22ycdid74] { text-align: center; }
.text-muted[b-z22ycdid74] { color: var(--rg-text-muted,#94a3b8); font-size: 0.78rem; }

/* Loading */
.crud-loading[b-z22ycdid74] { display: flex; align-items: center; justify-content: center; padding: 2rem; gap: 0.75rem; color: var(--rg-text-muted,#94a3b8); }
.crud-spinner[b-z22ycdid74] { width: 1.5rem; height: 1.5rem; border: 3px solid var(--rg-border,#e2e8f0); border-top-color: var(--rg-accent,#4f46e5); border-radius: 50%; animation: spin-b-z22ycdid74 0.6s linear infinite; }
@keyframes spin-b-z22ycdid74 { to { transform: rotate(360deg); } }
.spin[b-z22ycdid74] { animation: spin-b-z22ycdid74 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-z22ycdid74] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-z22ycdid74] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-z22ycdid74] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 580px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-z22ycdid74] { max-width: 480px; }
.modal-header[b-z22ycdid74] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-z22ycdid74] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-z22ycdid74] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-z22ycdid74] { color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-hover,#f1f5f9); }
.modal-body[b-z22ycdid74] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-z22ycdid74] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-z22ycdid74] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-z22ycdid74] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-z22ycdid74] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary,#475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-z22ycdid74], .form-group select[b-z22ycdid74] {
    padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.375rem;
    font-size: 0.78rem; color: var(--rg-text-primary,#1e293b); background: var(--rg-bg-input,#fff); outline: none;
}
.form-group input:focus[b-z22ycdid74], .form-group select:focus[b-z22ycdid74] { border-color: var(--rg-accent,#4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }
.form-group input.readonly[b-z22ycdid74], .form-group input:disabled[b-z22ycdid74] { background: var(--rg-bg-subtle,#f8fafc); color: var(--rg-text-muted,#94a3b8); }

@media (max-width: 768px) {
    .crud-container[b-z22ycdid74] { padding: 0.75rem; }
    .cat-tabs[b-z22ycdid74] { overflow-x: auto; flex-wrap: nowrap; }
    .cat-tab[b-z22ycdid74] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
    .cat-add-row[b-z22ycdid74] { flex-direction: column; align-items: stretch; }
    .cat-input-id[b-z22ycdid74], .cat-input-desc[b-z22ycdid74] { width: 100%; }
    .form-row[b-z22ycdid74] { flex-direction: column; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-z22ycdid74] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-z22ycdid74] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-z22ycdid74] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-z22ycdid74] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptcsalidamercanciapordanos.razor.rz.scp.css */
/* ============================================================
   Frmoptcsalidamercanciapordanos — Salida por Daños Optical v2
   ============================================================ */

.crud-container[b-xw89djc0q3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xw89djc0q3 0.3s ease-out; }
@keyframes slideUp-b-xw89djc0q3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-xw89djc0q3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xw89djc0q3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xw89djc0q3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xw89djc0q3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xw89djc0q3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xw89djc0q3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xw89djc0q3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xw89djc0q3] { opacity: 0.6; cursor: not-allowed; }
.btn-sm[b-xw89djc0q3] { padding: 0.4rem 0.7rem; font-size: 0.75rem; }
.btn-primary[b-xw89djc0q3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xw89djc0q3] { filter: brightness(1.1); }
.btn-outline[b-xw89djc0q3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xw89djc0q3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xw89djc0q3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xw89djc0q3] { filter: brightness(1.1); }
.btn-icon[b-xw89djc0q3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-delete[b-xw89djc0q3] { color: #ef4444; }
.btn-delete:hover[b-xw89djc0q3] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-xw89djc0q3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xw89djc0q3] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-xw89djc0q3] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-xw89djc0q3] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-xw89djc0q3] { color: #fca5a5; }
.crud-alert-close[b-xw89djc0q3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tarjeta de ajuste */
.ajuste-card[b-xw89djc0q3] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.75rem;
    padding: 1.25rem;
}

/* Grid cabecera */
.ajuste-header-grid[b-xw89djc0q3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

/* Form groups */
.form-group[b-xw89djc0q3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-xw89djc0q3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xw89djc0q3], .form-group select[b-xw89djc0q3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-xw89djc0q3], .form-group select:focus[b-xw89djc0q3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Agregar línea */
.linea-add-row[b-xw89djc0q3] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-end;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

/* Búsqueda */
.prod-search-results[b-xw89djc0q3] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-card, #fff);
    overflow: hidden;
    margin-bottom: 0.75rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.prod-search-item[b-xw89djc0q3] {
    display: flex; gap: 0.75rem; align-items: center;
    padding: 0.5rem 0.75rem; cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #f1f5f9);
    font-size: 0.78rem;
}
.prod-search-item:last-child[b-xw89djc0q3] { border-bottom: none; }
.prod-search-item:hover[b-xw89djc0q3] { background: var(--rg-bg-hover, #f8fafc); }

/* Grid líneas */
.lineas-grid-wrapper[b-xw89djc0q3] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: 260px;
    margin-bottom: 0.5rem;
}
.crud-table[b-xw89djc0q3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xw89djc0q3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xw89djc0q3] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-xw89djc0q3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xw89djc0q3] { background: var(--rg-bg-hover, #f8fafc); }
.text-right[b-xw89djc0q3] { text-align: right; }
.text-danger[b-xw89djc0q3] { color: #ef4444; font-weight: 600; }

/* Totales */
.totales-bar[b-xw89djc0q3] {
    display: flex;
    gap: 1.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
}
.totales-total[b-xw89djc0q3] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }

/* Utilities */
.font-mono[b-xw89djc0q3] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-xw89djc0q3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xw89djc0q3], .crud-empty-state[b-xw89djc0q3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xw89djc0q3] { font-size: 2rem; }
.spin[b-xw89djc0q3] { animation: spin-b-xw89djc0q3 0.8s linear infinite; }
@keyframes spin-b-xw89djc0q3 { to { transform: rotate(360deg); } }

/* Modal */
.modal-backdrop[b-xw89djc0q3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-xw89djc0q3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xw89djc0q3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 460px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-xw89djc0q3] { max-width: 460px; }
.modal-header[b-xw89djc0q3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xw89djc0q3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xw89djc0q3] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-xw89djc0q3] { color: #dc2626; }
.modal-close[b-xw89djc0q3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-xw89djc0q3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xw89djc0q3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

@media (max-width: 768px) {
    .crud-container[b-xw89djc0q3] { padding: 0.75rem; }
    .ajuste-header-grid[b-xw89djc0q3] { grid-template-columns: repeat(2, 1fr); }
    .linea-add-row[b-xw89djc0q3] { flex-direction: column; }
    .btn-text[b-xw89djc0q3] { display: none; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-xw89djc0q3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xw89djc0q3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xw89djc0q3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xw89djc0q3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptmaestraproductos.razor.rz.scp.css */
/* ============================================================
   Frmoptmaestraproductos — CRUD Maestro de Productos Ópticos
   CSS isolation Blazor — copia del patrón Frmclientes.razor.css
   ============================================================ */

.crud-container[b-4lch7mbg9o] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4lch7mbg9o 0.3s ease-out; }
@keyframes slideUp-b-4lch7mbg9o { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4lch7mbg9o] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4lch7mbg9o] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4lch7mbg9o] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4lch7mbg9o] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4lch7mbg9o] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4lch7mbg9o] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4lch7mbg9o] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4lch7mbg9o] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4lch7mbg9o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4lch7mbg9o] { filter: brightness(1.1); }
.btn-outline[b-4lch7mbg9o] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4lch7mbg9o] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4lch7mbg9o] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4lch7mbg9o] { filter: brightness(1.1); }
.btn-icon[b-4lch7mbg9o] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4lch7mbg9o] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4lch7mbg9o] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4lch7mbg9o] { color: #ef4444; }
.btn-delete:hover[b-4lch7mbg9o] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-4lch7mbg9o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4lch7mbg9o] { background: rgba(34, 197, 94, 0.12); color: #166534; border: 1px solid rgba(34, 197, 94, 0.3); }
.crud-alert.error[b-4lch7mbg9o]   { background: rgba(239, 68, 68, 0.1); color: #991b1b; border: 1px solid rgba(239, 68, 68, 0.3); }
[data-mode="dark"] .crud-alert.success[b-4lch7mbg9o] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-4lch7mbg9o]   { color: #fca5a5; }
.crud-alert-close[b-4lch7mbg9o] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4lch7mbg9o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-4lch7mbg9o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 0.15rem; }
.crud-search-bar input[b-4lch7mbg9o] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4lch7mbg9o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4lch7mbg9o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4lch7mbg9o] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4lch7mbg9o] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4lch7mbg9o] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4lch7mbg9o] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4lch7mbg9o] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4lch7mbg9o] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4lch7mbg9o] { width: 80px; text-align: center; white-space: nowrap; }

/* Producto icon mini */
.prod-icon[b-4lch7mbg9o] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-subtle, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1rem; }

/* Badges */
.badge[b-4lch7mbg9o] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4lch7mbg9o]   { background: rgba(34, 197, 94, 0.15); color: #166534; }
.badge-no[b-4lch7mbg9o]    { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
.badge-lote[b-4lch7mbg9o]  { background: rgba(79, 70, 229, 0.12); color: #4338ca; }
.badge-rx[b-4lch7mbg9o]    { background: rgba(234, 179, 8, 0.15); color: #854d0e; }
[data-mode="dark"] .badge-yes[b-4lch7mbg9o]  { color: #86efac; }
[data-mode="dark"] .badge-lote[b-4lch7mbg9o] { color: #a5b4fc; }
[data-mode="dark"] .badge-rx[b-4lch7mbg9o]   { color: #fde68a; }
.ms-1[b-4lch7mbg9o] { margin-left: 0.25rem; }

/* Utilities */
.font-mono[b-4lch7mbg9o] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4lch7mbg9o] { text-align: center; }
.text-muted[b-4lch7mbg9o] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4lch7mbg9o], .crud-empty-state[b-4lch7mbg9o] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4lch7mbg9o] { font-size: 2rem; }
.crud-spinner[b-4lch7mbg9o] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4lch7mbg9o 0.6s linear infinite; }
@keyframes spin-b-4lch7mbg9o { to { transform: rotate(360deg); } }
.spin[b-4lch7mbg9o] { animation: spin-b-4lch7mbg9o 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-4lch7mbg9o] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4lch7mbg9o 0.15s ease-out; }
.modal-container[b-4lch7mbg9o] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4lch7mbg9o] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4lch7mbg9o 0.2s ease-out; }
.modal-lg[b-4lch7mbg9o] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); }
.modal-sm[b-4lch7mbg9o] { max-width: 420px; }
@keyframes fadeIn-b-4lch7mbg9o { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4lch7mbg9o { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4lch7mbg9o] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4lch7mbg9o] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4lch7mbg9o] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-4lch7mbg9o] { color: #dc2626; }
.modal-close[b-4lch7mbg9o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4lch7mbg9o] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4lch7mbg9o] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4lch7mbg9o] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4lch7mbg9o] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4lch7mbg9o] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4lch7mbg9o] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4lch7mbg9o] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4lch7mbg9o] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4lch7mbg9o] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4lch7mbg9o] { flex: 2; }
.form-group label[b-4lch7mbg9o] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4lch7mbg9o], .form-group select[b-4lch7mbg9o], .form-textarea[b-4lch7mbg9o] {
    padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem;
    font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff);
    outline: none; transition: border-color 0.15s;
}
.form-group input:focus[b-4lch7mbg9o], .form-group select:focus[b-4lch7mbg9o], .form-textarea:focus[b-4lch7mbg9o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4lch7mbg9o], .form-group input:disabled[b-4lch7mbg9o] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4lch7mbg9o] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4lch7mbg9o] { flex: 1; display: flex; align-items: center; }
.form-check[b-4lch7mbg9o] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4lch7mbg9o] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Grid de opciones (tab Opciones) */
.opts-grid[b-4lch7mbg9o] { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0.6rem; padding: 0.5rem 0; }

.opts-check-card[b-4lch7mbg9o] {
    display: flex; align-items: flex-start; gap: 0.65rem;
    padding: 0.7rem 0.9rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}
.opts-check-card:hover[b-4lch7mbg9o] { border-color: var(--rg-primary); box-shadow: 0 1px 6px rgba(26,58,92,.08); }
.opts-check-card input[type="checkbox"][b-4lch7mbg9o] { width: 1rem; height: 1rem; margin-top: 2px; accent-color: var(--rg-primary); flex-shrink: 0; }
.opts-check-info[b-4lch7mbg9o] { display: flex; flex-direction: column; gap: 3px; }
.opts-check-title[b-4lch7mbg9o] { font-size: 0.8rem; font-weight: 600; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.35rem; }
.opts-check-legend[b-4lch7mbg9o] { font-size: 0.7rem; color: var(--rg-text-muted); line-height: 1.4; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4lch7mbg9o] { padding: 0.75rem; }
    .crud-header[b-4lch7mbg9o] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-4lch7mbg9o] { display: none; }
    .form-row[b-4lch7mbg9o] { flex-direction: column; }
    .modal-lg[b-4lch7mbg9o] { width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4lch7mbg9o] { padding: 0.75rem; }
    .modal-tabs[b-4lch7mbg9o] { overflow-x: auto; }
    .modal-tab[b-4lch7mbg9o] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }
    .opts-grid[b-4lch7mbg9o] { grid-template-columns: 1fr; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-4lch7mbg9o] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4lch7mbg9o] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4lch7mbg9o] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4lch7mbg9o] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptmasteroptical.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════════════════════
   POS Optical — Frmoptmasteroptical.razor.css
   Full-page card-based POS: izquierda catálogo | derecha documento
   Tokens --rg-* para soporte dark/light completo
   ══════════════════════════════════════════════════════════════════════════ */

.pos-wrapper[b-edww6tyguq] {
    display: flex;
    flex-direction: column;
    /* 60px = app-header height  |  3rem = padding 1.5rem top + 1.5rem bottom de app-content */
    height: calc(100vh - 60px - 3rem);
    background: var(--rg-bg-page);
    overflow: hidden;
}

/* ── Barra de modo ── */
.pos-modebar[b-edww6tyguq] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 14px;
    background: var(--rg-bg-card);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.pos-mode-toggle[b-edww6tyguq] {
    display: inline-flex;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    overflow: hidden;
}
.pos-mode-btn[b-edww6tyguq] {
    border: none;
    padding: 6px 16px;
    background: var(--rg-bg-card);
    color: var(--rg-text-secondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border-right: 1px solid var(--rg-border);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    transition: background .15s, color .15s;
}
.pos-mode-btn:last-child[b-edww6tyguq] { border-right: none; }
.pos-mode-btn:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-mode-btn.active.cot[b-edww6tyguq] { background: #e85d00; color: #fff; }
.pos-mode-btn.active.fac[b-edww6tyguq] { background: var(--rg-primary); color: #fff; }
.pos-mode-tag[b-edww6tyguq] { font-size: 9px; opacity: .75; letter-spacing: .06em; text-transform: uppercase; }

.pos-modebar-right[b-edww6tyguq] { margin-left: auto; display: flex; align-items: center; gap: 8px; }
/* ── Toast de alerta flotante (reemplaza pos-flash) ── */
.pos-toast[b-edww6tyguq] {
    display: flex; align-items: flex-start; gap: 8px;
    padding: 10px 14px; border-radius: 6px;
    font-size: 12.5px; line-height: 1.4;
    border-left: 4px solid transparent;
    margin: 0 8px 4px;
    animation: pos-toast-in-b-edww6tyguq .2s ease;
}
@keyframes pos-toast-in-b-edww6tyguq { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.pos-toast.success[b-edww6tyguq] { background: rgba(34,197,94,.12); color: #166534; border-left-color: #16a34a; }
.pos-toast.error[b-edww6tyguq]   { background: rgba(239,68,68,.12); color: #b91c1c; border-left-color: #dc2626; }
[data-mode="dark"] .pos-toast.success[b-edww6tyguq] { background: rgba(34,197,94,.15); color: #86efac; }
[data-mode="dark"] .pos-toast.error[b-edww6tyguq]   { background: rgba(239,68,68,.15); color: #fca5a5; }
.pos-toast i[b-edww6tyguq] { flex-shrink: 0; margin-top: 1px; }
.pos-toast-text[b-edww6tyguq] { flex: 1; white-space: normal; word-break: break-word; }
.pos-toast-close[b-edww6tyguq] { border: none; background: transparent; cursor: pointer; color: inherit; padding: 0; margin-left: 4px; opacity: .7; flex-shrink: 0; }
.pos-toast-close:hover[b-edww6tyguq] { opacity: 1; }

/* ── Banner modo ── */
.pos-banner[b-edww6tyguq] { padding: 4px 14px; font-size: 11px; flex-shrink: 0; border-bottom: 1px solid var(--rg-border); }
.pos-banner.cot[b-edww6tyguq] { background: rgba(180,83,9,.08); color: #c44d00; }
.pos-banner.fac[b-edww6tyguq] { background: rgba(26,58,92,.08);  color: var(--rg-primary); }
[data-mode="dark"] .pos-banner.cot[b-edww6tyguq] { background: rgba(251,191,36,.08); color: #fde68a; }
[data-mode="dark"] .pos-banner.fac[b-edww6tyguq] { background: rgba(96,165,250,.08); color: #93c5fd; }

/* ── Cabecera documento ── */
.pos-docheader[b-edww6tyguq] { background: var(--rg-bg-card); border-bottom: 1px solid var(--rg-border); padding: 7px 14px; flex-shrink: 0; }
.pos-docheader-grid[b-edww6tyguq] { display: grid; grid-template-columns: 110px 2fr 1fr 1fr; gap: 6px 10px; align-items: end; }
.pos-doc-num-wrap[b-edww6tyguq] { display: flex; flex-direction: column; gap: 2px; }
.pos-doc-num-label[b-edww6tyguq] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; color: var(--rg-text-muted); }
.pos-doc-num[b-edww6tyguq] { font-family: monospace; font-size: 14px; font-weight: 700; line-height: 1; }
.pos-doc-num.cot[b-edww6tyguq] { color: #e85d00; }
.pos-doc-num.fac[b-edww6tyguq] { color: var(--rg-primary); }
[data-mode="dark"] .pos-doc-num.cot[b-edww6tyguq] { color: #fde68a; }

.pos-field[b-edww6tyguq] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pos-field label[b-edww6tyguq] { font-size: 9px; text-transform: uppercase; letter-spacing: .06em; color: var(--rg-text-muted); font-weight: 600; }
.pos-lbl-opt[b-edww6tyguq] { font-weight: 400; letter-spacing: 0; text-transform: none; }
.pos-field-group[b-edww6tyguq] { display: flex; gap: 6px; align-items: flex-end; }
.pos-field-group .pos-field[b-edww6tyguq] { flex: 1; min-width: 80px; }

.pos-inp[b-edww6tyguq] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 3px; padding: 5px 7px; font-size: 12px; width: 100%; }
.pos-inp:focus[b-edww6tyguq] { outline: none; border-color: var(--rg-primary); box-shadow: 0 0 0 2px rgba(26,58,92,.15); }
/* Campo obligatorio no completado */
.pos-inp-error[b-edww6tyguq] { border-color: var(--rg-danger) !important; box-shadow: 0 0 0 2px rgba(220,38,38,.2) !important; }
[data-mode="dark"] .pos-inp-error[b-edww6tyguq] { border-color: #f87171 !important; box-shadow: 0 0 0 2px rgba(248,113,113,.25) !important; }

.pos-cliente-row[b-edww6tyguq] { display: flex; gap: 3px; }
.pos-cliente-row .pos-inp[b-edww6tyguq] { flex: 1; }
.pos-btn-buscar[b-edww6tyguq], .pos-btn-clear[b-edww6tyguq] { border: 1px solid var(--rg-border); background: var(--rg-bg-input); color: var(--rg-text-secondary); border-radius: 3px; width: 27px; cursor: pointer; font-size: 12px; flex-shrink: 0; }
.pos-btn-buscar:hover[b-edww6tyguq] { background: var(--rg-primary); color: #fff; }
.pos-btn-clear:hover[b-edww6tyguq]  { background: rgba(239,68,68,.12); color: #b91c1c; }
.pos-cliente-nombre[b-edww6tyguq] { font-size: 10px; color: var(--rg-text-secondary); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }

/* Insignia exento ITBIS (NCF-114) */
.pos-badge-exento[b-edww6tyguq] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    background: rgba(16, 185, 129, 0.15);
    color: #065f46;
    border: 1px solid rgba(16, 185, 129, 0.35);
    white-space: nowrap;
}
[data-mode="dark"] .pos-badge-exento[b-edww6tyguq] { color: #6ee7b7; border-color: rgba(16,185,129,.4); }

/* ── Cuerpo principal ── */
.pos-main[b-edww6tyguq] { display: grid; grid-template-columns: 1fr 370px; flex: 1; overflow: hidden; }

/* ════ Panel izquierdo catálogo ════ */
.pos-left[b-edww6tyguq] { display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid var(--rg-border); }

.pos-filterbar[b-edww6tyguq] { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; padding: 7px 10px; background: var(--rg-bg-card); border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.pos-search-box[b-edww6tyguq] { position: relative; flex-shrink: 0; width: 200px; }
.pos-search-icon[b-edww6tyguq] { position: absolute; left: 7px; top: 50%; transform: translateY(-50%); color: var(--rg-text-muted); font-size: 11px; pointer-events: none; }
.pos-search-box input[b-edww6tyguq] { width: 100%; padding: 5px 24px 5px 24px; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 3px; font-size: 12px; }
.pos-search-box input:focus[b-edww6tyguq] { outline: none; border-color: var(--rg-primary); }
.pos-search-clear[b-edww6tyguq] { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; font-size: 11px; padding: 0; }

.pos-chips[b-edww6tyguq] { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.pos-chip[b-edww6tyguq] { padding: 3px 9px; border: 1px solid var(--rg-border); border-radius: 16px; background: var(--rg-bg-card); color: var(--rg-text-secondary); font-size: 11px; cursor: pointer; transition: all .12s; white-space: nowrap; }
.pos-chip:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-chip.active[b-edww6tyguq] { background: var(--rg-text-primary); color: var(--rg-bg-card); border-color: var(--rg-text-primary); }
.pos-chip-count[b-edww6tyguq] { margin-left: 2px; font-size: 9px; opacity: .7; }

.pos-catalog-loading[b-edww6tyguq], .pos-catalog-empty[b-edww6tyguq] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; flex: 1; color: var(--rg-text-muted); font-size: 13px; }
.pos-catalog-empty i[b-edww6tyguq] { font-size: 2.5rem; opacity: .35; }

/* ── Grid de tarjetas ── */
.pos-cardgrid[b-edww6tyguq] { flex: 1; overflow-y: auto; padding: 8px; display: grid; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 7px; align-content: start; }
.pos-card[b-edww6tyguq] { background: var(--rg-bg-card); border: 1.5px solid var(--rg-border); border-radius: 6px; padding: 9px 10px 9px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; text-align: left; position: relative; transition: transform .14s, box-shadow .14s, border-color .14s, background .14s; font-family: inherit; }
.pos-card:hover[b-edww6tyguq] { box-shadow: 0 6px 18px rgba(0,0,0,.13); transform: translateY(-2px) scale(1.01); }
.pos-card:active[b-edww6tyguq] { transform: translateY(0) scale(.98); box-shadow: inset 0 2px 6px rgba(0,0,0,.15); }
.pos-card.in-doc[b-edww6tyguq] { border-color: var(--rg-primary); background: rgba(26,58,92,.06); }
[data-mode="dark"] .pos-card.in-doc[b-edww6tyguq] { background: rgba(96,165,250,.08); }
.pos-card-qty[b-edww6tyguq] { position: absolute; top: -7px; right: -7px; background: var(--rg-primary); color: #fff; width: 20px; height: 20px; border-radius: 50%; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 4px rgba(0,0,0,.15); }
.pos-card-code[b-edww6tyguq]  { font-family: monospace; font-size: 9px; color: var(--rg-text-muted); letter-spacing: .04em; margin-top: 2px; }
.pos-card-name[b-edww6tyguq]  { font-size: 11px; font-weight: 600; line-height: 1.3; color: var(--rg-text-primary); flex: 1; }
.pos-card-price[b-edww6tyguq] { font-family: monospace; font-size: 13px; font-weight: 800; color: var(--rg-text-primary); display: flex; align-items: center; gap: 3px; }

/* ── Paleta de colores — solo el precio de cada tarjeta ── */
.pos-card-color-0 .pos-card-price[b-edww6tyguq] { color: #6366f1; }
.pos-card-color-1 .pos-card-price[b-edww6tyguq] { color: #0ea5e9; }
.pos-card-color-2 .pos-card-price[b-edww6tyguq] { color: #10b981; }
.pos-card-color-3 .pos-card-price[b-edww6tyguq] { color: #d97706; }
.pos-card-color-4 .pos-card-price[b-edww6tyguq] { color: #ef4444; }
.pos-card-color-5 .pos-card-price[b-edww6tyguq] { color: #8b5cf6; }
.pos-card-color-6 .pos-card-price[b-edww6tyguq] { color: #ec4899; }
.pos-card-color-7 .pos-card-price[b-edww6tyguq] { color: #14b8a6; }
.pos-card-color-8 .pos-card-price[b-edww6tyguq] { color: #f97316; }
.pos-card-color-9 .pos-card-price[b-edww6tyguq] { color: #65a30d; }
[data-mode="dark"] .pos-card-color-9 .pos-card-price[b-edww6tyguq] { color: #a3e635; }

/* Tag s/ITBIS en tarjeta de producto (cliente exento NCF-114) */
.pos-card-exento-tag[b-edww6tyguq] {
    font-family: sans-serif;
    font-size: 8px;
    font-weight: 700;
    padding: 1px 4px;
    border-radius: 2px;
    background: rgba(16, 185, 129, 0.2);
    color: #065f46;
    letter-spacing: .03em;
    text-transform: uppercase;
}
[data-mode="dark"] .pos-card-exento-tag[b-edww6tyguq] { color: #6ee7b7; }
.pos-card-meta[b-edww6tyguq]  { display: flex; gap: 3px; flex-wrap: wrap; margin-top: 2px; }
.pos-badge[b-edww6tyguq]      { font-size: 8px; padding: 1px 4px; border-radius: 2px; font-weight: 700; letter-spacing: .04em; }
.pos-badge.svc[b-edww6tyguq]  { background: rgba(59,130,246,.15); color: #1e40af; }
.pos-badge.fifo[b-edww6tyguq] { background: rgba(139,92,246,.15); color: #5b21b6; }
.pos-badge.rx[b-edww6tyguq]   { background: rgba(16,185,129,.15); color: #065f46; }
[data-mode="dark"] .pos-badge.svc[b-edww6tyguq]  { color: #93c5fd; }
[data-mode="dark"] .pos-badge.fifo[b-edww6tyguq] { color: #c4b5fd; }
[data-mode="dark"] .pos-badge.rx[b-edww6tyguq]   { color: #6ee7b7; }

/* ════ Panel derecho documento ════ */
.pos-right[b-edww6tyguq] { display: flex; flex-direction: column; background: var(--rg-bg-card); overflow: hidden; }
.pos-panel-head[b-edww6tyguq] { padding: 9px 13px 7px; border-bottom: 1px solid var(--rg-border); display: flex; justify-content: space-between; align-items: baseline; flex-shrink: 0; }
.pos-panel-title[b-edww6tyguq] { font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rg-text-secondary); }
.pos-panel-count[b-edww6tyguq] { font-size: 9px; color: var(--rg-text-muted); font-family: monospace; }

.pos-lines-empty[b-edww6tyguq] { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--rg-text-muted); font-size: 12px; font-style: italic; }
.pos-lines-empty i[b-edww6tyguq] { font-size: 2rem; opacity: .3; }
.pos-lines[b-edww6tyguq] { flex: 1; overflow-y: auto; }

.pos-line[b-edww6tyguq] { padding: 7px 12px; border-bottom: 1px solid var(--rg-border); transition: background .1s; }
.pos-line:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-line-top[b-edww6tyguq] { display: flex; align-items: flex-start; gap: 6px; justify-content: space-between; }
.pos-line-name[b-edww6tyguq] { font-size: 11px; font-weight: 500; line-height: 1.3; flex: 1; min-width: 0; }
.pos-line-code[b-edww6tyguq] { font-family: monospace; font-size: 9px; color: var(--rg-text-muted); margin-right: 3px; }
.pos-line-controls[b-edww6tyguq] { display: flex; align-items: center; gap: 3px; flex-shrink: 0; }
.pos-qty-stepper[b-edww6tyguq] { display: inline-flex; align-items: center; background: var(--rg-bg-subtle); border-radius: 3px; overflow: hidden; border: 1px solid var(--rg-border); }
.pos-qty-stepper button[b-edww6tyguq] { width: 20px; height: 20px; border: none; background: transparent; cursor: pointer; font-size: 13px; color: var(--rg-text-secondary); font-weight: 700; }
.pos-qty-stepper button:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-qty-stepper span[b-edww6tyguq] { width: 26px; text-align: center; font-family: monospace; font-size: 12px; font-weight: 600; color: var(--rg-text-primary); }
.pos-btn-rm[b-edww6tyguq] { width: 18px; height: 18px; border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; font-size: 14px; border-radius: 3px; line-height: 1; padding: 0; }
.pos-btn-rm:hover[b-edww6tyguq] { background: rgba(239,68,68,.12); color: #b91c1c; }
.pos-line-detail[b-edww6tyguq] { display: flex; justify-content: space-between; margin-top: 2px; }
.pos-line-lbl[b-edww6tyguq] { font-size: 9px; color: var(--rg-text-muted); }
.pos-line-subtotal[b-edww6tyguq] { font-family: monospace; font-size: 11px; font-weight: 600; color: var(--rg-text-primary); }

/* ── Totales ── */
.pos-totals[b-edww6tyguq] { border-top: 2px solid var(--rg-text-primary); padding: 9px 13px; background: var(--rg-bg-subtle); flex-shrink: 0; }
.pos-total-row[b-edww6tyguq] { display: flex; justify-content: space-between; align-items: baseline; padding: 2px 0; font-size: 12px; color: var(--rg-text-secondary); }
.pos-total-row.grand[b-edww6tyguq] { border-top: 1px solid var(--rg-border); margin-top: 5px; padding-top: 6px; }
.pos-total-row.grand span:first-child[b-edww6tyguq] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rg-text-primary); }
.pos-grand-value[b-edww6tyguq] { font-size: 19px; font-weight: 700; color: var(--rg-text-primary); font-family: monospace; }

/* ── Receta + QR ── */
.pos-receta-bar[b-edww6tyguq] { display: flex; align-items: center; gap: 4px; padding: 5px 9px; border-top: 1px solid var(--rg-border); border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.pos-receta-toggle[b-edww6tyguq] { flex: 1; display: flex; align-items: center; gap: 5px; padding: 5px 7px; background: transparent; border: 1px solid var(--rg-border); border-radius: 4px; color: var(--rg-text-secondary); font-size: 11px; cursor: pointer; }
.pos-receta-toggle:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-receta-toggle.open[b-edww6tyguq] { background: rgba(16,185,129,.08); border-color: rgba(16,185,129,.3); }
.pos-chevron[b-edww6tyguq] { margin-left: auto; font-size: 10px; }
.pos-qr-btn[b-edww6tyguq] { width: 32px; height: 32px; border: 1px solid var(--rg-border); border-radius: 4px; background: var(--rg-bg-subtle); color: var(--rg-text-secondary); cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; transition: all .15s; }
.pos-qr-btn:hover[b-edww6tyguq] { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }

/* ── Panel receta ── */
.pos-receta-panel[b-edww6tyguq] { padding: 7px 9px; border-bottom: 1px solid var(--rg-border); background: var(--rg-bg-subtle); flex-shrink: 0; }
.pos-rx-grid[b-edww6tyguq] { display: flex; flex-direction: column; gap: 3px; }
.pos-rx-header[b-edww6tyguq], .pos-rx-row[b-edww6tyguq] { display: grid; grid-template-columns: 22px repeat(6, 1fr); gap: 2px; align-items: center; }
.pos-rx-header span[b-edww6tyguq] { font-size: 8px; text-transform: uppercase; letter-spacing: .06em; color: var(--rg-text-muted); text-align: center; }
.pos-rx-ojo[b-edww6tyguq] { font-size: 9px; font-weight: 700; color: var(--rg-text-secondary); text-align: center; }
.pos-rx-inp[b-edww6tyguq] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 2px; padding: 3px 2px; font-size: 10px; text-align: center; width: 100%; font-family: monospace; }
.pos-rx-inp:focus[b-edww6tyguq] { outline: none; border-color: var(--rg-primary); }

/* ── Acciones ── */
.pos-actions[b-edww6tyguq] { padding: 9px 12px; background: var(--rg-text-primary); display: flex; gap: 7px; flex-shrink: 0; }
.pos-btn-cancel[b-edww6tyguq] { background: transparent; color: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.2); border-radius: 3px; padding: 8px 12px; font-size: 13px; font-weight: 500; cursor: pointer; }
.pos-btn-cancel:hover[b-edww6tyguq] { background: rgba(255,255,255,.08); }
.pos-btn-cancel:disabled[b-edww6tyguq] { opacity: .4; cursor: default; }
.pos-btn-save[b-edww6tyguq] { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 14px; border: none; border-radius: 3px; font-size: 14px; font-weight: 600; cursor: pointer; color: #fff; }
.pos-btn-save.cot[b-edww6tyguq] { background: #e85d00; }
.pos-btn-save.cot:hover:not(:disabled)[b-edww6tyguq] { background: #c44d00; }
.pos-btn-save.fac[b-edww6tyguq] { background: #0d4f4b; }
.pos-btn-save.fac:hover:not(:disabled)[b-edww6tyguq] { background: #0a3f3c; }
.pos-btn-save:disabled[b-edww6tyguq] { opacity: .45; cursor: default; }

/* ── Modal QR ── */
.pos-qr-modal[b-edww6tyguq]  { max-width: 340px; }
.pos-qr-img[b-edww6tyguq]    { width: 190px; height: 190px; border: 4px solid var(--rg-border); border-radius: 6px; }
.pos-qr-instruccion[b-edww6tyguq] { font-size: 12px; color: var(--rg-text-secondary); margin-bottom: .75rem; line-height: 1.5; }

/* ── Post-grabado ── */
.ps-modal[b-edww6tyguq] { max-width: 320px; }
.ps-recibo-info[b-edww6tyguq] { display: flex; align-items: baseline; gap: .5rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .5rem; padding: .55rem .75rem; margin-bottom: .4rem; }
.ps-label[b-edww6tyguq] { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted); }
.ps-value[b-edww6tyguq] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); }
.ps-cliente-info[b-edww6tyguq] { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--rg-text-secondary); margin-bottom: .8rem; }
.ps-acciones[b-edww6tyguq] { display: flex; flex-direction: column; gap: .4rem; }
.ps-acciones .btn-crud[b-edww6tyguq] { width: 100%; justify-content: center; }
.ps-pdf-error[b-edww6tyguq] { font-size: .78rem; color: var(--rg-danger); display: flex; align-items: center; gap: .3rem; padding: .25rem 0; }

/* ── Modal PDF Viewer (anidado) ── */
.modal-backdrop-nested[b-edww6tyguq]  { z-index: 2000 !important; background: rgba(0,0,0,.5) !important; }
.modal-container-nested[b-edww6tyguq] { z-index: 2001 !important; }
.pdf-viewer-dialog[b-edww6tyguq] { max-width: 900px; width: 92vw; height: 85vh; }
.pdf-viewer-body[b-edww6tyguq] { padding: 0; overflow: hidden; display: flex; flex: 1; }
.pdf-iframe[b-edww6tyguq] { width: 100%; height: 100%; border: none; flex: 1; }

/* ── Modal Envío ── */
.envio-form-group[b-edww6tyguq] { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .75rem; }
.envio-label[b-edww6tyguq] { display: flex; align-items: center; gap: .4rem; font-size: .8rem; font-weight: 600; color: var(--rg-text-secondary); }
.envio-input[b-edww6tyguq] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 6px; padding: .45rem .65rem; font-size: .88rem; width: 100%; }
.envio-input:focus[b-edww6tyguq] { border-color: var(--rg-primary); outline: none; box-shadow: 0 0 0 3px rgba(26,58,92,.15); }
.envio-input:disabled[b-edww6tyguq] { opacity: .55; cursor: not-allowed; }
.crud-alert.error[b-edww6tyguq] { background: rgba(239,68,68,.12); color: #991b1b; border: 1px solid rgba(239,68,68,.25); }
[data-mode="dark"] .crud-alert.error[b-edww6tyguq] { color: #fca5a5; }

/* ── Modales (CSS isolation — necesario en cada componente) ── */
.modal-backdrop[b-edww6tyguq] { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1000; }
.modal-container[b-edww6tyguq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-edww6tyguq] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 8px; display: flex; flex-direction: column; max-height: 90vh; pointer-events: all; width: 90vw; }
.modal-dialog.modal-sm[b-edww6tyguq] { max-width: 400px; }
.modal-header[b-edww6tyguq] { display: flex; align-items: center; justify-content: space-between; padding: .85rem 1.1rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-edww6tyguq] { margin: 0; font-size: .95rem; color: var(--rg-text-primary); display: flex; align-items: center; gap: .5rem; }
.modal-close[b-edww6tyguq] { border: none; background: transparent; cursor: pointer; color: var(--rg-text-muted); font-size: .95rem; padding: .2rem .4rem; border-radius: 4px; }
.modal-close:hover[b-edww6tyguq] { background: var(--rg-bg-hover); color: var(--rg-danger); }
.modal-body[b-edww6tyguq] { padding: 1.1rem; overflow-y: auto; flex: 1; color: var(--rg-text-primary); }
.modal-footer[b-edww6tyguq] { padding: .75rem 1.1rem; border-top: 1px solid var(--rg-border); display: flex; gap: .5rem; justify-content: flex-end; flex-shrink: 0; }

/* ── Helpers ── */
.btn-crud[b-edww6tyguq] { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer; border: 1px solid transparent; transition: all .15s; }
.btn-crud.btn-primary[b-edww6tyguq] { background: var(--rg-primary); color: #fff; }
.btn-crud.btn-primary:hover[b-edww6tyguq] { opacity: .9; }
.btn-crud.btn-outline[b-edww6tyguq] { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-crud.btn-outline:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }
.btn-crud.btn-sm[b-edww6tyguq] { padding: 5px 10px; font-size: 12px; }
.btn-crud:disabled[b-edww6tyguq] { opacity: .45; cursor: default; }
.crud-spinner[b-edww6tyguq] { width: 26px; height: 26px; border: 3px solid var(--rg-border); border-top-color: var(--rg-primary); border-radius: 50%; animation: spin-pos-b-edww6tyguq .7s linear infinite; }
.crud-alert[b-edww6tyguq] { display: flex; align-items: center; gap: 8px; padding: .55rem .9rem; border-radius: 6px; font-size: 12px; }
.crud-alert.success[b-edww6tyguq] { background: rgba(34,197,94,.12); color: #166534; }
[data-mode="dark"] .crud-alert.success[b-edww6tyguq] { color: #86efac; }
.font-mono[b-edww6tyguq] { font-family: monospace; }
.ms-1[b-edww6tyguq] { margin-left: 4px; }
.ms-auto[b-edww6tyguq] { margin-left: auto; }
.spin[b-edww6tyguq] { animation: spin-pos-b-edww6tyguq .7s linear infinite; }

@keyframes spin-pos-b-edww6tyguq { to { transform: rotate(360deg); } }

/* ── Edición inline precio/descuento por línea ── */
.pos-line-detail[b-edww6tyguq] { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; gap: 6px; }
.pos-line-edit[b-edww6tyguq]   { display: flex; gap: 6px; align-items: flex-end; }
.pos-inp-mini-group[b-edww6tyguq] { display: flex; flex-direction: column; gap: 1px; }
.pos-mini-lbl[b-edww6tyguq]    { font-size: 8px; text-transform: uppercase; letter-spacing: .05em; color: var(--rg-text-muted); font-weight: 600; }
.pos-inp-mini[b-edww6tyguq]    { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 3px; padding: 3px 5px; font-size: 11px; font-family: monospace; width: 70px; }
.pos-inp-mini:focus[b-edww6tyguq] { outline: none; border-color: var(--rg-primary); }

/* ── Descuento global / VIP ── */
.pos-global-discount-bar[b-edww6tyguq] { padding: 5px 12px; border-top: 1px solid var(--rg-border); background: var(--rg-bg-subtle); flex-shrink: 0; }
.pos-global-discount-row[b-edww6tyguq] { display: flex; align-items: center; gap: 5px; margin-top: 2px; }
.pos-global-discount-row .pos-inp[b-edww6tyguq] { width: 70px; text-align: right; font-family: monospace; }
.pos-global-discount-row .pos-lbl-opt[b-edww6tyguq] { font-size: 11px; color: var(--rg-text-secondary); }

/* ── FAB flotante ── */
.pos-fab-container[b-edww6tyguq] { position: fixed; bottom: 20px; right: 22px; z-index: 900; }
.pos-fab[b-edww6tyguq] {
    display: flex; align-items: center; gap: 8px;
    padding: 10px 16px; border-radius: 30px; border: none; cursor: pointer;
    color: #fff; font-size: 14px; font-weight: 600;
    box-shadow: 0 4px 16px rgba(0,0,0,.3);
    transition: transform .15s, box-shadow .15s;
}
.pos-fab.cot[b-edww6tyguq] { background: #e85d00; }
.pos-fab.fac[b-edww6tyguq] { background: var(--rg-primary); }
.pos-fab:hover:not(:disabled)[b-edww6tyguq] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.35); }
.pos-fab:disabled[b-edww6tyguq] { opacity: .5; cursor: default; }
.pos-fab.pos-fab-disabled[b-edww6tyguq] {
    background: var(--rg-bg-hover, #94a3b8) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.pos-fab.pos-fab-disabled i[b-edww6tyguq] { opacity: .7; }
.pos-fab-label[b-edww6tyguq] { font-size: 14px; font-weight: 700; }
.pos-fab-count[b-edww6tyguq] { font-size: 10px; opacity: .85; white-space: nowrap; }

/* ── Modal búsqueda de cliente ── */
.pos-cliente-modal[b-edww6tyguq] { max-width: 860px; width: 95vw; }
.pos-cliente-search-bar[b-edww6tyguq] { display: flex; gap: 7px; align-items: center; margin-bottom: 12px; }
.pos-cliente-search-bar .pos-inp[b-edww6tyguq] { flex: 1; font-size: 13px; padding: 7px 10px; }
.pos-cliente-loading[b-edww6tyguq] { display: flex; align-items: center; gap: 10px; padding: 2rem 0; justify-content: center; color: var(--rg-text-muted); }
.pos-cliente-empty[b-edww6tyguq] { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 2rem 0; color: var(--rg-text-muted); }
.pos-cliente-empty i[b-edww6tyguq] { font-size: 2rem; opacity: .4; }
.pos-cliente-grid-wrapper[b-edww6tyguq] { max-height: 380px; overflow-y: auto; overflow-x: hidden; border: 1px solid var(--rg-border); border-radius: 6px; }
/* Tabla búsqueda de cliente — table-layout fixed para que columnas respeten anchos */
.pos-cliente-table[b-edww6tyguq] { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.pos-cliente-table th[b-edww6tyguq] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-size: 10px; text-transform: uppercase; letter-spacing: .05em; padding: 8px 12px; border-bottom: 2px solid var(--rg-border); white-space: nowrap; text-align: left; }
.pos-cliente-table td[b-edww6tyguq] { padding: 9px 12px; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Columna nombre: permite wrap controlado para nombres largos */
.pos-cliente-table td.col-name[b-edww6tyguq] { white-space: normal; word-break: normal; overflow-wrap: break-word; line-height: 1.4; }
.pos-cliente-table td.col-name strong[b-edww6tyguq] { font-size: 13px; color: var(--rg-text-primary); font-weight: 600; }
.pos-cliente-row[b-edww6tyguq] { cursor: pointer; transition: background .12s; }
.pos-cliente-row:hover td[b-edww6tyguq] { background: var(--rg-bg-hover); }
.pos-cliente-more[b-edww6tyguq] { font-size: 11px; color: var(--rg-text-muted); padding: .5rem .75rem; text-align: center; background: var(--rg-bg-subtle); margin: 0; }

/* ── Tarjetas sin stock ── */
.pos-card.no-stock[b-edww6tyguq] { opacity: .65; }
.pos-card.blocked-fac[b-edww6tyguq] { cursor: not-allowed; }
.pos-card.blocked-fac:hover[b-edww6tyguq] { border-color: rgba(239,68,68,.4); box-shadow: none; transform: none; }
.pos-card-no-stock-tag[b-edww6tyguq] {
    position: absolute; top: 4px; left: 4px;
    background: rgba(239,68,68,.85); color: #fff;
    font-size: 7px; font-weight: 700; letter-spacing: .06em;
    padding: 1px 4px; border-radius: 2px;
}

/* ── Indicador receta en pos-right ── */
.pos-receta-indicator[b-edww6tyguq] {
    display: flex; align-items: center; gap: 6px;
    padding: 6px 12px; border-top: 1px solid var(--rg-border);
    background: rgba(16,185,129,.06); font-size: 11px;
    color: #065f46; flex-shrink: 0;
}
[data-mode="dark"] .pos-receta-indicator[b-edww6tyguq] { color: #6ee7b7; background: rgba(16,185,129,.08); }
.pos-receta-ind-edit[b-edww6tyguq] { border: none; background: transparent; color: inherit; cursor: pointer; padding: 1px 4px; margin-left: auto; font-size: 12px; border-radius: 3px; }
.pos-receta-ind-edit:hover[b-edww6tyguq] { background: rgba(16,185,129,.15); }

/* ══ Chip Receta ══ */
.pos-chip-rx[b-edww6tyguq] { border-color: rgba(16,185,129,.35); color: #065f46; }
.pos-chip-rx:hover[b-edww6tyguq] { background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.5); }
.pos-chip-rx.rx-open[b-edww6tyguq] { background: rgba(16,185,129,.15); border-color: #10b981; font-weight: 600; }
.pos-chip-rx.rx-data[b-edww6tyguq] { border-color: #10b981; }
[data-mode="dark"] .pos-chip-rx[b-edww6tyguq] { color: #6ee7b7; }
[data-mode="dark"] .pos-chip-rx.rx-open[b-edww6tyguq] { background: rgba(16,185,129,.12); }
.pos-chip-count.rx-ok[b-edww6tyguq] { color: #10b981; }

/* ══ Panel Receta Inline ══ */
.pos-rx-panel-inline[b-edww6tyguq] {
    background: var(--rg-bg-card);
    border-bottom: 2px solid rgba(16,185,129,.4);
    border-top: 1px solid var(--rg-border);
    padding: 8px 10px 6px;
    flex-shrink: 0;
    animation: slideDownFade-b-edww6tyguq .2s ease;
}
@keyframes slideDownFade-b-edww6tyguq { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }

.pos-rx-panel-header[b-edww6tyguq] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 6px; font-size: 11px; font-weight: 600; color: #10b981;
}
.pos-rx-panel-actions[b-edww6tyguq] { display: flex; gap: 4px; align-items: center; }
.pos-rx-clear-btn[b-edww6tyguq] { border: 1px solid rgba(239,68,68,.3); background: transparent; color: #b91c1c; border-radius: 3px; padding: 2px 7px; font-size: 10px; cursor: pointer; display: flex; align-items: center; gap: 3px; }
.pos-rx-clear-btn:hover[b-edww6tyguq] { background: rgba(239,68,68,.08); }
.pos-rx-close-btn[b-edww6tyguq] { border: none; background: transparent; color: var(--rg-text-muted); cursor: pointer; padding: 2px 5px; border-radius: 3px; font-size: 12px; }
.pos-rx-close-btn:hover[b-edww6tyguq] { background: var(--rg-bg-hover); }

.pos-rx-inline-grid[b-edww6tyguq] { margin-bottom: 6px; }

.pos-rx-medico-row[b-edww6tyguq] { display: flex; align-items: center; gap: 5px; margin-bottom: 6px; }

/* Fotos strip */
.pos-rx-fotos-bar[b-edww6tyguq] { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; min-height: 44px; }
.pos-rx-foto-add[b-edww6tyguq] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 1.5px dashed var(--rg-border);
    border-radius: 5px; cursor: pointer; color: var(--rg-text-muted);
    font-size: 8px; gap: 2px; transition: all .15s; flex-shrink: 0;
}
.pos-rx-foto-add i[b-edww6tyguq] { font-size: 16px; }
.pos-rx-foto-add:hover[b-edww6tyguq] { border-color: var(--rg-primary); color: var(--rg-primary); background: rgba(26,58,92,.05); }

.pos-rx-foto-thumb-wrap[b-edww6tyguq] { position: relative; flex-shrink: 0; }
.pos-rx-foto-thumb[b-edww6tyguq] {
    width: 44px; height: 44px; object-fit: cover; border-radius: 4px;
    border: 1.5px solid var(--rg-border); cursor: pointer;
    transition: transform .15s, box-shadow .15s;
}
.pos-rx-foto-thumb:hover[b-edww6tyguq] { transform: scale(1.08); box-shadow: 0 3px 10px rgba(0,0,0,.2); border-color: var(--rg-primary); }
.pos-rx-foto-remove[b-edww6tyguq] {
    position: absolute; top: -5px; right: -5px;
    width: 15px; height: 15px; border-radius: 50%; border: none;
    background: rgba(239,68,68,.85); color: #fff; font-size: 8px;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    line-height: 1; padding: 0;
}
.pos-rx-fotos-empty[b-edww6tyguq] { font-size: 10px; color: var(--rg-text-muted); font-style: italic; }

/* ══ Lightbox ══ */
.pos-lightbox-backdrop[b-edww6tyguq] {
    position: fixed; inset: 0; background: rgba(0,0,0,.88);
    z-index: 2100; display: flex; align-items: center; justify-content: center;
    cursor: zoom-out;
    animation: fadeIn-b-edww6tyguq .2s;
}
@keyframes fadeIn-b-edww6tyguq { from { opacity:0 } to { opacity:1 } }
.pos-lightbox-container[b-edww6tyguq] { position: relative; max-width: 90vw; max-height: 90vh; }
.pos-lightbox-img[b-edww6tyguq] { max-width: 90vw; max-height: 88vh; border-radius: 6px; box-shadow: 0 8px 40px rgba(0,0,0,.6); display: block; }
.pos-lightbox-close[b-edww6tyguq] {
    position: absolute; top: -12px; right: -12px;
    width: 30px; height: 30px; border-radius: 50%;
    background: rgba(255,255,255,.15); border: 1.5px solid rgba(255,255,255,.3);
    color: #fff; font-size: 13px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .15s;
}
.pos-lightbox-close:hover[b-edww6tyguq] { background: rgba(239,68,68,.7); }

/* ══ Checkout Drawer ══ */
.pos-checkout-backdrop[b-edww6tyguq] {
    position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 800;
    opacity: 0; pointer-events: none; transition: opacity .3s;
}
.pos-checkout-backdrop.open[b-edww6tyguq] { opacity: 1; }

.pos-checkout-drawer[b-edww6tyguq] {
    position: fixed; top: 58px; right: 0;
    width: 460px; height: calc(100vh - 58px);
    background: var(--rg-bg-card);
    border-left: 2px solid var(--rg-primary);
    z-index: 801;
    display: flex; flex-direction: column;
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.4,0,.2,1);
    box-shadow: -6px 0 28px rgba(0,0,0,.18);
}
.pos-checkout-drawer.open[b-edww6tyguq] { transform: translateX(0); }

.pos-checkout-header[b-edww6tyguq] {
    padding: 12px 16px; border-bottom: 1px solid var(--rg-border);
    display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
}
.pos-checkout-header.cot[b-edww6tyguq] { background: rgba(180,83,9,.08); }
.pos-checkout-header.fac[b-edww6tyguq] { background: rgba(26,58,92,.08); }
[data-mode="dark"] .pos-checkout-header.cot[b-edww6tyguq] { background: rgba(251,191,36,.06); }
[data-mode="dark"] .pos-checkout-header.fac[b-edww6tyguq] { background: rgba(96,165,250,.06); }
.pos-checkout-title[b-edww6tyguq] { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--rg-text-primary); }
.pos-checkout-close[b-edww6tyguq] { border: none; background: transparent; color: var(--rg-text-muted); font-size: 14px; cursor: pointer; padding: 4px 8px; border-radius: 4px; }
.pos-checkout-close:hover[b-edww6tyguq] { background: var(--rg-bg-hover); color: var(--rg-danger); }

.pos-checkout-body[b-edww6tyguq] { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }

.pos-checkout-section[b-edww6tyguq] { border: 1px solid var(--rg-border); border-radius: 6px; padding: 8px 11px; }
.pos-checkout-section-sm[b-edww6tyguq] { padding: 5px 11px; }
.pos-checkout-section-label[b-edww6tyguq] { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--rg-text-muted); margin-bottom: 4px; display: flex; align-items: center; gap: 4px; }
.pos-checkout-cliente[b-edww6tyguq] { display: flex; flex-direction: column; gap: 1px; }
.pos-checkout-cliente-nombre[b-edww6tyguq] { font-size: 14px; font-weight: 600; color: var(--rg-text-primary); }
.pos-checkout-cliente-id[b-edww6tyguq] { font-size: 11px; color: var(--rg-text-muted); }
.pos-checkout-cliente-empty[b-edww6tyguq] { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--rg-text-secondary); }

.pos-checkout-lines-section[b-edww6tyguq] { padding: 8px 0 0; }
.pos-checkout-lines[b-edww6tyguq] { max-height: 220px; overflow-y: auto; padding: 0 11px 8px; }
.pos-checkout-line[b-edww6tyguq] { padding: 5px 0; border-bottom: 1px solid var(--rg-border); display: flex; flex-direction: column; gap: 2px; }
.pos-checkout-line:last-child[b-edww6tyguq] { border-bottom: none; }
.pos-checkout-line-name[b-edww6tyguq] { font-size: 11px; color: var(--rg-text-primary); display: flex; flex-direction: column; gap: 1px; }
.pos-checkout-line-nums[b-edww6tyguq] { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--rg-text-secondary); }
.pos-checkout-desc[b-edww6tyguq] { color: #10b981; font-size: 10px; }
.pos-checkout-subtotal[b-edww6tyguq] { margin-left: auto; font-weight: 600; color: var(--rg-text-primary); }

/* Botón − del checkout drawer */
.pos-checkout-dec[b-edww6tyguq] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: 50%; border: none; cursor: pointer;
    background: rgba(239,68,68,0.10); color: var(--rg-danger);
    font-size: .8rem; flex-shrink: 0; transition: background .15s;
    padding: 0;
}
.pos-checkout-dec:hover[b-edww6tyguq] { background: rgba(239,68,68,0.22); }
.pos-checkout-qty[b-edww6tyguq] { font-weight: 700; color: var(--rg-text-primary); min-width: 16px; text-align: center; font-size: .8rem; }

.pos-checkout-totals[b-edww6tyguq] { border-top: 2px solid var(--rg-text-primary); padding: 10px 0 2px; background: var(--rg-bg-subtle); border-radius: 0 0 6px 6px; flex-shrink: 0; padding: 10px 16px; }
.pos-checkout-total-row[b-edww6tyguq] { display: flex; justify-content: space-between; align-items: baseline; padding: 2px 0; font-size: 12px; color: var(--rg-text-secondary); }
.pos-checkout-grand[b-edww6tyguq] { border-top: 1px solid var(--rg-border); margin-top: 5px; padding-top: 6px; }
.pos-checkout-grand span:first-child[b-edww6tyguq] { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rg-text-primary); }

.pos-checkout-footer[b-edww6tyguq] { padding: 12px 16px; border-top: 1px solid var(--rg-border); display: flex; gap: 8px; flex-shrink: 0; background: var(--rg-bg-card); }
.pos-checkout-confirm[b-edww6tyguq] {
    flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px;
    padding: 12px; border: none; border-radius: 6px; font-size: 14px; font-weight: 700;
    cursor: pointer; color: #fff; transition: opacity .15s;
}
.pos-checkout-confirm.cot[b-edww6tyguq] { background: #e85d00; }
.pos-checkout-confirm.fac[b-edww6tyguq] { background: var(--rg-primary); }
.pos-checkout-confirm:disabled[b-edww6tyguq] { opacity: .45; cursor: default; }
.pos-checkout-confirm:hover:not(:disabled)[b-edww6tyguq] { opacity: .9; }

/* ── Responsive móvil ── */
@media (max-width: 768px) {
    .pos-main[b-edww6tyguq]              { grid-template-columns: 1fr; grid-template-rows: 60vh auto; }
    .pos-right[b-edww6tyguq]             { border-top: 2px solid var(--rg-border); }
    .pos-docheader-grid[b-edww6tyguq]    { grid-template-columns: 1fr 1fr; }
    .pos-doc-num-wrap[b-edww6tyguq]      { grid-column: 1 / -1; }
    .pos-cardgrid[b-edww6tyguq]          { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
    .pos-wrapper[b-edww6tyguq]           { height: calc(100vh - 60px - 2rem); } /* 60px header + 1rem×2 padding móvil */
    .pos-fab-container[b-edww6tyguq]     { bottom: 12px; right: 12px; }
    .pos-inp-mini[b-edww6tyguq]          { width: 58px; }

    /* Botón × de eliminar línea — target táctil mínimo 44px */
    .pos-btn-rm[b-edww6tyguq] {
        width: 36px;
        height: 36px;
        font-size: 18px;
        border: 1px solid rgba(239, 68, 68, .35);
        border-radius: 6px;
        color: #dc2626;
        background: rgba(239, 68, 68, .07);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
}

/* ── NCF resuelto (checkout drawer) ───────────────────────────────────── */
.pos-ncf-badge[b-edww6tyguq] {
    display: inline-flex; align-items: center; gap: 3px;
    font-size: .65rem; font-weight: 700; padding: 2px 7px;
    border-radius: 1rem; text-transform: uppercase; letter-spacing: .04em;
}
.pos-ncf-badge.pos-ncf-ecf[b-edww6tyguq] {
    background: rgba(34,197,94,.13); color: #15803d;
    border: 1px solid rgba(34,197,94,.3);
}
[data-mode="dark"] .pos-ncf-badge.pos-ncf-ecf[b-edww6tyguq] { color: #86efac; }

.pos-ncf-resolved[b-edww6tyguq] {
    display: flex; align-items: baseline; gap: .5rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: .4rem; padding: .45rem .65rem; margin-top: .25rem;
}
.pos-ncf-prefijo[b-edww6tyguq] {
    font-family: monospace; font-size: .95rem; font-weight: 700;
    color: var(--rg-primary); letter-spacing: .06em;
}
.pos-ncf-desc[b-edww6tyguq] {
    font-size: .75rem; color: var(--rg-text-secondary); flex: 1;
}

/* ── Totales: filas de descuento e informativas ────────────────────────── */
.pos-total-desc[b-edww6tyguq] {
    color: var(--rg-success);
}
.pos-total-info[b-edww6tyguq] {
    font-size: .72rem;
    color: var(--rg-text-muted);
    border-top: 1px dashed var(--rg-border);
    padding-top: .2rem;
    margin-top: .1rem;
}

/* Checkout drawer — fila de descuento */
.pos-checkout-desc-row[b-edww6tyguq] {
    color: var(--rg-success);
}

/* Checkout drawer — base gravable neta (subtítulo intermedio) */
.pos-checkout-base-neta-row[b-edww6tyguq] {
    font-weight: 600;
    border-top: 1px solid var(--rg-border);
    padding-top: .35rem;
    margin-top: .1rem;
    color: var(--rg-text-primary);
}

/* Checkout drawer — desglose fiscal (bajo el TOTAL) */
.pos-checkout-fiscal-info[b-edww6tyguq] {
    border-top: 1px dashed var(--rg-border);
    margin-top: .4rem;
    padding-top: .35rem;
}
.pos-checkout-fiscal-row[b-edww6tyguq] {
    display: flex;
    justify-content: space-between;
    font-size: .72rem;
    color: var(--rg-text-muted);
    padding: .1rem 0;
}
.pos-checkout-fiscal-itbis[b-edww6tyguq] {
    color: var(--rg-warning);
    font-weight: 600;
}

/* Checkout drawer — fila ITBIS */
.pos-checkout-itbis-row[b-edww6tyguq] {
    color: var(--rg-text-secondary);
}
.pos-checkout-itbis-hint[b-edww6tyguq] {
    font-size: .68rem;
    color: var(--rg-text-muted);
    margin-left: .3rem;
    font-weight: 400;
}

/* ── Nota conflicto descuentos ─────────────────────────────────────────── */
.pos-discount-conflict-note[b-edww6tyguq] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    color: var(--rg-warning);
    background: rgba(217,119,6,.08);
    border: 1px solid rgba(217,119,6,.25);
    border-radius: .4rem;
    padding: .3rem .55rem;
    margin-bottom: .4rem;
}

/* ── Forma de Pago (checkout drawer) ──────────────────────────────────── */
.pos-checkout-section-fp[b-edww6tyguq] { padding-top: .5rem; }
.pos-fp-list[b-edww6tyguq] { display: flex; flex-direction: column; gap: .35rem; margin-top: .4rem; }
.pos-fp-chip[b-edww6tyguq] { display: flex; align-items: center; gap: .5rem; background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: .45rem; padding: .35rem .6rem; font-size: .8rem; }
.pos-fp-chip-tipo[b-edww6tyguq]  { font-weight: 600; color: var(--rg-text-primary); flex: 1; }
.pos-fp-chip-ref[b-edww6tyguq]   { color: var(--rg-text-secondary); font-size: .72rem; }
.pos-fp-chip-monto[b-edww6tyguq] { font-weight: 700; color: var(--rg-primary); white-space: nowrap; }
.pos-fp-diferencia[b-edww6tyguq] { display: flex; align-items: center; gap: .35rem; margin-top: .4rem; font-size: .78rem; padding: .3rem .5rem; border-radius: .4rem; }
.pos-fp-diferencia.falta[b-edww6tyguq]  { background: rgba(220,38,38,0.08); color: var(--rg-danger); border: 1px solid rgba(220,38,38,0.25); }
.pos-fp-diferencia.cambio[b-edww6tyguq] { background: rgba(22,163,74,0.08);  color: var(--rg-success); border: 1px solid rgba(22,163,74,0.25); }
.pos-fp-empty[b-edww6tyguq] { font-size: .78rem; color: var(--rg-text-muted); font-style: italic; }

/* ── Evidencia Fotográfica (checkout drawer) ───────────────────────────── */
.pos-checkout-section-label[b-edww6tyguq] { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pos-evid-btns[b-edww6tyguq] { display: flex; gap: .3rem; margin-left: auto; }
.pos-evid-btn[b-edww6tyguq] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: .4rem; cursor: pointer;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    color: var(--rg-text-secondary); font-size: .9rem; transition: background .15s;
}
.pos-evid-btn:hover:not(.uploading)[b-edww6tyguq]  { background: var(--rg-bg-hover); color: var(--rg-primary); }
.pos-evid-btn.uploading[b-edww6tyguq] { opacity: .6; cursor: wait; }
.pos-evid-hint[b-edww6tyguq] { font-size: .73rem; color: var(--rg-text-muted); margin-top: .25rem; display: block; }

@keyframes rg-spin-b-edww6tyguq { to { transform: rotate(360deg); } }
.spin[b-edww6tyguq] { display: inline-block; animation: rg-spin-b-edww6tyguq .8s linear infinite; }


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-edww6tyguq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-edww6tyguq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-edww6tyguq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-edww6tyguq] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptreimpresiondocumentos.razor.rz.scp.css */
/* ============================================================
   Frmoptreimpresiondocumentos — Reimpresión Optical v2
   ============================================================ */

.crud-container[b-z9rwixnzsm] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-z9rwixnzsm 0.3s ease-out; }
@keyframes slideUp-b-z9rwixnzsm { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-z9rwixnzsm] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-z9rwixnzsm] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-z9rwixnzsm] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-z9rwixnzsm] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-z9rwixnzsm] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-z9rwixnzsm] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-z9rwixnzsm] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-z9rwixnzsm] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-z9rwixnzsm] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-z9rwixnzsm] { filter: brightness(1.1); }
.btn-outline[b-z9rwixnzsm] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-z9rwixnzsm] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-icon[b-z9rwixnzsm] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-pdf[b-z9rwixnzsm] { color: #ef4444; }
.btn-pdf:hover[b-z9rwixnzsm] { background: rgba(239,68,68,0.1); }

/* Alert */
.crud-alert[b-z9rwixnzsm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-z9rwixnzsm] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-z9rwixnzsm] { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-z9rwixnzsm] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-z9rwixnzsm] { color: #fca5a5; }
.crud-alert-close[b-z9rwixnzsm] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tabs */
.cat-tabs[b-z9rwixnzsm] { display: flex; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.cat-tab[b-z9rwixnzsm] { background: none; border: none; padding: 0.6rem 1.1rem; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.4rem; }
.cat-tab:hover[b-z9rwixnzsm] { color: var(--rg-text-primary, #1e293b); }
.cat-tab.active[b-z9rwixnzsm] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Filters */
.filter-row[b-z9rwixnzsm] { display: flex; gap: 0.75rem; align-items: flex-end; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-z9rwixnzsm] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-z9rwixnzsm] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-z9rwixnzsm], .form-group select[b-z9rwixnzsm] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-z9rwixnzsm], .form-group select:focus[b-z9rwixnzsm] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.crud-search-bar[b-z9rwixnzsm] { display: flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); margin-bottom: 0.75rem; }
.crud-search-btn[b-z9rwixnzsm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-z9rwixnzsm] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-z9rwixnzsm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-z9rwixnzsm] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-z9rwixnzsm] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 300px); }
.crud-table[b-z9rwixnzsm] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-z9rwixnzsm] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-z9rwixnzsm] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.crud-table td[b-z9rwixnzsm] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-z9rwixnzsm] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tbody tr.row-anulada[b-z9rwixnzsm] { opacity: 0.5; }
.col-actions[b-z9rwixnzsm] { width: 60px; text-align: center; }
.text-right[b-z9rwixnzsm] { text-align: right; }
.text-center[b-z9rwixnzsm] { text-align: center; }

/* Badges */
.badge[b-z9rwixnzsm] { display: inline-flex; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-z9rwixnzsm] { background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-z9rwixnzsm] { background: var(--rg-bg-subtle, #f1f5f9); color: #64748b; }
.badge-pending[b-z9rwixnzsm] { background: rgba(234,179,8,0.15); color: #854d0e; }
.badge-anulada[b-z9rwixnzsm] { background: rgba(239,68,68,0.12); color: #991b1b; }
[data-mode="dark"] .badge-yes[b-z9rwixnzsm] { color: #86efac; }
[data-mode="dark"] .badge-anulada[b-z9rwixnzsm] { color: #fca5a5; }
[data-mode="dark"] .badge-pending[b-z9rwixnzsm] { color: #fde68a; }

/* Utilities */
.font-mono[b-z9rwixnzsm] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-muted[b-z9rwixnzsm] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-z9rwixnzsm], .crud-empty-state[b-z9rwixnzsm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-z9rwixnzsm] { font-size: 2rem; }
.crud-spinner[b-z9rwixnzsm] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-z9rwixnzsm 0.6s linear infinite; }
@keyframes spin-b-z9rwixnzsm { to { transform: rotate(360deg); } }
.spin[b-z9rwixnzsm] { animation: spin-b-z9rwixnzsm 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-z9rwixnzsm] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-z9rwixnzsm] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-z9rwixnzsm] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 860px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-pdf[b-z9rwixnzsm] { max-width: 800px; }
.modal-sm[b-z9rwixnzsm] { max-width: 460px; }
.modal-header[b-z9rwixnzsm] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-z9rwixnzsm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-z9rwixnzsm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-z9rwixnzsm] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-z9rwixnzsm] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Send button */
.btn-send[b-z9rwixnzsm] { color: var(--rg-primary, #1a3a5c); }
.btn-send:hover[b-z9rwixnzsm] { background: rgba(26,58,92,0.1); }

/* 2-button actions column */
.col-actions[b-z9rwixnzsm] { width: 80px; text-align: center; }

/* Nested modals (send modal on top of PDF viewer) */
.modal-backdrop-nested[b-z9rwixnzsm]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-z9rwixnzsm] { z-index: 2001 !important; }

/* Send form fields */
.envio-form-group[b-z9rwixnzsm] { display: flex; flex-direction: column; gap: .25rem; margin-bottom: .75rem; }
.envio-label[b-z9rwixnzsm] { font-size: .72rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: .04em; display: flex; align-items: center; gap: .35rem; }
.envio-input[b-z9rwixnzsm] { background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 6px; padding: .45rem .65rem; font-size: .82rem; outline: none; width: 100%; box-sizing: border-box; }
.envio-input:focus[b-z9rwixnzsm] { border-color: var(--rg-primary, #1a3a5c); box-shadow: 0 0 0 3px rgba(26,58,92,0.15); }

/* Document info panel inside send modal */
.ps-recibo-info[b-z9rwixnzsm] { display: flex; align-items: baseline; gap: .6rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; padding: .6rem .8rem; margin-bottom: .75rem; flex-wrap: wrap; }
.ps-label[b-z9rwixnzsm] { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--rg-text-muted, #94a3b8); }
.ps-value[b-z9rwixnzsm] { font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }

@media (max-width: 768px) {
    .crud-container[b-z9rwixnzsm] { padding: 0.75rem; }
    .filter-row[b-z9rwixnzsm] { flex-direction: column; }
    .cat-tabs[b-z9rwixnzsm] { overflow-x: auto; }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-z9rwixnzsm] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-z9rwixnzsm] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-z9rwixnzsm] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-z9rwixnzsm] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Optical/Frmoptreporteexistencia.razor.rz.scp.css */
/* ============================================================
   Frmoptreporteexistencia — Stock + Conteo Inicial Optical v2
   ============================================================ */

.crud-container[b-00a1yxvx9z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-00a1yxvx9z 0.3s ease-out; }
@keyframes slideUp-b-00a1yxvx9z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-00a1yxvx9z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-00a1yxvx9z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-00a1yxvx9z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-00a1yxvx9z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-00a1yxvx9z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-00a1yxvx9z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-00a1yxvx9z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-00a1yxvx9z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-00a1yxvx9z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-00a1yxvx9z] { filter: brightness(1.1); }
.btn-outline[b-00a1yxvx9z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-00a1yxvx9z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-00a1yxvx9z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-00a1yxvx9z] { filter: brightness(1.1); }
.btn-icon[b-00a1yxvx9z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-00a1yxvx9z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-00a1yxvx9z] { background: rgba(79, 70, 229, 0.1); }

/* Alert */
.crud-alert[b-00a1yxvx9z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-00a1yxvx9z] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-00a1yxvx9z]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-00a1yxvx9z] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-00a1yxvx9z]   { color: #fca5a5; }
.crud-alert-close[b-00a1yxvx9z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tabs */
.cat-tabs[b-00a1yxvx9z] { display: flex; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.cat-tab[b-00a1yxvx9z] { background: none; border: none; padding: 0.6rem 1.1rem; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.4rem; }
.cat-tab:hover[b-00a1yxvx9z] { color: var(--rg-text-primary, #1e293b); }
.cat-tab.active[b-00a1yxvx9z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Filtros */
.filter-row[b-00a1yxvx9z] { display: flex; gap: 0.75rem; align-items: flex-end; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-00a1yxvx9z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-00a1yxvx9z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group select[b-00a1yxvx9z] { padding: 0.4rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); outline: none; }
.form-group input[b-00a1yxvx9z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; }
.form-group input:focus[b-00a1yxvx9z], .form-group select:focus[b-00a1yxvx9z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Barra de búsqueda */
.crud-search-bar[b-00a1yxvx9z] { display: flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; background: var(--rg-bg-card, #fff); }
.crud-search-btn[b-00a1yxvx9z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-00a1yxvx9z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-00a1yxvx9z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-00a1yxvx9z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Resumen de stock */
.stock-summary[b-00a1yxvx9z] { display: flex; gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.sum-card[b-00a1yxvx9z] { flex: 1; min-width: 160px; padding: 0.75rem 1rem; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; display: flex; flex-direction: column; gap: 0.2rem; }
.sum-label[b-00a1yxvx9z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.04em; }
.sum-value[b-00a1yxvx9z] { font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); font-family: monospace; }

/* Grid */
.crud-grid-wrapper[b-00a1yxvx9z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-00a1yxvx9z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-00a1yxvx9z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-00a1yxvx9z] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-00a1yxvx9z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-00a1yxvx9z] { background: var(--rg-bg-hover, #f8fafc); }
.crud-table tbody tr.row-zero[b-00a1yxvx9z] { opacity: 0.55; }
.text-right[b-00a1yxvx9z] { text-align: right; }
.text-danger[b-00a1yxvx9z] { color: #ef4444; font-weight: 600; }
.text-success[b-00a1yxvx9z] { color: #22c55e; font-weight: 600; }

/* Conteo */
.conteo-estado[b-00a1yxvx9z] { display: flex; align-items: center; }
.conteo-actions[b-00a1yxvx9z] { display: flex; gap: 0.5rem; margin-bottom: 0.5rem; flex-wrap: wrap; }
.linea-info[b-00a1yxvx9z] { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.625rem; background: var(--rg-bg-subtle, #f8fafc); border-radius: 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); }
.form-row[b-00a1yxvx9z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }

/* Badges de estado */
.badge-pending[b-00a1yxvx9z]  { display: inline-flex; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.72rem; font-weight: 700; background: rgba(234,179,8,0.15); color: #854d0e; }
.badge-counting[b-00a1yxvx9z] { display: inline-flex; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.72rem; font-weight: 700; background: rgba(79,70,229,0.12); color: #4338ca; }
.badge-closed[b-00a1yxvx9z]   { display: inline-flex; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.72rem; font-weight: 700; background: rgba(100,116,139,0.15); color: #475569; }
.badge-active[b-00a1yxvx9z]   { display: inline-flex; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.72rem; font-weight: 700; background: rgba(34,197,94,0.15); color: #166534; }
.badge-no[b-00a1yxvx9z]       { display: inline-flex; padding: 0.2rem 0.6rem; border-radius: 1rem; font-size: 0.72rem; font-weight: 700; background: var(--rg-bg-subtle,#f1f5f9); color: var(--rg-text-muted,#64748b); }
[data-mode="dark"] .badge-pending[b-00a1yxvx9z]  { color: #fde68a; }
[data-mode="dark"] .badge-counting[b-00a1yxvx9z] { color: #a5b4fc; }
[data-mode="dark"] .badge-active[b-00a1yxvx9z]   { color: #86efac; }

/* Utilities */
.font-mono[b-00a1yxvx9z] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-00a1yxvx9z] { text-align: center; }
.text-muted[b-00a1yxvx9z] { color: var(--rg-text-muted,#94a3b8); font-size: 0.78rem; }

/* Columna Exist. Anterior (legacy) — referencia visual, no es el conteo físico */
.col-exist-legacy[b-00a1yxvx9z] { width: 110px; }
.text-legacy[b-00a1yxvx9z] { color: #f59e0b; font-weight: 600; }
[data-mode="dark"] .text-legacy[b-00a1yxvx9z] { color: #fbbf24; }

/* ── Acordeón grupos de conteo ────────────────────────────────────────────── */
.acc-group[b-00a1yxvx9z] { border: 1px solid var(--rg-border); border-radius: 8px; overflow: hidden; }

.acc-header[b-00a1yxvx9z] {
    width: 100%; display: flex; align-items: center; gap: 0.5rem;
    padding: 0.6rem 0.9rem; cursor: pointer; border: none;
    background: var(--rg-bg-subtle); color: var(--rg-text-primary);
    font-size: 0.82rem; font-weight: 600; text-align: left;
    transition: background 0.15s;
}
.acc-header:hover[b-00a1yxvx9z] { background: var(--rg-bg-hover); }
.acc-header-exist[b-00a1yxvx9z]  { border-left: 4px solid #f59e0b; }
.acc-header-noexist[b-00a1yxvx9z] { border-left: 4px solid var(--rg-border); }

.acc-icon[b-00a1yxvx9z] { color: var(--rg-text-muted); font-size: 0.75rem; width: 14px; }
.acc-title[b-00a1yxvx9z] { flex: 1; }

.acc-badge[b-00a1yxvx9z] {
    padding: 0.1rem 0.5rem; border-radius: 999px;
    font-size: 0.68rem; font-weight: 700;
}
.acc-badge-legacy[b-00a1yxvx9z]  { background: rgba(245,158,11,0.15); color: #d97706; }
.acc-badge-new[b-00a1yxvx9z]     { background: rgba(100,116,139,0.12); color: var(--rg-text-muted); }
.acc-badge-contados[b-00a1yxvx9z] { background: rgba(34,197,94,0.12); color: #16a34a; }
[data-mode="dark"] .acc-badge-legacy[b-00a1yxvx9z]  { color: #fbbf24; }
[data-mode="dark"] .acc-badge-contados[b-00a1yxvx9z] { color: #4ade80; }

.acc-body[b-00a1yxvx9z] { border-top: 1px solid var(--rg-border); border-radius: 0; }
.acc-body .crud-table[b-00a1yxvx9z] { border-radius: 0; }

/* ── Barra de herramientas Excel ─────────────────────────────────────────── */
.excel-toolbar[b-00a1yxvx9z] {
    display: flex; gap: 0.5rem; align-items: center;
    margin-top: 0.75rem; margin-bottom: 0.25rem; flex-wrap: wrap;
}
.excel-toolbar label.btn-crud[b-00a1yxvx9z] { cursor: pointer; }
.excel-toolbar label.btn-crud.disabled[b-00a1yxvx9z] { opacity: 0.6; pointer-events: none; }

/* ── Modal resultado importación ─────────────────────────────────────────── */
.import-stats[b-00a1yxvx9z] {
    display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem;
}
.import-stat[b-00a1yxvx9z] {
    flex: 1; min-width: 80px; padding: 0.5rem 0.75rem;
    background: var(--rg-bg-subtle); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; display: flex; flex-direction: column; align-items: center; gap: 0.1rem;
}
.import-stat-ok[b-00a1yxvx9z] { border-color: rgba(34,197,94,0.4); }
.import-stat-err[b-00a1yxvx9z] { border-color: rgba(239,68,68,0.4); }
.import-stat-label[b-00a1yxvx9z] { font-size: 0.65rem; font-weight: 600; text-transform: uppercase; color: var(--rg-text-muted); letter-spacing: 0.04em; }
.import-stat-value[b-00a1yxvx9z] { font-size: 1.2rem; font-weight: 700; color: var(--rg-text-primary); font-family: monospace; }
.import-stat-ok .import-stat-value[b-00a1yxvx9z] { color: #16a34a; }
.import-stat-err .import-stat-value[b-00a1yxvx9z] { color: #dc2626; }
[data-mode="dark"] .import-stat-ok .import-stat-value[b-00a1yxvx9z]  { color: #4ade80; }
[data-mode="dark"] .import-stat-err .import-stat-value[b-00a1yxvx9z] { color: #f87171; }

.import-errors[b-00a1yxvx9z] { background: rgba(239,68,68,0.07); border: 1px solid rgba(239,68,68,0.25); border-radius: 0.5rem; padding: 0.6rem 0.75rem; }
.import-errors-title[b-00a1yxvx9z] { font-size: 0.78rem; font-weight: 600; color: #dc2626; margin-bottom: 0.4rem; }
.import-errors ul[b-00a1yxvx9z] { padding-left: 1.1rem; margin: 0; }
.import-errors li[b-00a1yxvx9z] { font-size: 0.75rem; color: var(--rg-text-secondary); margin-bottom: 0.2rem; }
[data-mode="dark"] .import-errors-title[b-00a1yxvx9z] { color: #f87171; }

/* ── Edición inline en tabla de conteo ───────────────────────────────────── */
.tr-inline-active[b-00a1yxvx9z] { background: rgba(79,70,229,0.06) !important; }

.td-inline-edit[b-00a1yxvx9z] { padding: 0.2rem 0.35rem !important; }
.td-inline-actions[b-00a1yxvx9z] { padding: 0.2rem 0.35rem !important; white-space: nowrap; }

.td-clickable[b-00a1yxvx9z] { cursor: pointer; }
.td-clickable:hover[b-00a1yxvx9z] { background: var(--rg-bg-hover, #f1f5f9); }

.inline-qty-input[b-00a1yxvx9z],
.inline-cost-input[b-00a1yxvx9z] {
    width: 88px;
    padding: 0.22rem 0.4rem;
    border: 1px solid var(--rg-accent, #4f46e5);
    border-radius: 0.35rem;
    font-size: 0.78rem;
    font-family: 'Cascadia Code','Fira Code',monospace;
    background: var(--rg-bg-input, #fff);
    color: var(--rg-text-primary, #1e293b);
    outline: none;
    text-align: right;
    /* Quitar flechas/spinners del input numérico */
    -moz-appearance: textfield;
}
.inline-qty-input:focus[b-00a1yxvx9z],
.inline-cost-input:focus[b-00a1yxvx9z] { box-shadow: 0 0 0 2px rgba(79,70,229,0.2); }
.inline-qty-input[b-00a1yxvx9z]::-webkit-outer-spin-button,
.inline-qty-input[b-00a1yxvx9z]::-webkit-inner-spin-button,
.inline-cost-input[b-00a1yxvx9z]::-webkit-outer-spin-button,
.inline-cost-input[b-00a1yxvx9z]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.btn-inline-save[b-00a1yxvx9z],
.btn-inline-cancel[b-00a1yxvx9z] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.55rem; height: 1.55rem;
    border: none; border-radius: 0.3rem;
    cursor: pointer; font-size: 0.85rem;
    transition: all 0.12s;
}
.btn-inline-save[b-00a1yxvx9z]   { background: rgba(34,197,94,0.15);  color: #16a34a; margin-right: 0.2rem; }
.btn-inline-save:hover[b-00a1yxvx9z]   { background: rgba(34,197,94,0.3); }
.btn-inline-cancel[b-00a1yxvx9z] { background: rgba(239,68,68,0.1);   color: #dc2626; }
.btn-inline-cancel:hover[b-00a1yxvx9z] { background: rgba(239,68,68,0.22); }
[data-mode="dark"] .btn-inline-save[b-00a1yxvx9z]   { color: #4ade80; }
[data-mode="dark"] .btn-inline-cancel[b-00a1yxvx9z] { color: #f87171; }

/* Loading / Empty */
.crud-loading[b-00a1yxvx9z], .crud-empty-state[b-00a1yxvx9z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted,#94a3b8); }
.crud-empty-state i[b-00a1yxvx9z] { font-size: 2rem; }
.crud-spinner[b-00a1yxvx9z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border,#e2e8f0); border-top-color: var(--rg-accent,#4f46e5); border-radius: 50%; animation: spin-b-00a1yxvx9z 0.6s linear infinite; }
@keyframes spin-b-00a1yxvx9z { to { transform: rotate(360deg); } }
.spin[b-00a1yxvx9z] { animation: spin-b-00a1yxvx9z 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-00a1yxvx9z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-00a1yxvx9z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-00a1yxvx9z] { pointer-events: auto; background: var(--rg-bg-card,#fff); border-radius: 0.75rem; width: 95%; max-width: 540px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-sm[b-00a1yxvx9z] { max-width: 440px; }
.modal-header[b-00a1yxvx9z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }
.modal-header h2[b-00a1yxvx9z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-00a1yxvx9z] { border-bottom-color: rgba(239,68,68,0.3); }
.modal-header-danger h2[b-00a1yxvx9z] { color: #dc2626; }
.modal-close[b-00a1yxvx9z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted,#94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-body[b-00a1yxvx9z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-00a1yxvx9z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border,#e2e8f0); flex-shrink: 0; }

@media (max-width: 768px) {
    .crud-container[b-00a1yxvx9z] { padding: 0.75rem; }
    .filter-row[b-00a1yxvx9z] { flex-direction: column; }
    .stock-summary[b-00a1yxvx9z] { flex-direction: column; }
    .crud-grid-wrapper[b-00a1yxvx9z] { max-height: calc(100vh - 400px); }
}


/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-00a1yxvx9z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-00a1yxvx9z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-00a1yxvx9z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-00a1yxvx9z] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmconteofisicovspc.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ymdcmk8hhz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ymdcmk8hhz 0.3s ease-out; }
@keyframes slideUp-b-ymdcmk8hhz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ymdcmk8hhz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ymdcmk8hhz] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ymdcmk8hhz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ymdcmk8hhz] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ymdcmk8hhz] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ymdcmk8hhz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ymdcmk8hhz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ymdcmk8hhz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ymdcmk8hhz] { filter: brightness(1.1); }
.btn-outline[b-ymdcmk8hhz] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ymdcmk8hhz] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ymdcmk8hhz] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ymdcmk8hhz] { filter: brightness(1.1); }
.btn-icon[b-ymdcmk8hhz] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ymdcmk8hhz] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ymdcmk8hhz] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ymdcmk8hhz] { color: #ef4444; }
.btn-delete:hover[b-ymdcmk8hhz] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ymdcmk8hhz] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ymdcmk8hhz] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ymdcmk8hhz] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ymdcmk8hhz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ymdcmk8hhz] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ymdcmk8hhz] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ymdcmk8hhz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ymdcmk8hhz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ymdcmk8hhz] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ymdcmk8hhz] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ymdcmk8hhz] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ymdcmk8hhz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ymdcmk8hhz] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ymdcmk8hhz] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ymdcmk8hhz] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ymdcmk8hhz] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ymdcmk8hhz] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ymdcmk8hhz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ymdcmk8hhz] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ymdcmk8hhz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ymdcmk8hhz] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ymdcmk8hhz] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ymdcmk8hhz] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ymdcmk8hhz] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ymdcmk8hhz] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ymdcmk8hhz] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ymdcmk8hhz] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ymdcmk8hhz] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ymdcmk8hhz] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ymdcmk8hhz] { display: block; }
.hide-on-cards[b-ymdcmk8hhz] { display: none !important; }
.show-on-cards[b-ymdcmk8hhz] { display: grid; }
.hide-on-grid[b-ymdcmk8hhz] { display: none !important; }

/* Badges */
.badge[b-ymdcmk8hhz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ymdcmk8hhz] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ymdcmk8hhz] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ymdcmk8hhz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ymdcmk8hhz] { text-align: center; }
.text-muted[b-ymdcmk8hhz] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ymdcmk8hhz], .crud-empty-state[b-ymdcmk8hhz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ymdcmk8hhz] { font-size: 2rem; }
.crud-spinner[b-ymdcmk8hhz] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ymdcmk8hhz 0.6s linear infinite; }
.crud-spinner-sm[b-ymdcmk8hhz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ymdcmk8hhz 0.6s linear infinite; }
@keyframes spin-b-ymdcmk8hhz { to { transform: rotate(360deg); } }
.spin[b-ymdcmk8hhz] { animation: spin-b-ymdcmk8hhz 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ymdcmk8hhz] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ymdcmk8hhz 0.15s ease-out; }
.modal-container[b-ymdcmk8hhz] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ymdcmk8hhz] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ymdcmk8hhz 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ymdcmk8hhz] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ymdcmk8hhz] { max-width: 420px; }
@keyframes fadeIn-b-ymdcmk8hhz { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ymdcmk8hhz { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ymdcmk8hhz] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ymdcmk8hhz] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ymdcmk8hhz] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ymdcmk8hhz] { color: #dc2626; }
.modal-close[b-ymdcmk8hhz] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ymdcmk8hhz] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ymdcmk8hhz] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ymdcmk8hhz] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ymdcmk8hhz] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ymdcmk8hhz] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ymdcmk8hhz] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ymdcmk8hhz] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ymdcmk8hhz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ymdcmk8hhz] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ymdcmk8hhz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ymdcmk8hhz] { flex: 2; }
.form-group label[b-ymdcmk8hhz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ymdcmk8hhz], .form-group select[b-ymdcmk8hhz], .form-textarea[b-ymdcmk8hhz] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ymdcmk8hhz], .form-group select:focus[b-ymdcmk8hhz], .form-textarea:focus[b-ymdcmk8hhz] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ymdcmk8hhz] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ymdcmk8hhz] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ymdcmk8hhz] { flex: 1; display: flex; align-items: center; }
.form-check[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ymdcmk8hhz] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ymdcmk8hhz] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ymdcmk8hhz] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ymdcmk8hhz] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ymdcmk8hhz] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ymdcmk8hhz] { font-size: 3rem; }
.photo-placeholder span[b-ymdcmk8hhz] { font-size: 0.78rem; }
.photo-actions[b-ymdcmk8hhz] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ymdcmk8hhz] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ymdcmk8hhz] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ymdcmk8hhz] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ymdcmk8hhz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ymdcmk8hhz] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ymdcmk8hhz] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ymdcmk8hhz] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ymdcmk8hhz] { filter: brightness(1.15); transform: scale(1.05); }
[b-ymdcmk8hhz] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ymdcmk8hhz] { padding: 0.75rem; }
    .crud-header[b-ymdcmk8hhz] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ymdcmk8hhz] { font-size: 1.1rem; }
    .btn-text[b-ymdcmk8hhz] { display: none; }
    .form-row[b-ymdcmk8hhz] { flex-direction: column; }
    .form-row-4[b-ymdcmk8hhz] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ymdcmk8hhz] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ymdcmk8hhz] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ymdcmk8hhz] { padding: 0.75rem; }
    .modal-tabs[b-ymdcmk8hhz] { overflow-x: auto; }
    .modal-tab[b-ymdcmk8hhz] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ymdcmk8hhz] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ymdcmk8hhz] { display: grid !important; }
    .crud-cards-wrapper[b-ymdcmk8hhz] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ymdcmk8hhz] { grid-template-columns: 1fr; }
    .card-details[b-ymdcmk8hhz] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ymdcmk8hhz] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ymdcmk8hhz] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ymdcmk8hhz] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ymdcmk8hhz] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmplaconsultadocumento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4tjz7o68ti] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4tjz7o68ti 0.3s ease-out; }
@keyframes slideUp-b-4tjz7o68ti { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4tjz7o68ti] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4tjz7o68ti] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4tjz7o68ti] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4tjz7o68ti] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4tjz7o68ti] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4tjz7o68ti] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4tjz7o68ti] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4tjz7o68ti] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4tjz7o68ti] { filter: brightness(1.1); }
.btn-outline[b-4tjz7o68ti] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4tjz7o68ti] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4tjz7o68ti] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4tjz7o68ti] { filter: brightness(1.1); }
.btn-icon[b-4tjz7o68ti] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4tjz7o68ti] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4tjz7o68ti] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4tjz7o68ti] { color: #ef4444; }
.btn-delete:hover[b-4tjz7o68ti] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4tjz7o68ti] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4tjz7o68ti] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4tjz7o68ti] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4tjz7o68ti] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4tjz7o68ti] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4tjz7o68ti] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4tjz7o68ti] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4tjz7o68ti] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4tjz7o68ti] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4tjz7o68ti] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4tjz7o68ti] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4tjz7o68ti] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4tjz7o68ti] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4tjz7o68ti] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4tjz7o68ti] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4tjz7o68ti] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4tjz7o68ti] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4tjz7o68ti] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4tjz7o68ti] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4tjz7o68ti] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4tjz7o68ti] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4tjz7o68ti] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4tjz7o68ti] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4tjz7o68ti] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4tjz7o68ti] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4tjz7o68ti] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4tjz7o68ti] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4tjz7o68ti] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4tjz7o68ti] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4tjz7o68ti] { display: block; }
.hide-on-cards[b-4tjz7o68ti] { display: none !important; }
.show-on-cards[b-4tjz7o68ti] { display: grid; }
.hide-on-grid[b-4tjz7o68ti] { display: none !important; }

/* Badges */
.badge[b-4tjz7o68ti] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4tjz7o68ti] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4tjz7o68ti] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4tjz7o68ti] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4tjz7o68ti] { text-align: center; }
.text-muted[b-4tjz7o68ti] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4tjz7o68ti], .crud-empty-state[b-4tjz7o68ti] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4tjz7o68ti] { font-size: 2rem; }
.crud-spinner[b-4tjz7o68ti] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4tjz7o68ti 0.6s linear infinite; }
.crud-spinner-sm[b-4tjz7o68ti] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4tjz7o68ti 0.6s linear infinite; }
@keyframes spin-b-4tjz7o68ti { to { transform: rotate(360deg); } }
.spin[b-4tjz7o68ti] { animation: spin-b-4tjz7o68ti 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4tjz7o68ti] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4tjz7o68ti 0.15s ease-out; }
.modal-container[b-4tjz7o68ti] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4tjz7o68ti] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4tjz7o68ti 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4tjz7o68ti] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4tjz7o68ti] { max-width: 420px; }
@keyframes fadeIn-b-4tjz7o68ti { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4tjz7o68ti { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4tjz7o68ti] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4tjz7o68ti] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4tjz7o68ti] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4tjz7o68ti] { color: #dc2626; }
.modal-close[b-4tjz7o68ti] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4tjz7o68ti] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4tjz7o68ti] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4tjz7o68ti] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4tjz7o68ti] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4tjz7o68ti] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4tjz7o68ti] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4tjz7o68ti] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4tjz7o68ti] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4tjz7o68ti] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4tjz7o68ti] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4tjz7o68ti] { flex: 2; }
.form-group label[b-4tjz7o68ti] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4tjz7o68ti], .form-group select[b-4tjz7o68ti], .form-textarea[b-4tjz7o68ti] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4tjz7o68ti], .form-group select:focus[b-4tjz7o68ti], .form-textarea:focus[b-4tjz7o68ti] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4tjz7o68ti] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4tjz7o68ti] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4tjz7o68ti] { flex: 1; display: flex; align-items: center; }
.form-check[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4tjz7o68ti] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4tjz7o68ti] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4tjz7o68ti] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4tjz7o68ti] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4tjz7o68ti] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4tjz7o68ti] { font-size: 3rem; }
.photo-placeholder span[b-4tjz7o68ti] { font-size: 0.78rem; }
.photo-actions[b-4tjz7o68ti] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4tjz7o68ti] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4tjz7o68ti] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4tjz7o68ti] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4tjz7o68ti] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4tjz7o68ti] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4tjz7o68ti] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4tjz7o68ti] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4tjz7o68ti] { filter: brightness(1.15); transform: scale(1.05); }
[b-4tjz7o68ti] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4tjz7o68ti] { padding: 0.75rem; }
    .crud-header[b-4tjz7o68ti] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4tjz7o68ti] { font-size: 1.1rem; }
    .btn-text[b-4tjz7o68ti] { display: none; }
    .form-row[b-4tjz7o68ti] { flex-direction: column; }
    .form-row-4[b-4tjz7o68ti] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4tjz7o68ti] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4tjz7o68ti] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4tjz7o68ti] { padding: 0.75rem; }
    .modal-tabs[b-4tjz7o68ti] { overflow-x: auto; }
    .modal-tab[b-4tjz7o68ti] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4tjz7o68ti] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4tjz7o68ti] { display: grid !important; }
    .crud-cards-wrapper[b-4tjz7o68ti] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4tjz7o68ti] { grid-template-columns: 1fr; }
    .card-details[b-4tjz7o68ti] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4tjz7o68ti] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4tjz7o68ti] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4tjz7o68ti] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4tjz7o68ti] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_conduce_requiereconfirmacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-53l2f5zzc3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-53l2f5zzc3 0.3s ease-out; }
@keyframes slideUp-b-53l2f5zzc3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-53l2f5zzc3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-53l2f5zzc3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-53l2f5zzc3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-53l2f5zzc3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-53l2f5zzc3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-53l2f5zzc3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-53l2f5zzc3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-53l2f5zzc3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-53l2f5zzc3] { filter: brightness(1.1); }
.btn-outline[b-53l2f5zzc3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-53l2f5zzc3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-53l2f5zzc3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-53l2f5zzc3] { filter: brightness(1.1); }
.btn-icon[b-53l2f5zzc3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-53l2f5zzc3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-53l2f5zzc3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-53l2f5zzc3] { color: #ef4444; }
.btn-delete:hover[b-53l2f5zzc3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-53l2f5zzc3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-53l2f5zzc3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-53l2f5zzc3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-53l2f5zzc3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-53l2f5zzc3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-53l2f5zzc3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-53l2f5zzc3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-53l2f5zzc3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-53l2f5zzc3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-53l2f5zzc3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-53l2f5zzc3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-53l2f5zzc3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-53l2f5zzc3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-53l2f5zzc3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-53l2f5zzc3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-53l2f5zzc3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-53l2f5zzc3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-53l2f5zzc3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-53l2f5zzc3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-53l2f5zzc3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-53l2f5zzc3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-53l2f5zzc3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-53l2f5zzc3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-53l2f5zzc3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-53l2f5zzc3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-53l2f5zzc3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-53l2f5zzc3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-53l2f5zzc3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-53l2f5zzc3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-53l2f5zzc3] { display: block; }
.hide-on-cards[b-53l2f5zzc3] { display: none !important; }
.show-on-cards[b-53l2f5zzc3] { display: grid; }
.hide-on-grid[b-53l2f5zzc3] { display: none !important; }

/* Badges */
.badge[b-53l2f5zzc3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-53l2f5zzc3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-53l2f5zzc3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-53l2f5zzc3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-53l2f5zzc3] { text-align: center; }
.text-muted[b-53l2f5zzc3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-53l2f5zzc3], .crud-empty-state[b-53l2f5zzc3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-53l2f5zzc3] { font-size: 2rem; }
.crud-spinner[b-53l2f5zzc3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-53l2f5zzc3 0.6s linear infinite; }
.crud-spinner-sm[b-53l2f5zzc3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-53l2f5zzc3 0.6s linear infinite; }
@keyframes spin-b-53l2f5zzc3 { to { transform: rotate(360deg); } }
.spin[b-53l2f5zzc3] { animation: spin-b-53l2f5zzc3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-53l2f5zzc3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-53l2f5zzc3 0.15s ease-out; }
.modal-container[b-53l2f5zzc3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-53l2f5zzc3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-53l2f5zzc3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-53l2f5zzc3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-53l2f5zzc3] { max-width: 420px; }
@keyframes fadeIn-b-53l2f5zzc3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-53l2f5zzc3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-53l2f5zzc3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-53l2f5zzc3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-53l2f5zzc3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-53l2f5zzc3] { color: #dc2626; }
.modal-close[b-53l2f5zzc3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-53l2f5zzc3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-53l2f5zzc3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-53l2f5zzc3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-53l2f5zzc3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-53l2f5zzc3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-53l2f5zzc3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-53l2f5zzc3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-53l2f5zzc3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-53l2f5zzc3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-53l2f5zzc3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-53l2f5zzc3] { flex: 2; }
.form-group label[b-53l2f5zzc3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-53l2f5zzc3], .form-group select[b-53l2f5zzc3], .form-textarea[b-53l2f5zzc3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-53l2f5zzc3], .form-group select:focus[b-53l2f5zzc3], .form-textarea:focus[b-53l2f5zzc3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-53l2f5zzc3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-53l2f5zzc3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-53l2f5zzc3] { flex: 1; display: flex; align-items: center; }
.form-check[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-53l2f5zzc3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-53l2f5zzc3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-53l2f5zzc3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-53l2f5zzc3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-53l2f5zzc3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-53l2f5zzc3] { font-size: 3rem; }
.photo-placeholder span[b-53l2f5zzc3] { font-size: 0.78rem; }
.photo-actions[b-53l2f5zzc3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-53l2f5zzc3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-53l2f5zzc3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-53l2f5zzc3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-53l2f5zzc3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-53l2f5zzc3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-53l2f5zzc3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-53l2f5zzc3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-53l2f5zzc3] { filter: brightness(1.15); transform: scale(1.05); }
[b-53l2f5zzc3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-53l2f5zzc3] { padding: 0.75rem; }
    .crud-header[b-53l2f5zzc3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-53l2f5zzc3] { font-size: 1.1rem; }
    .btn-text[b-53l2f5zzc3] { display: none; }
    .form-row[b-53l2f5zzc3] { flex-direction: column; }
    .form-row-4[b-53l2f5zzc3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-53l2f5zzc3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-53l2f5zzc3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-53l2f5zzc3] { padding: 0.75rem; }
    .modal-tabs[b-53l2f5zzc3] { overflow-x: auto; }
    .modal-tab[b-53l2f5zzc3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-53l2f5zzc3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-53l2f5zzc3] { display: grid !important; }
    .crud-cards-wrapper[b-53l2f5zzc3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-53l2f5zzc3] { grid-template-columns: 1fr; }
    .card-details[b-53l2f5zzc3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-53l2f5zzc3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-53l2f5zzc3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-53l2f5zzc3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-53l2f5zzc3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_confirmaconduce.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-p040rq00rf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-p040rq00rf 0.3s ease-out; }
@keyframes slideUp-b-p040rq00rf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-p040rq00rf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-p040rq00rf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-p040rq00rf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-p040rq00rf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-p040rq00rf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-p040rq00rf] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-p040rq00rf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-p040rq00rf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-p040rq00rf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-p040rq00rf] { filter: brightness(1.1); }
.btn-outline[b-p040rq00rf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-p040rq00rf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-p040rq00rf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-p040rq00rf] { filter: brightness(1.1); }
.btn-icon[b-p040rq00rf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-p040rq00rf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-p040rq00rf] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-p040rq00rf] { color: #ef4444; }
.btn-delete:hover[b-p040rq00rf] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-p040rq00rf] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-p040rq00rf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-p040rq00rf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-p040rq00rf] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-p040rq00rf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-p040rq00rf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-p040rq00rf] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-p040rq00rf] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-p040rq00rf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-p040rq00rf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-p040rq00rf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-p040rq00rf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-p040rq00rf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-p040rq00rf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-p040rq00rf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-p040rq00rf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-p040rq00rf] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-p040rq00rf] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-p040rq00rf] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-p040rq00rf] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-p040rq00rf] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-p040rq00rf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-p040rq00rf] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-p040rq00rf] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-p040rq00rf] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-p040rq00rf] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-p040rq00rf] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-p040rq00rf] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-p040rq00rf] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-p040rq00rf] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-p040rq00rf] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-p040rq00rf] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-p040rq00rf] { display: block; }
.hide-on-cards[b-p040rq00rf] { display: none !important; }
.show-on-cards[b-p040rq00rf] { display: grid; }
.hide-on-grid[b-p040rq00rf] { display: none !important; }

/* Badges */
.badge[b-p040rq00rf] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-p040rq00rf] { background: #ecfdf5; color: #065f46; }
.badge-no[b-p040rq00rf] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-p040rq00rf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-p040rq00rf] { text-align: center; }
.text-muted[b-p040rq00rf] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-p040rq00rf], .crud-empty-state[b-p040rq00rf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-p040rq00rf] { font-size: 2rem; }
.crud-spinner[b-p040rq00rf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-p040rq00rf 0.6s linear infinite; }
.crud-spinner-sm[b-p040rq00rf] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-p040rq00rf 0.6s linear infinite; }
@keyframes spin-b-p040rq00rf { to { transform: rotate(360deg); } }
.spin[b-p040rq00rf] { animation: spin-b-p040rq00rf 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-p040rq00rf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-p040rq00rf 0.15s ease-out; }
.modal-container[b-p040rq00rf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-p040rq00rf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-p040rq00rf 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-p040rq00rf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-p040rq00rf] { max-width: 420px; }
@keyframes fadeIn-b-p040rq00rf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-p040rq00rf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-p040rq00rf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-p040rq00rf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-p040rq00rf] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-p040rq00rf] { color: #dc2626; }
.modal-close[b-p040rq00rf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-p040rq00rf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-p040rq00rf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-p040rq00rf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-p040rq00rf] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-p040rq00rf] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-p040rq00rf] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-p040rq00rf] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-p040rq00rf] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-p040rq00rf] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-p040rq00rf] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-p040rq00rf] { flex: 2; }
.form-group label[b-p040rq00rf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-p040rq00rf], .form-group select[b-p040rq00rf], .form-textarea[b-p040rq00rf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-p040rq00rf], .form-group select:focus[b-p040rq00rf], .form-textarea:focus[b-p040rq00rf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-p040rq00rf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-p040rq00rf] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-p040rq00rf] { flex: 1; display: flex; align-items: center; }
.form-check[b-p040rq00rf] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-p040rq00rf] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-p040rq00rf] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-p040rq00rf] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-p040rq00rf] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-p040rq00rf] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-p040rq00rf] { font-size: 3rem; }
.photo-placeholder span[b-p040rq00rf] { font-size: 0.78rem; }
.photo-actions[b-p040rq00rf] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-p040rq00rf] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-p040rq00rf] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-p040rq00rf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-p040rq00rf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-p040rq00rf] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-p040rq00rf] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-p040rq00rf] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-p040rq00rf] { filter: brightness(1.15); transform: scale(1.05); }
[b-p040rq00rf] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-p040rq00rf] { padding: 0.75rem; }
    .crud-header[b-p040rq00rf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-p040rq00rf] { font-size: 1.1rem; }
    .btn-text[b-p040rq00rf] { display: none; }
    .form-row[b-p040rq00rf] { flex-direction: column; }
    .form-row-4[b-p040rq00rf] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-p040rq00rf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-p040rq00rf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-p040rq00rf] { padding: 0.75rem; }
    .modal-tabs[b-p040rq00rf] { overflow-x: auto; }
    .modal-tab[b-p040rq00rf] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-p040rq00rf] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-p040rq00rf] { display: grid !important; }
    .crud-cards-wrapper[b-p040rq00rf] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-p040rq00rf] { grid-template-columns: 1fr; }
    .card-details[b-p040rq00rf] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-p040rq00rf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-p040rq00rf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-p040rq00rf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-p040rq00rf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_entradas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-54irrbrtq5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-54irrbrtq5 0.3s ease-out; }
@keyframes slideUp-b-54irrbrtq5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-54irrbrtq5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-54irrbrtq5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-54irrbrtq5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-54irrbrtq5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-54irrbrtq5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-54irrbrtq5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-54irrbrtq5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-54irrbrtq5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-54irrbrtq5] { filter: brightness(1.1); }
.btn-outline[b-54irrbrtq5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-54irrbrtq5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-54irrbrtq5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-54irrbrtq5] { filter: brightness(1.1); }
.btn-icon[b-54irrbrtq5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-54irrbrtq5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-54irrbrtq5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-54irrbrtq5] { color: #ef4444; }
.btn-delete:hover[b-54irrbrtq5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-54irrbrtq5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-54irrbrtq5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-54irrbrtq5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-54irrbrtq5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-54irrbrtq5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-54irrbrtq5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-54irrbrtq5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-54irrbrtq5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-54irrbrtq5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-54irrbrtq5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-54irrbrtq5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-54irrbrtq5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-54irrbrtq5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-54irrbrtq5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-54irrbrtq5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-54irrbrtq5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-54irrbrtq5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-54irrbrtq5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-54irrbrtq5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-54irrbrtq5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-54irrbrtq5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-54irrbrtq5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-54irrbrtq5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-54irrbrtq5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-54irrbrtq5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-54irrbrtq5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-54irrbrtq5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-54irrbrtq5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-54irrbrtq5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-54irrbrtq5] { display: block; }
.hide-on-cards[b-54irrbrtq5] { display: none !important; }
.show-on-cards[b-54irrbrtq5] { display: grid; }
.hide-on-grid[b-54irrbrtq5] { display: none !important; }

/* Badges */
.badge[b-54irrbrtq5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-54irrbrtq5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-54irrbrtq5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-54irrbrtq5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-54irrbrtq5] { text-align: center; }
.text-muted[b-54irrbrtq5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-54irrbrtq5], .crud-empty-state[b-54irrbrtq5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-54irrbrtq5] { font-size: 2rem; }
.crud-spinner[b-54irrbrtq5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-54irrbrtq5 0.6s linear infinite; }
.crud-spinner-sm[b-54irrbrtq5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-54irrbrtq5 0.6s linear infinite; }
@keyframes spin-b-54irrbrtq5 { to { transform: rotate(360deg); } }
.spin[b-54irrbrtq5] { animation: spin-b-54irrbrtq5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-54irrbrtq5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-54irrbrtq5 0.15s ease-out; }
.modal-container[b-54irrbrtq5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-54irrbrtq5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-54irrbrtq5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-54irrbrtq5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-54irrbrtq5] { max-width: 420px; }
@keyframes fadeIn-b-54irrbrtq5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-54irrbrtq5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-54irrbrtq5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-54irrbrtq5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-54irrbrtq5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-54irrbrtq5] { color: #dc2626; }
.modal-close[b-54irrbrtq5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-54irrbrtq5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-54irrbrtq5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-54irrbrtq5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-54irrbrtq5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-54irrbrtq5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-54irrbrtq5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-54irrbrtq5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-54irrbrtq5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-54irrbrtq5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-54irrbrtq5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-54irrbrtq5] { flex: 2; }
.form-group label[b-54irrbrtq5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-54irrbrtq5], .form-group select[b-54irrbrtq5], .form-textarea[b-54irrbrtq5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-54irrbrtq5], .form-group select:focus[b-54irrbrtq5], .form-textarea:focus[b-54irrbrtq5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-54irrbrtq5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-54irrbrtq5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-54irrbrtq5] { flex: 1; display: flex; align-items: center; }
.form-check[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-54irrbrtq5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-54irrbrtq5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-54irrbrtq5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-54irrbrtq5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-54irrbrtq5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-54irrbrtq5] { font-size: 3rem; }
.photo-placeholder span[b-54irrbrtq5] { font-size: 0.78rem; }
.photo-actions[b-54irrbrtq5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-54irrbrtq5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-54irrbrtq5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-54irrbrtq5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-54irrbrtq5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-54irrbrtq5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-54irrbrtq5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-54irrbrtq5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-54irrbrtq5] { filter: brightness(1.15); transform: scale(1.05); }
[b-54irrbrtq5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-54irrbrtq5] { padding: 0.75rem; }
    .crud-header[b-54irrbrtq5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-54irrbrtq5] { font-size: 1.1rem; }
    .btn-text[b-54irrbrtq5] { display: none; }
    .form-row[b-54irrbrtq5] { flex-direction: column; }
    .form-row-4[b-54irrbrtq5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-54irrbrtq5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-54irrbrtq5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-54irrbrtq5] { padding: 0.75rem; }
    .modal-tabs[b-54irrbrtq5] { overflow-x: auto; }
    .modal-tab[b-54irrbrtq5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-54irrbrtq5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-54irrbrtq5] { display: grid !important; }
    .crud-cards-wrapper[b-54irrbrtq5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-54irrbrtq5] { grid-template-columns: 1fr; }
    .card-details[b-54irrbrtq5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-54irrbrtq5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-54irrbrtq5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-54irrbrtq5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-54irrbrtq5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_factura.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7v2eanv69e] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7v2eanv69e 0.3s ease-out; }
@keyframes slideUp-b-7v2eanv69e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7v2eanv69e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7v2eanv69e] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7v2eanv69e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7v2eanv69e] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7v2eanv69e] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7v2eanv69e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7v2eanv69e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7v2eanv69e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7v2eanv69e] { filter: brightness(1.1); }
.btn-outline[b-7v2eanv69e] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7v2eanv69e] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7v2eanv69e] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7v2eanv69e] { filter: brightness(1.1); }
.btn-icon[b-7v2eanv69e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7v2eanv69e] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7v2eanv69e] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7v2eanv69e] { color: #ef4444; }
.btn-delete:hover[b-7v2eanv69e] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7v2eanv69e] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7v2eanv69e] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7v2eanv69e] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7v2eanv69e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7v2eanv69e] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7v2eanv69e] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7v2eanv69e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7v2eanv69e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7v2eanv69e] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7v2eanv69e] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7v2eanv69e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7v2eanv69e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7v2eanv69e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7v2eanv69e] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7v2eanv69e] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7v2eanv69e] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7v2eanv69e] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7v2eanv69e] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7v2eanv69e] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7v2eanv69e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7v2eanv69e] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7v2eanv69e] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7v2eanv69e] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7v2eanv69e] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7v2eanv69e] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7v2eanv69e] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7v2eanv69e] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7v2eanv69e] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7v2eanv69e] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7v2eanv69e] { display: block; }
.hide-on-cards[b-7v2eanv69e] { display: none !important; }
.show-on-cards[b-7v2eanv69e] { display: grid; }
.hide-on-grid[b-7v2eanv69e] { display: none !important; }

/* Badges */
.badge[b-7v2eanv69e] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7v2eanv69e] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7v2eanv69e] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7v2eanv69e] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7v2eanv69e] { text-align: center; }
.text-muted[b-7v2eanv69e] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7v2eanv69e], .crud-empty-state[b-7v2eanv69e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7v2eanv69e] { font-size: 2rem; }
.crud-spinner[b-7v2eanv69e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7v2eanv69e 0.6s linear infinite; }
.crud-spinner-sm[b-7v2eanv69e] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7v2eanv69e 0.6s linear infinite; }
@keyframes spin-b-7v2eanv69e { to { transform: rotate(360deg); } }
.spin[b-7v2eanv69e] { animation: spin-b-7v2eanv69e 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7v2eanv69e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7v2eanv69e 0.15s ease-out; }
.modal-container[b-7v2eanv69e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7v2eanv69e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7v2eanv69e 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7v2eanv69e] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7v2eanv69e] { max-width: 420px; }
@keyframes fadeIn-b-7v2eanv69e { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7v2eanv69e { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7v2eanv69e] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7v2eanv69e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7v2eanv69e] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7v2eanv69e] { color: #dc2626; }
.modal-close[b-7v2eanv69e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7v2eanv69e] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7v2eanv69e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7v2eanv69e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7v2eanv69e] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7v2eanv69e] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7v2eanv69e] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7v2eanv69e] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7v2eanv69e] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7v2eanv69e] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7v2eanv69e] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7v2eanv69e] { flex: 2; }
.form-group label[b-7v2eanv69e] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7v2eanv69e], .form-group select[b-7v2eanv69e], .form-textarea[b-7v2eanv69e] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7v2eanv69e], .form-group select:focus[b-7v2eanv69e], .form-textarea:focus[b-7v2eanv69e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7v2eanv69e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7v2eanv69e] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7v2eanv69e] { flex: 1; display: flex; align-items: center; }
.form-check[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7v2eanv69e] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7v2eanv69e] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7v2eanv69e] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7v2eanv69e] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7v2eanv69e] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7v2eanv69e] { font-size: 3rem; }
.photo-placeholder span[b-7v2eanv69e] { font-size: 0.78rem; }
.photo-actions[b-7v2eanv69e] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7v2eanv69e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7v2eanv69e] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7v2eanv69e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7v2eanv69e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7v2eanv69e] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7v2eanv69e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7v2eanv69e] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7v2eanv69e] { filter: brightness(1.15); transform: scale(1.05); }
[b-7v2eanv69e] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7v2eanv69e] { padding: 0.75rem; }
    .crud-header[b-7v2eanv69e] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7v2eanv69e] { font-size: 1.1rem; }
    .btn-text[b-7v2eanv69e] { display: none; }
    .form-row[b-7v2eanv69e] { flex-direction: column; }
    .form-row-4[b-7v2eanv69e] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7v2eanv69e] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7v2eanv69e] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7v2eanv69e] { padding: 0.75rem; }
    .modal-tabs[b-7v2eanv69e] { overflow-x: auto; }
    .modal-tab[b-7v2eanv69e] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7v2eanv69e] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7v2eanv69e] { display: grid !important; }
    .crud-cards-wrapper[b-7v2eanv69e] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7v2eanv69e] { grid-template-columns: 1fr; }
    .card-details[b-7v2eanv69e] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7v2eanv69e] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7v2eanv69e] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7v2eanv69e] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7v2eanv69e] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_facturaemitidas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-049r8l8x8m] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-049r8l8x8m 0.3s ease-out; }
@keyframes slideUp-b-049r8l8x8m { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-049r8l8x8m] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-049r8l8x8m] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-049r8l8x8m] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-049r8l8x8m] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-049r8l8x8m] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-049r8l8x8m] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-049r8l8x8m] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-049r8l8x8m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-049r8l8x8m] { filter: brightness(1.1); }
.btn-outline[b-049r8l8x8m] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-049r8l8x8m] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-049r8l8x8m] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-049r8l8x8m] { filter: brightness(1.1); }
.btn-icon[b-049r8l8x8m] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-049r8l8x8m] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-049r8l8x8m] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-049r8l8x8m] { color: #ef4444; }
.btn-delete:hover[b-049r8l8x8m] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-049r8l8x8m] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-049r8l8x8m] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-049r8l8x8m] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-049r8l8x8m] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-049r8l8x8m] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-049r8l8x8m] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-049r8l8x8m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-049r8l8x8m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-049r8l8x8m] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-049r8l8x8m] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-049r8l8x8m] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-049r8l8x8m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-049r8l8x8m] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-049r8l8x8m] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-049r8l8x8m] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-049r8l8x8m] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-049r8l8x8m] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-049r8l8x8m] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-049r8l8x8m] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-049r8l8x8m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-049r8l8x8m] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-049r8l8x8m] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-049r8l8x8m] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-049r8l8x8m] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-049r8l8x8m] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-049r8l8x8m] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-049r8l8x8m] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-049r8l8x8m] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-049r8l8x8m] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-049r8l8x8m] { display: block; }
.hide-on-cards[b-049r8l8x8m] { display: none !important; }
.show-on-cards[b-049r8l8x8m] { display: grid; }
.hide-on-grid[b-049r8l8x8m] { display: none !important; }

/* Badges */
.badge[b-049r8l8x8m] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-049r8l8x8m] { background: #ecfdf5; color: #065f46; }
.badge-no[b-049r8l8x8m] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-049r8l8x8m] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-049r8l8x8m] { text-align: center; }
.text-muted[b-049r8l8x8m] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-049r8l8x8m], .crud-empty-state[b-049r8l8x8m] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-049r8l8x8m] { font-size: 2rem; }
.crud-spinner[b-049r8l8x8m] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-049r8l8x8m 0.6s linear infinite; }
.crud-spinner-sm[b-049r8l8x8m] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-049r8l8x8m 0.6s linear infinite; }
@keyframes spin-b-049r8l8x8m { to { transform: rotate(360deg); } }
.spin[b-049r8l8x8m] { animation: spin-b-049r8l8x8m 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-049r8l8x8m] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-049r8l8x8m 0.15s ease-out; }
.modal-container[b-049r8l8x8m] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-049r8l8x8m] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-049r8l8x8m 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-049r8l8x8m] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-049r8l8x8m] { max-width: 420px; }
@keyframes fadeIn-b-049r8l8x8m { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-049r8l8x8m { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-049r8l8x8m] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-049r8l8x8m] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-049r8l8x8m] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-049r8l8x8m] { color: #dc2626; }
.modal-close[b-049r8l8x8m] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-049r8l8x8m] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-049r8l8x8m] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-049r8l8x8m] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-049r8l8x8m] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-049r8l8x8m] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-049r8l8x8m] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-049r8l8x8m] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-049r8l8x8m] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-049r8l8x8m] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-049r8l8x8m] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-049r8l8x8m] { flex: 2; }
.form-group label[b-049r8l8x8m] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-049r8l8x8m], .form-group select[b-049r8l8x8m], .form-textarea[b-049r8l8x8m] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-049r8l8x8m], .form-group select:focus[b-049r8l8x8m], .form-textarea:focus[b-049r8l8x8m] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-049r8l8x8m] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-049r8l8x8m] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-049r8l8x8m] { flex: 1; display: flex; align-items: center; }
.form-check[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-049r8l8x8m] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-049r8l8x8m] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-049r8l8x8m] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-049r8l8x8m] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-049r8l8x8m] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-049r8l8x8m] { font-size: 3rem; }
.photo-placeholder span[b-049r8l8x8m] { font-size: 0.78rem; }
.photo-actions[b-049r8l8x8m] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-049r8l8x8m] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-049r8l8x8m] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-049r8l8x8m] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-049r8l8x8m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-049r8l8x8m] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-049r8l8x8m] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-049r8l8x8m] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-049r8l8x8m] { filter: brightness(1.15); transform: scale(1.05); }
[b-049r8l8x8m] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-049r8l8x8m] { padding: 0.75rem; }
    .crud-header[b-049r8l8x8m] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-049r8l8x8m] { font-size: 1.1rem; }
    .btn-text[b-049r8l8x8m] { display: none; }
    .form-row[b-049r8l8x8m] { flex-direction: column; }
    .form-row-4[b-049r8l8x8m] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-049r8l8x8m] { width: 98%; max-height: 95vh; }
    .modal-lg[b-049r8l8x8m] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-049r8l8x8m] { padding: 0.75rem; }
    .modal-tabs[b-049r8l8x8m] { overflow-x: auto; }
    .modal-tab[b-049r8l8x8m] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-049r8l8x8m] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-049r8l8x8m] { display: grid !important; }
    .crud-cards-wrapper[b-049r8l8x8m] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-049r8l8x8m] { grid-template-columns: 1fr; }
    .card-details[b-049r8l8x8m] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-049r8l8x8m] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-049r8l8x8m] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-049r8l8x8m] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-049r8l8x8m] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_maestraplasticos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1giemloqeh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1giemloqeh 0.3s ease-out; }
@keyframes slideUp-b-1giemloqeh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1giemloqeh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1giemloqeh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1giemloqeh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1giemloqeh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1giemloqeh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1giemloqeh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1giemloqeh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1giemloqeh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1giemloqeh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1giemloqeh] { filter: brightness(1.1); }
.btn-outline[b-1giemloqeh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1giemloqeh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1giemloqeh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1giemloqeh] { filter: brightness(1.1); }
.btn-icon[b-1giemloqeh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1giemloqeh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1giemloqeh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1giemloqeh] { color: #ef4444; }
.btn-delete:hover[b-1giemloqeh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1giemloqeh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1giemloqeh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1giemloqeh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1giemloqeh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1giemloqeh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1giemloqeh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1giemloqeh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1giemloqeh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1giemloqeh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1giemloqeh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1giemloqeh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1giemloqeh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1giemloqeh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1giemloqeh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1giemloqeh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1giemloqeh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1giemloqeh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1giemloqeh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1giemloqeh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1giemloqeh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1giemloqeh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1giemloqeh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1giemloqeh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1giemloqeh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1giemloqeh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1giemloqeh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1giemloqeh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1giemloqeh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1giemloqeh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1giemloqeh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1giemloqeh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1giemloqeh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1giemloqeh] { display: block; }
.hide-on-cards[b-1giemloqeh] { display: none !important; }
.show-on-cards[b-1giemloqeh] { display: grid; }
.hide-on-grid[b-1giemloqeh] { display: none !important; }

/* Badges */
.badge[b-1giemloqeh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1giemloqeh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1giemloqeh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1giemloqeh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1giemloqeh] { text-align: center; }
.text-muted[b-1giemloqeh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1giemloqeh], .crud-empty-state[b-1giemloqeh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1giemloqeh] { font-size: 2rem; }
.crud-spinner[b-1giemloqeh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1giemloqeh 0.6s linear infinite; }
.crud-spinner-sm[b-1giemloqeh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1giemloqeh 0.6s linear infinite; }
@keyframes spin-b-1giemloqeh { to { transform: rotate(360deg); } }
.spin[b-1giemloqeh] { animation: spin-b-1giemloqeh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1giemloqeh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1giemloqeh 0.15s ease-out; }
.modal-container[b-1giemloqeh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1giemloqeh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1giemloqeh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1giemloqeh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1giemloqeh] { max-width: 420px; }
@keyframes fadeIn-b-1giemloqeh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1giemloqeh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1giemloqeh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1giemloqeh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1giemloqeh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1giemloqeh] { color: #dc2626; }
.modal-close[b-1giemloqeh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1giemloqeh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1giemloqeh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1giemloqeh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1giemloqeh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1giemloqeh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1giemloqeh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1giemloqeh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1giemloqeh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1giemloqeh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1giemloqeh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1giemloqeh] { flex: 2; }
.form-group label[b-1giemloqeh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1giemloqeh], .form-group select[b-1giemloqeh], .form-textarea[b-1giemloqeh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1giemloqeh], .form-group select:focus[b-1giemloqeh], .form-textarea:focus[b-1giemloqeh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1giemloqeh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1giemloqeh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1giemloqeh] { flex: 1; display: flex; align-items: center; }
.form-check[b-1giemloqeh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1giemloqeh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1giemloqeh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1giemloqeh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1giemloqeh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1giemloqeh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1giemloqeh] { font-size: 3rem; }
.photo-placeholder span[b-1giemloqeh] { font-size: 0.78rem; }
.photo-actions[b-1giemloqeh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1giemloqeh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1giemloqeh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1giemloqeh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1giemloqeh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1giemloqeh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1giemloqeh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1giemloqeh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1giemloqeh] { filter: brightness(1.15); transform: scale(1.05); }
[b-1giemloqeh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1giemloqeh] { padding: 0.75rem; }
    .crud-header[b-1giemloqeh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1giemloqeh] { font-size: 1.1rem; }
    .btn-text[b-1giemloqeh] { display: none; }
    .form-row[b-1giemloqeh] { flex-direction: column; }
    .form-row-4[b-1giemloqeh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1giemloqeh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1giemloqeh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1giemloqeh] { padding: 0.75rem; }
    .modal-tabs[b-1giemloqeh] { overflow-x: auto; }
    .modal-tab[b-1giemloqeh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1giemloqeh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1giemloqeh] { display: grid !important; }
    .crud-cards-wrapper[b-1giemloqeh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1giemloqeh] { grid-template-columns: 1fr; }
    .card-details[b-1giemloqeh] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1giemloqeh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1giemloqeh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1giemloqeh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1giemloqeh] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_registraconteoinventario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kmtduhvpd3] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kmtduhvpd3 0.3s ease-out; }
@keyframes slideUp-b-kmtduhvpd3 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kmtduhvpd3] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kmtduhvpd3] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kmtduhvpd3] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kmtduhvpd3] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kmtduhvpd3] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kmtduhvpd3] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kmtduhvpd3] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kmtduhvpd3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kmtduhvpd3] { filter: brightness(1.1); }
.btn-outline[b-kmtduhvpd3] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kmtduhvpd3] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kmtduhvpd3] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kmtduhvpd3] { filter: brightness(1.1); }
.btn-icon[b-kmtduhvpd3] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kmtduhvpd3] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kmtduhvpd3] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kmtduhvpd3] { color: #ef4444; }
.btn-delete:hover[b-kmtduhvpd3] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kmtduhvpd3] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kmtduhvpd3] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kmtduhvpd3] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kmtduhvpd3] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kmtduhvpd3] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kmtduhvpd3] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kmtduhvpd3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kmtduhvpd3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kmtduhvpd3] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kmtduhvpd3] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kmtduhvpd3] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kmtduhvpd3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kmtduhvpd3] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kmtduhvpd3] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kmtduhvpd3] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kmtduhvpd3] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kmtduhvpd3] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kmtduhvpd3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kmtduhvpd3] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kmtduhvpd3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kmtduhvpd3] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kmtduhvpd3] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kmtduhvpd3] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kmtduhvpd3] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kmtduhvpd3] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kmtduhvpd3] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kmtduhvpd3] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kmtduhvpd3] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kmtduhvpd3] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kmtduhvpd3] { display: block; }
.hide-on-cards[b-kmtduhvpd3] { display: none !important; }
.show-on-cards[b-kmtduhvpd3] { display: grid; }
.hide-on-grid[b-kmtduhvpd3] { display: none !important; }

/* Badges */
.badge[b-kmtduhvpd3] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kmtduhvpd3] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kmtduhvpd3] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kmtduhvpd3] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kmtduhvpd3] { text-align: center; }
.text-muted[b-kmtduhvpd3] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kmtduhvpd3], .crud-empty-state[b-kmtduhvpd3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kmtduhvpd3] { font-size: 2rem; }
.crud-spinner[b-kmtduhvpd3] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kmtduhvpd3 0.6s linear infinite; }
.crud-spinner-sm[b-kmtduhvpd3] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kmtduhvpd3 0.6s linear infinite; }
@keyframes spin-b-kmtduhvpd3 { to { transform: rotate(360deg); } }
.spin[b-kmtduhvpd3] { animation: spin-b-kmtduhvpd3 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kmtduhvpd3] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kmtduhvpd3 0.15s ease-out; }
.modal-container[b-kmtduhvpd3] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kmtduhvpd3] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kmtduhvpd3 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-kmtduhvpd3] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kmtduhvpd3] { max-width: 420px; }
@keyframes fadeIn-b-kmtduhvpd3 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kmtduhvpd3 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kmtduhvpd3] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kmtduhvpd3] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kmtduhvpd3] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kmtduhvpd3] { color: #dc2626; }
.modal-close[b-kmtduhvpd3] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kmtduhvpd3] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kmtduhvpd3] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kmtduhvpd3] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kmtduhvpd3] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kmtduhvpd3] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kmtduhvpd3] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kmtduhvpd3] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kmtduhvpd3] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kmtduhvpd3] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kmtduhvpd3] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kmtduhvpd3] { flex: 2; }
.form-group label[b-kmtduhvpd3] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kmtduhvpd3], .form-group select[b-kmtduhvpd3], .form-textarea[b-kmtduhvpd3] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kmtduhvpd3], .form-group select:focus[b-kmtduhvpd3], .form-textarea:focus[b-kmtduhvpd3] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kmtduhvpd3] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kmtduhvpd3] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kmtduhvpd3] { flex: 1; display: flex; align-items: center; }
.form-check[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kmtduhvpd3] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kmtduhvpd3] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kmtduhvpd3] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kmtduhvpd3] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kmtduhvpd3] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kmtduhvpd3] { font-size: 3rem; }
.photo-placeholder span[b-kmtduhvpd3] { font-size: 0.78rem; }
.photo-actions[b-kmtduhvpd3] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kmtduhvpd3] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-kmtduhvpd3] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kmtduhvpd3] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kmtduhvpd3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kmtduhvpd3] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kmtduhvpd3] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kmtduhvpd3] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kmtduhvpd3] { filter: brightness(1.15); transform: scale(1.05); }
[b-kmtduhvpd3] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kmtduhvpd3] { padding: 0.75rem; }
    .crud-header[b-kmtduhvpd3] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kmtduhvpd3] { font-size: 1.1rem; }
    .btn-text[b-kmtduhvpd3] { display: none; }
    .form-row[b-kmtduhvpd3] { flex-direction: column; }
    .form-row-4[b-kmtduhvpd3] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kmtduhvpd3] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kmtduhvpd3] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kmtduhvpd3] { padding: 0.75rem; }
    .modal-tabs[b-kmtduhvpd3] { overflow-x: auto; }
    .modal-tab[b-kmtduhvpd3] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kmtduhvpd3] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kmtduhvpd3] { display: grid !important; }
    .crud-cards-wrapper[b-kmtduhvpd3] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kmtduhvpd3] { grid-template-columns: 1fr; }
    .card-details[b-kmtduhvpd3] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-kmtduhvpd3] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kmtduhvpd3] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kmtduhvpd3] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kmtduhvpd3] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Plasticos/Frmpla_salidainventario.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2n0fha51o1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2n0fha51o1 0.3s ease-out; }
@keyframes slideUp-b-2n0fha51o1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2n0fha51o1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2n0fha51o1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2n0fha51o1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2n0fha51o1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2n0fha51o1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2n0fha51o1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2n0fha51o1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2n0fha51o1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2n0fha51o1] { filter: brightness(1.1); }
.btn-outline[b-2n0fha51o1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2n0fha51o1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2n0fha51o1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2n0fha51o1] { filter: brightness(1.1); }
.btn-icon[b-2n0fha51o1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2n0fha51o1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2n0fha51o1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2n0fha51o1] { color: #ef4444; }
.btn-delete:hover[b-2n0fha51o1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2n0fha51o1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2n0fha51o1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2n0fha51o1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2n0fha51o1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2n0fha51o1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2n0fha51o1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2n0fha51o1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2n0fha51o1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2n0fha51o1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2n0fha51o1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2n0fha51o1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2n0fha51o1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2n0fha51o1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2n0fha51o1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2n0fha51o1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2n0fha51o1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2n0fha51o1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2n0fha51o1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2n0fha51o1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2n0fha51o1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2n0fha51o1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2n0fha51o1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2n0fha51o1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2n0fha51o1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2n0fha51o1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2n0fha51o1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2n0fha51o1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2n0fha51o1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2n0fha51o1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2n0fha51o1] { display: block; }
.hide-on-cards[b-2n0fha51o1] { display: none !important; }
.show-on-cards[b-2n0fha51o1] { display: grid; }
.hide-on-grid[b-2n0fha51o1] { display: none !important; }

/* Badges */
.badge[b-2n0fha51o1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2n0fha51o1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2n0fha51o1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2n0fha51o1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2n0fha51o1] { text-align: center; }
.text-muted[b-2n0fha51o1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2n0fha51o1], .crud-empty-state[b-2n0fha51o1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2n0fha51o1] { font-size: 2rem; }
.crud-spinner[b-2n0fha51o1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2n0fha51o1 0.6s linear infinite; }
.crud-spinner-sm[b-2n0fha51o1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2n0fha51o1 0.6s linear infinite; }
@keyframes spin-b-2n0fha51o1 { to { transform: rotate(360deg); } }
.spin[b-2n0fha51o1] { animation: spin-b-2n0fha51o1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2n0fha51o1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2n0fha51o1 0.15s ease-out; }
.modal-container[b-2n0fha51o1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2n0fha51o1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2n0fha51o1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2n0fha51o1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2n0fha51o1] { max-width: 420px; }
@keyframes fadeIn-b-2n0fha51o1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2n0fha51o1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2n0fha51o1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2n0fha51o1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2n0fha51o1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2n0fha51o1] { color: #dc2626; }
.modal-close[b-2n0fha51o1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2n0fha51o1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2n0fha51o1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2n0fha51o1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2n0fha51o1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2n0fha51o1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2n0fha51o1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2n0fha51o1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2n0fha51o1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2n0fha51o1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2n0fha51o1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2n0fha51o1] { flex: 2; }
.form-group label[b-2n0fha51o1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2n0fha51o1], .form-group select[b-2n0fha51o1], .form-textarea[b-2n0fha51o1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2n0fha51o1], .form-group select:focus[b-2n0fha51o1], .form-textarea:focus[b-2n0fha51o1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2n0fha51o1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2n0fha51o1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2n0fha51o1] { flex: 1; display: flex; align-items: center; }
.form-check[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2n0fha51o1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2n0fha51o1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2n0fha51o1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2n0fha51o1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2n0fha51o1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2n0fha51o1] { font-size: 3rem; }
.photo-placeholder span[b-2n0fha51o1] { font-size: 0.78rem; }
.photo-actions[b-2n0fha51o1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2n0fha51o1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2n0fha51o1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2n0fha51o1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2n0fha51o1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2n0fha51o1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2n0fha51o1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2n0fha51o1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2n0fha51o1] { filter: brightness(1.15); transform: scale(1.05); }
[b-2n0fha51o1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2n0fha51o1] { padding: 0.75rem; }
    .crud-header[b-2n0fha51o1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2n0fha51o1] { font-size: 1.1rem; }
    .btn-text[b-2n0fha51o1] { display: none; }
    .form-row[b-2n0fha51o1] { flex-direction: column; }
    .form-row-4[b-2n0fha51o1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2n0fha51o1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2n0fha51o1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2n0fha51o1] { padding: 0.75rem; }
    .modal-tabs[b-2n0fha51o1] { overflow-x: auto; }
    .modal-tab[b-2n0fha51o1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2n0fha51o1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2n0fha51o1] { display: grid !important; }
    .crud-cards-wrapper[b-2n0fha51o1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2n0fha51o1] { grid-template-columns: 1fr; }
    .card-details[b-2n0fha51o1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2n0fha51o1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2n0fha51o1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2n0fha51o1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2n0fha51o1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Crprantiguedasaldov2_mrt.razor.rz.scp.css */
/* ============================================================
   Crprantiguedasaldov2_mrt — filtros, toggle y layout
   ============================================================ */

.ags-filtros-bar[b-cnqagmu1av] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: flex-end;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.6rem;
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
}

.ags-filtro[b-cnqagmu1av] {
    display: flex;
    flex-direction: column;
    min-width: 130px;
    flex: 1 1 130px;
}

.ags-filtro label[b-cnqagmu1av] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--rg-text-muted);
    margin-bottom: 0.25rem;
}

.ags-filtro .form-input[b-cnqagmu1av] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.4rem 0.55rem;
    font-size: 0.85rem;
}

.ags-filtro .form-input:focus[b-cnqagmu1av] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.ags-filtro-check[b-cnqagmu1av] {
    min-width: auto;
    flex: 0 0 auto;
}

.ags-check[b-cnqagmu1av] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    cursor: pointer;
    padding-bottom: 0.4rem;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
}

.ags-check input[b-cnqagmu1av] { width: 1rem; height: 1rem; cursor: pointer; }

.ags-btn-aplicar[b-cnqagmu1av] {
    align-self: flex-end;
    padding: 0.45rem 0.85rem;
    flex: 0 0 auto;
}

/* ── Toggle Por Cliente / Por Préstamo ─────────────────────── */
.ags-toggle[b-cnqagmu1av] {
    display: inline-flex;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.2rem;
    margin: 0.75rem 0 0.4rem;
}

.ags-toggle-btn[b-cnqagmu1av] {
    background: transparent;
    border: none;
    color: var(--rg-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.4rem 0.85rem;
    border-radius: 0.35rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: background 0.12s, color 0.12s;
}

.ags-toggle-btn:hover[b-cnqagmu1av] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

.ags-toggle-btn.active[b-cnqagmu1av] {
    background: var(--rg-primary);
    color: #fff;
}

[data-mode="dark"] .ags-toggle-btn.active[b-cnqagmu1av] {
    background: var(--rg-accent);
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-cnqagmu1av] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-cnqagmu1av] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-cnqagmu1av] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-cnqagmu1av] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmaccesoriodescuentocheque.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-xsboijkhqr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-xsboijkhqr 0.3s ease-out; }
@keyframes slideUp-b-xsboijkhqr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-xsboijkhqr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-xsboijkhqr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-xsboijkhqr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-xsboijkhqr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-xsboijkhqr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-xsboijkhqr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-xsboijkhqr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-xsboijkhqr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-xsboijkhqr] { filter: brightness(1.1); }
.btn-outline[b-xsboijkhqr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-xsboijkhqr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-xsboijkhqr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-xsboijkhqr] { filter: brightness(1.1); }
.btn-icon[b-xsboijkhqr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-xsboijkhqr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-xsboijkhqr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-xsboijkhqr] { color: #ef4444; }
.btn-delete:hover[b-xsboijkhqr] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-xsboijkhqr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-xsboijkhqr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-xsboijkhqr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-xsboijkhqr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-xsboijkhqr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-xsboijkhqr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-xsboijkhqr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-xsboijkhqr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-xsboijkhqr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-xsboijkhqr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-xsboijkhqr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-xsboijkhqr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-xsboijkhqr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-xsboijkhqr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-xsboijkhqr] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-xsboijkhqr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-xsboijkhqr] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-xsboijkhqr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-xsboijkhqr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-xsboijkhqr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-xsboijkhqr] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-xsboijkhqr] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-xsboijkhqr] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-xsboijkhqr] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-xsboijkhqr] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-xsboijkhqr] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-xsboijkhqr] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-xsboijkhqr] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-xsboijkhqr] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-xsboijkhqr] { display: block; }
.hide-on-cards[b-xsboijkhqr] { display: none !important; }
.show-on-cards[b-xsboijkhqr] { display: grid; }
.hide-on-grid[b-xsboijkhqr] { display: none !important; }

/* Badges */
.badge[b-xsboijkhqr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-xsboijkhqr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-xsboijkhqr] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-xsboijkhqr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-xsboijkhqr] { text-align: center; }
.text-muted[b-xsboijkhqr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-xsboijkhqr], .crud-empty-state[b-xsboijkhqr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-xsboijkhqr] { font-size: 2rem; }
.crud-spinner[b-xsboijkhqr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-xsboijkhqr 0.6s linear infinite; }
.crud-spinner-sm[b-xsboijkhqr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-xsboijkhqr 0.6s linear infinite; }
@keyframes spin-b-xsboijkhqr { to { transform: rotate(360deg); } }
.spin[b-xsboijkhqr] { animation: spin-b-xsboijkhqr 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-xsboijkhqr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-xsboijkhqr 0.15s ease-out; }
.modal-container[b-xsboijkhqr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-xsboijkhqr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-xsboijkhqr 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-xsboijkhqr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-xsboijkhqr] { max-width: 420px; }
@keyframes fadeIn-b-xsboijkhqr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-xsboijkhqr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-xsboijkhqr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-xsboijkhqr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-xsboijkhqr] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-xsboijkhqr] { color: #dc2626; }
.modal-close[b-xsboijkhqr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-xsboijkhqr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-xsboijkhqr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-xsboijkhqr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-xsboijkhqr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-xsboijkhqr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-xsboijkhqr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-xsboijkhqr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-xsboijkhqr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-xsboijkhqr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-xsboijkhqr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-xsboijkhqr] { flex: 2; }
.form-group label[b-xsboijkhqr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-xsboijkhqr], .form-group select[b-xsboijkhqr], .form-textarea[b-xsboijkhqr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-xsboijkhqr], .form-group select:focus[b-xsboijkhqr], .form-textarea:focus[b-xsboijkhqr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-xsboijkhqr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-xsboijkhqr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-xsboijkhqr] { flex: 1; display: flex; align-items: center; }
.form-check[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-xsboijkhqr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-xsboijkhqr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-xsboijkhqr] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-xsboijkhqr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-xsboijkhqr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-xsboijkhqr] { font-size: 3rem; }
.photo-placeholder span[b-xsboijkhqr] { font-size: 0.78rem; }
.photo-actions[b-xsboijkhqr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-xsboijkhqr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-xsboijkhqr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-xsboijkhqr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-xsboijkhqr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-xsboijkhqr] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-xsboijkhqr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-xsboijkhqr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-xsboijkhqr] { filter: brightness(1.15); transform: scale(1.05); }
[b-xsboijkhqr] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-xsboijkhqr] { padding: 0.75rem; }
    .crud-header[b-xsboijkhqr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-xsboijkhqr] { font-size: 1.1rem; }
    .btn-text[b-xsboijkhqr] { display: none; }
    .form-row[b-xsboijkhqr] { flex-direction: column; }
    .form-row-4[b-xsboijkhqr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-xsboijkhqr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-xsboijkhqr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-xsboijkhqr] { padding: 0.75rem; }
    .modal-tabs[b-xsboijkhqr] { overflow-x: auto; }
    .modal-tab[b-xsboijkhqr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-xsboijkhqr] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-xsboijkhqr] { display: grid !important; }
    .crud-cards-wrapper[b-xsboijkhqr] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-xsboijkhqr] { grid-template-columns: 1fr; }
    .card-details[b-xsboijkhqr] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-xsboijkhqr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-xsboijkhqr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-xsboijkhqr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-xsboijkhqr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmanuladocumento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-sb72eibmb6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-sb72eibmb6 0.3s ease-out; }
@keyframes slideUp-b-sb72eibmb6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-sb72eibmb6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-sb72eibmb6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-sb72eibmb6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-sb72eibmb6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-sb72eibmb6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-sb72eibmb6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-sb72eibmb6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-sb72eibmb6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-sb72eibmb6] { filter: brightness(1.1); }
.btn-outline[b-sb72eibmb6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-sb72eibmb6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-sb72eibmb6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-sb72eibmb6] { filter: brightness(1.1); }
.btn-icon[b-sb72eibmb6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-sb72eibmb6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-sb72eibmb6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-sb72eibmb6] { color: #ef4444; }
.btn-delete:hover[b-sb72eibmb6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-sb72eibmb6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-sb72eibmb6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-sb72eibmb6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-sb72eibmb6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-sb72eibmb6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-sb72eibmb6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-sb72eibmb6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-sb72eibmb6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-sb72eibmb6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-sb72eibmb6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-sb72eibmb6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-sb72eibmb6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-sb72eibmb6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-sb72eibmb6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-sb72eibmb6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-sb72eibmb6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-sb72eibmb6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-sb72eibmb6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-sb72eibmb6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-sb72eibmb6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-sb72eibmb6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-sb72eibmb6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-sb72eibmb6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-sb72eibmb6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-sb72eibmb6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-sb72eibmb6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-sb72eibmb6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-sb72eibmb6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-sb72eibmb6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-sb72eibmb6] { display: block; }
.hide-on-cards[b-sb72eibmb6] { display: none !important; }
.show-on-cards[b-sb72eibmb6] { display: grid; }
.hide-on-grid[b-sb72eibmb6] { display: none !important; }

/* Badges */
.badge[b-sb72eibmb6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-sb72eibmb6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-sb72eibmb6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-sb72eibmb6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-sb72eibmb6] { text-align: center; }
.text-muted[b-sb72eibmb6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-sb72eibmb6], .crud-empty-state[b-sb72eibmb6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-sb72eibmb6] { font-size: 2rem; }
.crud-spinner[b-sb72eibmb6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-sb72eibmb6 0.6s linear infinite; }
.crud-spinner-sm[b-sb72eibmb6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-sb72eibmb6 0.6s linear infinite; }
@keyframes spin-b-sb72eibmb6 { to { transform: rotate(360deg); } }
.spin[b-sb72eibmb6] { animation: spin-b-sb72eibmb6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-sb72eibmb6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-sb72eibmb6 0.15s ease-out; }
.modal-container[b-sb72eibmb6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-sb72eibmb6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-sb72eibmb6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-sb72eibmb6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-sb72eibmb6] { max-width: 420px; }
@keyframes fadeIn-b-sb72eibmb6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-sb72eibmb6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-sb72eibmb6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-sb72eibmb6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-sb72eibmb6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-sb72eibmb6] { color: #dc2626; }
.modal-close[b-sb72eibmb6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-sb72eibmb6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-sb72eibmb6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-sb72eibmb6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-sb72eibmb6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-sb72eibmb6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-sb72eibmb6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-sb72eibmb6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-sb72eibmb6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-sb72eibmb6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-sb72eibmb6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-sb72eibmb6] { flex: 2; }
.form-group label[b-sb72eibmb6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-sb72eibmb6], .form-group select[b-sb72eibmb6], .form-textarea[b-sb72eibmb6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-sb72eibmb6], .form-group select:focus[b-sb72eibmb6], .form-textarea:focus[b-sb72eibmb6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-sb72eibmb6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-sb72eibmb6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-sb72eibmb6] { flex: 1; display: flex; align-items: center; }
.form-check[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-sb72eibmb6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-sb72eibmb6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-sb72eibmb6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-sb72eibmb6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-sb72eibmb6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-sb72eibmb6] { font-size: 3rem; }
.photo-placeholder span[b-sb72eibmb6] { font-size: 0.78rem; }
.photo-actions[b-sb72eibmb6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-sb72eibmb6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-sb72eibmb6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-sb72eibmb6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-sb72eibmb6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-sb72eibmb6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-sb72eibmb6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-sb72eibmb6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-sb72eibmb6] { filter: brightness(1.15); transform: scale(1.05); }
[b-sb72eibmb6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-sb72eibmb6] { padding: 0.75rem; }
    .crud-header[b-sb72eibmb6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-sb72eibmb6] { font-size: 1.1rem; }
    .btn-text[b-sb72eibmb6] { display: none; }
    .form-row[b-sb72eibmb6] { flex-direction: column; }
    .form-row-4[b-sb72eibmb6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-sb72eibmb6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-sb72eibmb6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-sb72eibmb6] { padding: 0.75rem; }
    .modal-tabs[b-sb72eibmb6] { overflow-x: auto; }
    .modal-tab[b-sb72eibmb6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-sb72eibmb6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-sb72eibmb6] { display: grid !important; }
    .crud-cards-wrapper[b-sb72eibmb6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-sb72eibmb6] { grid-template-columns: 1fr; }
    .card-details[b-sb72eibmb6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-sb72eibmb6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-sb72eibmb6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-sb72eibmb6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-sb72eibmb6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmaplicaabonocapital.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h5y1wlddhc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h5y1wlddhc 0.3s ease-out; }
@keyframes slideUp-b-h5y1wlddhc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h5y1wlddhc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h5y1wlddhc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h5y1wlddhc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h5y1wlddhc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h5y1wlddhc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h5y1wlddhc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h5y1wlddhc] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h5y1wlddhc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h5y1wlddhc] { filter: brightness(1.1); }
.btn-outline[b-h5y1wlddhc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h5y1wlddhc] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h5y1wlddhc] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h5y1wlddhc] { filter: brightness(1.1); }
.btn-icon[b-h5y1wlddhc] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h5y1wlddhc] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h5y1wlddhc] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h5y1wlddhc] { color: #ef4444; }
.btn-delete:hover[b-h5y1wlddhc] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h5y1wlddhc] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h5y1wlddhc] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h5y1wlddhc] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h5y1wlddhc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h5y1wlddhc] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h5y1wlddhc] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h5y1wlddhc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h5y1wlddhc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h5y1wlddhc] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h5y1wlddhc] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h5y1wlddhc] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h5y1wlddhc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h5y1wlddhc] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h5y1wlddhc] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h5y1wlddhc] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h5y1wlddhc] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h5y1wlddhc] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h5y1wlddhc] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h5y1wlddhc] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h5y1wlddhc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h5y1wlddhc] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h5y1wlddhc] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h5y1wlddhc] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h5y1wlddhc] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h5y1wlddhc] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h5y1wlddhc] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h5y1wlddhc] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h5y1wlddhc] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h5y1wlddhc] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h5y1wlddhc] { display: block; }
.hide-on-cards[b-h5y1wlddhc] { display: none !important; }
.show-on-cards[b-h5y1wlddhc] { display: grid; }
.hide-on-grid[b-h5y1wlddhc] { display: none !important; }

/* Badges */
.badge[b-h5y1wlddhc] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h5y1wlddhc] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h5y1wlddhc] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h5y1wlddhc] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h5y1wlddhc] { text-align: center; }
.text-muted[b-h5y1wlddhc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h5y1wlddhc], .crud-empty-state[b-h5y1wlddhc] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h5y1wlddhc] { font-size: 2rem; }
.crud-spinner[b-h5y1wlddhc] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h5y1wlddhc 0.6s linear infinite; }
.crud-spinner-sm[b-h5y1wlddhc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h5y1wlddhc 0.6s linear infinite; }
@keyframes spin-b-h5y1wlddhc { to { transform: rotate(360deg); } }
.spin[b-h5y1wlddhc] { animation: spin-b-h5y1wlddhc 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h5y1wlddhc] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h5y1wlddhc 0.15s ease-out; }
.modal-container[b-h5y1wlddhc] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h5y1wlddhc] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h5y1wlddhc 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h5y1wlddhc] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h5y1wlddhc] { max-width: 420px; }
@keyframes fadeIn-b-h5y1wlddhc { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h5y1wlddhc { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h5y1wlddhc] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h5y1wlddhc] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h5y1wlddhc] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h5y1wlddhc] { color: #dc2626; }
.modal-close[b-h5y1wlddhc] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h5y1wlddhc] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h5y1wlddhc] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h5y1wlddhc] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h5y1wlddhc] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h5y1wlddhc] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h5y1wlddhc] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h5y1wlddhc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h5y1wlddhc] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h5y1wlddhc] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h5y1wlddhc] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h5y1wlddhc] { flex: 2; }
.form-group label[b-h5y1wlddhc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h5y1wlddhc], .form-group select[b-h5y1wlddhc], .form-textarea[b-h5y1wlddhc] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h5y1wlddhc], .form-group select:focus[b-h5y1wlddhc], .form-textarea:focus[b-h5y1wlddhc] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h5y1wlddhc] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h5y1wlddhc] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h5y1wlddhc] { flex: 1; display: flex; align-items: center; }
.form-check[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h5y1wlddhc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h5y1wlddhc] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h5y1wlddhc] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h5y1wlddhc] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h5y1wlddhc] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h5y1wlddhc] { font-size: 3rem; }
.photo-placeholder span[b-h5y1wlddhc] { font-size: 0.78rem; }
.photo-actions[b-h5y1wlddhc] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h5y1wlddhc] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h5y1wlddhc] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h5y1wlddhc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h5y1wlddhc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h5y1wlddhc] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h5y1wlddhc] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h5y1wlddhc] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h5y1wlddhc] { filter: brightness(1.15); transform: scale(1.05); }
[b-h5y1wlddhc] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h5y1wlddhc] { padding: 0.75rem; }
    .crud-header[b-h5y1wlddhc] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h5y1wlddhc] { font-size: 1.1rem; }
    .btn-text[b-h5y1wlddhc] { display: none; }
    .form-row[b-h5y1wlddhc] { flex-direction: column; }
    .form-row-4[b-h5y1wlddhc] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h5y1wlddhc] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h5y1wlddhc] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h5y1wlddhc] { padding: 0.75rem; }
    .modal-tabs[b-h5y1wlddhc] { overflow-x: auto; }
    .modal-tab[b-h5y1wlddhc] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h5y1wlddhc] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h5y1wlddhc] { display: grid !important; }
    .crud-cards-wrapper[b-h5y1wlddhc] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h5y1wlddhc] { grid-template-columns: 1fr; }
    .card-details[b-h5y1wlddhc] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h5y1wlddhc] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h5y1wlddhc] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h5y1wlddhc] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h5y1wlddhc] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmasignagarantiaprestamos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-djnv36rkpa] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-djnv36rkpa 0.3s ease-out; }
@keyframes slideUp-b-djnv36rkpa { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-djnv36rkpa] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-djnv36rkpa] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-djnv36rkpa] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-djnv36rkpa] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-djnv36rkpa] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-djnv36rkpa] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-djnv36rkpa] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-djnv36rkpa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-djnv36rkpa] { filter: brightness(1.1); }
.btn-outline[b-djnv36rkpa] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-djnv36rkpa] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-djnv36rkpa] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-djnv36rkpa] { filter: brightness(1.1); }
.btn-icon[b-djnv36rkpa] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-djnv36rkpa] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-djnv36rkpa] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-djnv36rkpa] { color: #ef4444; }
.btn-delete:hover[b-djnv36rkpa] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-djnv36rkpa] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-djnv36rkpa] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-djnv36rkpa] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-djnv36rkpa] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-djnv36rkpa] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-djnv36rkpa] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-djnv36rkpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-djnv36rkpa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-djnv36rkpa] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-djnv36rkpa] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-djnv36rkpa] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-djnv36rkpa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-djnv36rkpa] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-djnv36rkpa] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-djnv36rkpa] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-djnv36rkpa] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-djnv36rkpa] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-djnv36rkpa] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-djnv36rkpa] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-djnv36rkpa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-djnv36rkpa] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-djnv36rkpa] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-djnv36rkpa] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-djnv36rkpa] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-djnv36rkpa] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-djnv36rkpa] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-djnv36rkpa] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-djnv36rkpa] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-djnv36rkpa] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-djnv36rkpa] { display: block; }
.hide-on-cards[b-djnv36rkpa] { display: none !important; }
.show-on-cards[b-djnv36rkpa] { display: grid; }
.hide-on-grid[b-djnv36rkpa] { display: none !important; }

/* Badges */
.badge[b-djnv36rkpa] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-djnv36rkpa] { background: #ecfdf5; color: #065f46; }
.badge-no[b-djnv36rkpa] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-djnv36rkpa] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-djnv36rkpa] { text-align: center; }
.text-muted[b-djnv36rkpa] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-djnv36rkpa], .crud-empty-state[b-djnv36rkpa] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-djnv36rkpa] { font-size: 2rem; }
.crud-spinner[b-djnv36rkpa] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-djnv36rkpa 0.6s linear infinite; }
.crud-spinner-sm[b-djnv36rkpa] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-djnv36rkpa 0.6s linear infinite; }
@keyframes spin-b-djnv36rkpa { to { transform: rotate(360deg); } }
.spin[b-djnv36rkpa] { animation: spin-b-djnv36rkpa 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-djnv36rkpa] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-djnv36rkpa 0.15s ease-out; }
.modal-container[b-djnv36rkpa] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-djnv36rkpa] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-djnv36rkpa 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-djnv36rkpa] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-djnv36rkpa] { max-width: 420px; }
@keyframes fadeIn-b-djnv36rkpa { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-djnv36rkpa { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-djnv36rkpa] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-djnv36rkpa] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-djnv36rkpa] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-djnv36rkpa] { color: #dc2626; }
.modal-close[b-djnv36rkpa] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-djnv36rkpa] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-djnv36rkpa] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-djnv36rkpa] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-djnv36rkpa] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-djnv36rkpa] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-djnv36rkpa] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-djnv36rkpa] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-djnv36rkpa] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-djnv36rkpa] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-djnv36rkpa] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-djnv36rkpa] { flex: 2; }
.form-group label[b-djnv36rkpa] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-djnv36rkpa], .form-group select[b-djnv36rkpa], .form-textarea[b-djnv36rkpa] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-djnv36rkpa], .form-group select:focus[b-djnv36rkpa], .form-textarea:focus[b-djnv36rkpa] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-djnv36rkpa] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-djnv36rkpa] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-djnv36rkpa] { flex: 1; display: flex; align-items: center; }
.form-check[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-djnv36rkpa] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-djnv36rkpa] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-djnv36rkpa] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-djnv36rkpa] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-djnv36rkpa] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-djnv36rkpa] { font-size: 3rem; }
.photo-placeholder span[b-djnv36rkpa] { font-size: 0.78rem; }
.photo-actions[b-djnv36rkpa] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-djnv36rkpa] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-djnv36rkpa] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-djnv36rkpa] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-djnv36rkpa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-djnv36rkpa] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-djnv36rkpa] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-djnv36rkpa] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-djnv36rkpa] { filter: brightness(1.15); transform: scale(1.05); }
[b-djnv36rkpa] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-djnv36rkpa] { padding: 0.75rem; }
    .crud-header[b-djnv36rkpa] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-djnv36rkpa] { font-size: 1.1rem; }
    .btn-text[b-djnv36rkpa] { display: none; }
    .form-row[b-djnv36rkpa] { flex-direction: column; }
    .form-row-4[b-djnv36rkpa] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-djnv36rkpa] { width: 98%; max-height: 95vh; }
    .modal-lg[b-djnv36rkpa] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-djnv36rkpa] { padding: 0.75rem; }
    .modal-tabs[b-djnv36rkpa] { overflow-x: auto; }
    .modal-tab[b-djnv36rkpa] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-djnv36rkpa] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-djnv36rkpa] { display: grid !important; }
    .crud-cards-wrapper[b-djnv36rkpa] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-djnv36rkpa] { grid-template-columns: 1fr; }
    .card-details[b-djnv36rkpa] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-djnv36rkpa] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-djnv36rkpa] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-djnv36rkpa] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-djnv36rkpa] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmcobrorealizados.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ubzingawqk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ubzingawqk 0.3s ease-out; }
@keyframes slideUp-b-ubzingawqk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ubzingawqk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ubzingawqk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ubzingawqk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ubzingawqk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ubzingawqk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ubzingawqk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ubzingawqk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ubzingawqk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ubzingawqk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ubzingawqk] { filter: brightness(1.1); }
.btn-outline[b-ubzingawqk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ubzingawqk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ubzingawqk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ubzingawqk] { filter: brightness(1.1); }
.btn-icon[b-ubzingawqk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ubzingawqk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ubzingawqk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ubzingawqk] { color: #ef4444; }
.btn-delete:hover[b-ubzingawqk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ubzingawqk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ubzingawqk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ubzingawqk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ubzingawqk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ubzingawqk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ubzingawqk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ubzingawqk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ubzingawqk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ubzingawqk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ubzingawqk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ubzingawqk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ubzingawqk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ubzingawqk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ubzingawqk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ubzingawqk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ubzingawqk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ubzingawqk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ubzingawqk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ubzingawqk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ubzingawqk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ubzingawqk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ubzingawqk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ubzingawqk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ubzingawqk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ubzingawqk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ubzingawqk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ubzingawqk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ubzingawqk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ubzingawqk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ubzingawqk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ubzingawqk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ubzingawqk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ubzingawqk] { display: block; }
.hide-on-cards[b-ubzingawqk] { display: none !important; }
.show-on-cards[b-ubzingawqk] { display: grid; }
.hide-on-grid[b-ubzingawqk] { display: none !important; }

/* Badges */
.badge[b-ubzingawqk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ubzingawqk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ubzingawqk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ubzingawqk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ubzingawqk] { text-align: center; }
.text-muted[b-ubzingawqk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ubzingawqk], .crud-empty-state[b-ubzingawqk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ubzingawqk] { font-size: 2rem; }
.crud-spinner[b-ubzingawqk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ubzingawqk 0.6s linear infinite; }
.crud-spinner-sm[b-ubzingawqk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ubzingawqk 0.6s linear infinite; }
@keyframes spin-b-ubzingawqk { to { transform: rotate(360deg); } }
.spin[b-ubzingawqk] { animation: spin-b-ubzingawqk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ubzingawqk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ubzingawqk 0.15s ease-out; }
.modal-container[b-ubzingawqk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ubzingawqk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ubzingawqk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ubzingawqk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ubzingawqk] { max-width: 420px; }
@keyframes fadeIn-b-ubzingawqk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ubzingawqk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ubzingawqk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ubzingawqk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ubzingawqk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ubzingawqk] { color: #dc2626; }
.modal-close[b-ubzingawqk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ubzingawqk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ubzingawqk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ubzingawqk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ubzingawqk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ubzingawqk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ubzingawqk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ubzingawqk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ubzingawqk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ubzingawqk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ubzingawqk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ubzingawqk] { flex: 2; }
.form-group label[b-ubzingawqk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ubzingawqk], .form-group select[b-ubzingawqk], .form-textarea[b-ubzingawqk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ubzingawqk], .form-group select:focus[b-ubzingawqk], .form-textarea:focus[b-ubzingawqk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ubzingawqk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ubzingawqk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ubzingawqk] { flex: 1; display: flex; align-items: center; }
.form-check[b-ubzingawqk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ubzingawqk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ubzingawqk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ubzingawqk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ubzingawqk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ubzingawqk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ubzingawqk] { font-size: 3rem; }
.photo-placeholder span[b-ubzingawqk] { font-size: 0.78rem; }
.photo-actions[b-ubzingawqk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ubzingawqk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ubzingawqk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ubzingawqk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ubzingawqk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ubzingawqk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ubzingawqk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ubzingawqk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ubzingawqk] { filter: brightness(1.15); transform: scale(1.05); }
[b-ubzingawqk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ubzingawqk] { padding: 0.75rem; }
    .crud-header[b-ubzingawqk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ubzingawqk] { font-size: 1.1rem; }
    .btn-text[b-ubzingawqk] { display: none; }
    .form-row[b-ubzingawqk] { flex-direction: column; }
    .form-row-4[b-ubzingawqk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ubzingawqk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ubzingawqk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ubzingawqk] { padding: 0.75rem; }
    .modal-tabs[b-ubzingawqk] { overflow-x: auto; }
    .modal-tab[b-ubzingawqk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ubzingawqk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ubzingawqk] { display: grid !important; }
    .crud-cards-wrapper[b-ubzingawqk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ubzingawqk] { grid-template-columns: 1fr; }
    .card-details[b-ubzingawqk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ubzingawqk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ubzingawqk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ubzingawqk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ubzingawqk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmcobrosv2.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2m6puyfnnl] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2m6puyfnnl 0.3s ease-out; }
@keyframes slideUp-b-2m6puyfnnl { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2m6puyfnnl] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2m6puyfnnl] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2m6puyfnnl] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2m6puyfnnl] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2m6puyfnnl] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2m6puyfnnl] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2m6puyfnnl] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2m6puyfnnl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2m6puyfnnl] { filter: brightness(1.1); }
.btn-outline[b-2m6puyfnnl] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2m6puyfnnl] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2m6puyfnnl] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2m6puyfnnl] { filter: brightness(1.1); }
.btn-icon[b-2m6puyfnnl] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2m6puyfnnl] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2m6puyfnnl] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2m6puyfnnl] { color: #ef4444; }
.btn-delete:hover[b-2m6puyfnnl] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2m6puyfnnl] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2m6puyfnnl] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2m6puyfnnl] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2m6puyfnnl] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2m6puyfnnl] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2m6puyfnnl] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2m6puyfnnl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2m6puyfnnl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2m6puyfnnl] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2m6puyfnnl] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2m6puyfnnl] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2m6puyfnnl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2m6puyfnnl] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2m6puyfnnl] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2m6puyfnnl] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2m6puyfnnl] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2m6puyfnnl] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2m6puyfnnl] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2m6puyfnnl] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2m6puyfnnl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2m6puyfnnl] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2m6puyfnnl] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2m6puyfnnl] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2m6puyfnnl] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2m6puyfnnl] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2m6puyfnnl] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2m6puyfnnl] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2m6puyfnnl] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2m6puyfnnl] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2m6puyfnnl] { display: block; }
.hide-on-cards[b-2m6puyfnnl] { display: none !important; }
.show-on-cards[b-2m6puyfnnl] { display: grid; }
.hide-on-grid[b-2m6puyfnnl] { display: none !important; }

/* Badges */
.badge[b-2m6puyfnnl] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2m6puyfnnl] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2m6puyfnnl] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2m6puyfnnl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2m6puyfnnl] { text-align: center; }
.text-muted[b-2m6puyfnnl] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2m6puyfnnl], .crud-empty-state[b-2m6puyfnnl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2m6puyfnnl] { font-size: 2rem; }
.crud-spinner[b-2m6puyfnnl] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2m6puyfnnl 0.6s linear infinite; }
.crud-spinner-sm[b-2m6puyfnnl] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2m6puyfnnl 0.6s linear infinite; }
@keyframes spin-b-2m6puyfnnl { to { transform: rotate(360deg); } }
.spin[b-2m6puyfnnl] { animation: spin-b-2m6puyfnnl 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2m6puyfnnl] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2m6puyfnnl 0.15s ease-out; }
.modal-container[b-2m6puyfnnl] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2m6puyfnnl] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2m6puyfnnl 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2m6puyfnnl] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2m6puyfnnl] { max-width: 420px; }
@keyframes fadeIn-b-2m6puyfnnl { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2m6puyfnnl { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2m6puyfnnl] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2m6puyfnnl] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2m6puyfnnl] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2m6puyfnnl] { color: #dc2626; }
.modal-close[b-2m6puyfnnl] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2m6puyfnnl] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2m6puyfnnl] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2m6puyfnnl] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2m6puyfnnl] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2m6puyfnnl] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2m6puyfnnl] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2m6puyfnnl] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2m6puyfnnl] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2m6puyfnnl] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2m6puyfnnl] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2m6puyfnnl] { flex: 2; }
.form-group label[b-2m6puyfnnl] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2m6puyfnnl], .form-group select[b-2m6puyfnnl], .form-textarea[b-2m6puyfnnl] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2m6puyfnnl], .form-group select:focus[b-2m6puyfnnl], .form-textarea:focus[b-2m6puyfnnl] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2m6puyfnnl] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2m6puyfnnl] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2m6puyfnnl] { flex: 1; display: flex; align-items: center; }
.form-check[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2m6puyfnnl] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2m6puyfnnl] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2m6puyfnnl] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2m6puyfnnl] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2m6puyfnnl] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2m6puyfnnl] { font-size: 3rem; }
.photo-placeholder span[b-2m6puyfnnl] { font-size: 0.78rem; }
.photo-actions[b-2m6puyfnnl] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2m6puyfnnl] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2m6puyfnnl] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2m6puyfnnl] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2m6puyfnnl] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2m6puyfnnl] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2m6puyfnnl] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2m6puyfnnl] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2m6puyfnnl] { filter: brightness(1.15); transform: scale(1.05); }
[b-2m6puyfnnl] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2m6puyfnnl] { padding: 0.75rem; }
    .crud-header[b-2m6puyfnnl] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2m6puyfnnl] { font-size: 1.1rem; }
    .btn-text[b-2m6puyfnnl] { display: none; }
    .form-row[b-2m6puyfnnl] { flex-direction: column; }
    .form-row-4[b-2m6puyfnnl] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2m6puyfnnl] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2m6puyfnnl] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2m6puyfnnl] { padding: 0.75rem; }
    .modal-tabs[b-2m6puyfnnl] { overflow-x: auto; }
    .modal-tab[b-2m6puyfnnl] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2m6puyfnnl] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2m6puyfnnl] { display: grid !important; }
    .crud-cards-wrapper[b-2m6puyfnnl] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2m6puyfnnl] { grid-template-columns: 1fr; }
    .card-details[b-2m6puyfnnl] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2m6puyfnnl] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2m6puyfnnl] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2m6puyfnnl] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2m6puyfnnl] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmcreacargos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-pzybs2xare] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pzybs2xare 0.3s ease-out; }
@keyframes slideUp-b-pzybs2xare { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pzybs2xare] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pzybs2xare] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pzybs2xare] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pzybs2xare] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pzybs2xare] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pzybs2xare] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pzybs2xare] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pzybs2xare] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pzybs2xare] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pzybs2xare] { filter: brightness(1.1); }
.btn-outline[b-pzybs2xare] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pzybs2xare] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pzybs2xare] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pzybs2xare] { filter: brightness(1.1); }
.btn-icon[b-pzybs2xare] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pzybs2xare] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pzybs2xare] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pzybs2xare] { color: #ef4444; }
.btn-delete:hover[b-pzybs2xare] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-pzybs2xare] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pzybs2xare] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pzybs2xare] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pzybs2xare] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pzybs2xare] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pzybs2xare] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pzybs2xare] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pzybs2xare] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-pzybs2xare] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pzybs2xare] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-pzybs2xare] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pzybs2xare] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pzybs2xare] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pzybs2xare] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pzybs2xare] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pzybs2xare] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pzybs2xare] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-pzybs2xare] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-pzybs2xare] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-pzybs2xare] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-pzybs2xare] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-pzybs2xare] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-pzybs2xare] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-pzybs2xare] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-pzybs2xare] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-pzybs2xare] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-pzybs2xare] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-pzybs2xare] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-pzybs2xare] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-pzybs2xare] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-pzybs2xare] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-pzybs2xare] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-pzybs2xare] { display: block; }
.hide-on-cards[b-pzybs2xare] { display: none !important; }
.show-on-cards[b-pzybs2xare] { display: grid; }
.hide-on-grid[b-pzybs2xare] { display: none !important; }

/* Badges */
.badge[b-pzybs2xare] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pzybs2xare] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pzybs2xare] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-pzybs2xare] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pzybs2xare] { text-align: center; }
.text-muted[b-pzybs2xare] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pzybs2xare], .crud-empty-state[b-pzybs2xare] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pzybs2xare] { font-size: 2rem; }
.crud-spinner[b-pzybs2xare] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pzybs2xare 0.6s linear infinite; }
.crud-spinner-sm[b-pzybs2xare] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pzybs2xare 0.6s linear infinite; }
@keyframes spin-b-pzybs2xare { to { transform: rotate(360deg); } }
.spin[b-pzybs2xare] { animation: spin-b-pzybs2xare 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-pzybs2xare] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pzybs2xare 0.15s ease-out; }
.modal-container[b-pzybs2xare] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pzybs2xare] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pzybs2xare 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-pzybs2xare] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-pzybs2xare] { max-width: 420px; }
@keyframes fadeIn-b-pzybs2xare { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pzybs2xare { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pzybs2xare] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pzybs2xare] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-pzybs2xare] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-pzybs2xare] { color: #dc2626; }
.modal-close[b-pzybs2xare] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pzybs2xare] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pzybs2xare] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pzybs2xare] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pzybs2xare] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-pzybs2xare] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pzybs2xare] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pzybs2xare] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pzybs2xare] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pzybs2xare] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pzybs2xare] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pzybs2xare] { flex: 2; }
.form-group label[b-pzybs2xare] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pzybs2xare], .form-group select[b-pzybs2xare], .form-textarea[b-pzybs2xare] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pzybs2xare], .form-group select:focus[b-pzybs2xare], .form-textarea:focus[b-pzybs2xare] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pzybs2xare] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pzybs2xare] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pzybs2xare] { flex: 1; display: flex; align-items: center; }
.form-check[b-pzybs2xare] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pzybs2xare] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-pzybs2xare] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-pzybs2xare] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-pzybs2xare] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-pzybs2xare] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-pzybs2xare] { font-size: 3rem; }
.photo-placeholder span[b-pzybs2xare] { font-size: 0.78rem; }
.photo-actions[b-pzybs2xare] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-pzybs2xare] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-pzybs2xare] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-pzybs2xare] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-pzybs2xare] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-pzybs2xare] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-pzybs2xare] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-pzybs2xare] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-pzybs2xare] { filter: brightness(1.15); transform: scale(1.05); }
[b-pzybs2xare] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pzybs2xare] { padding: 0.75rem; }
    .crud-header[b-pzybs2xare] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pzybs2xare] { font-size: 1.1rem; }
    .btn-text[b-pzybs2xare] { display: none; }
    .form-row[b-pzybs2xare] { flex-direction: column; }
    .form-row-4[b-pzybs2xare] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pzybs2xare] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pzybs2xare] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-pzybs2xare] { padding: 0.75rem; }
    .modal-tabs[b-pzybs2xare] { overflow-x: auto; }
    .modal-tab[b-pzybs2xare] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-pzybs2xare] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-pzybs2xare] { display: grid !important; }
    .crud-cards-wrapper[b-pzybs2xare] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-pzybs2xare] { grid-template-columns: 1fr; }
    .card-details[b-pzybs2xare] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-pzybs2xare] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pzybs2xare] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pzybs2xare] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pzybs2xare] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmcutasvencidasypendientes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-020xqbscsx] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-020xqbscsx 0.3s ease-out; }
@keyframes slideUp-b-020xqbscsx { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-020xqbscsx] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-020xqbscsx] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-020xqbscsx] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-020xqbscsx] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-020xqbscsx] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-020xqbscsx] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-020xqbscsx] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-020xqbscsx] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-020xqbscsx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-020xqbscsx] { filter: brightness(1.1); }
.btn-outline[b-020xqbscsx] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-020xqbscsx] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-020xqbscsx] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-020xqbscsx] { filter: brightness(1.1); }
.btn-icon[b-020xqbscsx] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-020xqbscsx] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-020xqbscsx] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-020xqbscsx] { color: #ef4444; }
.btn-delete:hover[b-020xqbscsx] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-020xqbscsx] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-020xqbscsx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-020xqbscsx] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-020xqbscsx] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-020xqbscsx] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-020xqbscsx] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-020xqbscsx] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-020xqbscsx] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-020xqbscsx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-020xqbscsx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-020xqbscsx] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-020xqbscsx] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-020xqbscsx] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-020xqbscsx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-020xqbscsx] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-020xqbscsx] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-020xqbscsx] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-020xqbscsx] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-020xqbscsx] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-020xqbscsx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-020xqbscsx] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-020xqbscsx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-020xqbscsx] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-020xqbscsx] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-020xqbscsx] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-020xqbscsx] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-020xqbscsx] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-020xqbscsx] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-020xqbscsx] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-020xqbscsx] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-020xqbscsx] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-020xqbscsx] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-020xqbscsx] { display: block; }
.hide-on-cards[b-020xqbscsx] { display: none !important; }
.show-on-cards[b-020xqbscsx] { display: grid; }
.hide-on-grid[b-020xqbscsx] { display: none !important; }

/* Badges */
.badge[b-020xqbscsx] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-020xqbscsx] { background: #ecfdf5; color: #065f46; }
.badge-no[b-020xqbscsx] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-020xqbscsx] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-020xqbscsx] { text-align: center; }
.text-muted[b-020xqbscsx] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-020xqbscsx], .crud-empty-state[b-020xqbscsx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-020xqbscsx] { font-size: 2rem; }
.crud-spinner[b-020xqbscsx] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-020xqbscsx 0.6s linear infinite; }
.crud-spinner-sm[b-020xqbscsx] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-020xqbscsx 0.6s linear infinite; }
@keyframes spin-b-020xqbscsx { to { transform: rotate(360deg); } }
.spin[b-020xqbscsx] { animation: spin-b-020xqbscsx 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-020xqbscsx] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-020xqbscsx 0.15s ease-out; }
.modal-container[b-020xqbscsx] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-020xqbscsx] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-020xqbscsx 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-020xqbscsx] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-020xqbscsx] { max-width: 420px; }
@keyframes fadeIn-b-020xqbscsx { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-020xqbscsx { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-020xqbscsx] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-020xqbscsx] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-020xqbscsx] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-020xqbscsx] { color: #dc2626; }
.modal-close[b-020xqbscsx] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-020xqbscsx] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-020xqbscsx] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-020xqbscsx] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-020xqbscsx] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-020xqbscsx] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-020xqbscsx] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-020xqbscsx] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-020xqbscsx] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-020xqbscsx] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-020xqbscsx] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-020xqbscsx] { flex: 2; }
.form-group label[b-020xqbscsx] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-020xqbscsx], .form-group select[b-020xqbscsx], .form-textarea[b-020xqbscsx] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-020xqbscsx], .form-group select:focus[b-020xqbscsx], .form-textarea:focus[b-020xqbscsx] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-020xqbscsx] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-020xqbscsx] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-020xqbscsx] { flex: 1; display: flex; align-items: center; }
.form-check[b-020xqbscsx] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-020xqbscsx] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-020xqbscsx] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-020xqbscsx] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-020xqbscsx] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-020xqbscsx] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-020xqbscsx] { font-size: 3rem; }
.photo-placeholder span[b-020xqbscsx] { font-size: 0.78rem; }
.photo-actions[b-020xqbscsx] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-020xqbscsx] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-020xqbscsx] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-020xqbscsx] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-020xqbscsx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-020xqbscsx] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-020xqbscsx] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-020xqbscsx] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-020xqbscsx] { filter: brightness(1.15); transform: scale(1.05); }
[b-020xqbscsx] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-020xqbscsx] { padding: 0.75rem; }
    .crud-header[b-020xqbscsx] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-020xqbscsx] { font-size: 1.1rem; }
    .btn-text[b-020xqbscsx] { display: none; }
    .form-row[b-020xqbscsx] { flex-direction: column; }
    .form-row-4[b-020xqbscsx] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-020xqbscsx] { width: 98%; max-height: 95vh; }
    .modal-lg[b-020xqbscsx] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-020xqbscsx] { padding: 0.75rem; }
    .modal-tabs[b-020xqbscsx] { overflow-x: auto; }
    .modal-tab[b-020xqbscsx] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-020xqbscsx] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-020xqbscsx] { display: grid !important; }
    .crud-cards-wrapper[b-020xqbscsx] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-020xqbscsx] { grid-template-columns: 1fr; }
    .card-details[b-020xqbscsx] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-020xqbscsx] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-020xqbscsx] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-020xqbscsx] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-020xqbscsx] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmdesembolsoprestamo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zdoh07trq6] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zdoh07trq6 0.3s ease-out; }
@keyframes slideUp-b-zdoh07trq6 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zdoh07trq6] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zdoh07trq6] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zdoh07trq6] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zdoh07trq6] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zdoh07trq6] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zdoh07trq6] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zdoh07trq6] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zdoh07trq6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zdoh07trq6] { filter: brightness(1.1); }
.btn-outline[b-zdoh07trq6] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zdoh07trq6] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zdoh07trq6] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zdoh07trq6] { filter: brightness(1.1); }
.btn-icon[b-zdoh07trq6] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zdoh07trq6] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zdoh07trq6] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zdoh07trq6] { color: #ef4444; }
.btn-delete:hover[b-zdoh07trq6] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zdoh07trq6] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zdoh07trq6] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zdoh07trq6] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zdoh07trq6] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zdoh07trq6] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zdoh07trq6] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zdoh07trq6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zdoh07trq6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zdoh07trq6] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zdoh07trq6] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zdoh07trq6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zdoh07trq6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zdoh07trq6] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zdoh07trq6] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zdoh07trq6] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zdoh07trq6] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zdoh07trq6] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zdoh07trq6] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zdoh07trq6] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zdoh07trq6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zdoh07trq6] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zdoh07trq6] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zdoh07trq6] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zdoh07trq6] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zdoh07trq6] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zdoh07trq6] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zdoh07trq6] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zdoh07trq6] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zdoh07trq6] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zdoh07trq6] { display: block; }
.hide-on-cards[b-zdoh07trq6] { display: none !important; }
.show-on-cards[b-zdoh07trq6] { display: grid; }
.hide-on-grid[b-zdoh07trq6] { display: none !important; }

/* Badges */
.badge[b-zdoh07trq6] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zdoh07trq6] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zdoh07trq6] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zdoh07trq6] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zdoh07trq6] { text-align: center; }
.text-muted[b-zdoh07trq6] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zdoh07trq6], .crud-empty-state[b-zdoh07trq6] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zdoh07trq6] { font-size: 2rem; }
.crud-spinner[b-zdoh07trq6] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zdoh07trq6 0.6s linear infinite; }
.crud-spinner-sm[b-zdoh07trq6] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zdoh07trq6 0.6s linear infinite; }
@keyframes spin-b-zdoh07trq6 { to { transform: rotate(360deg); } }
.spin[b-zdoh07trq6] { animation: spin-b-zdoh07trq6 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zdoh07trq6] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zdoh07trq6 0.15s ease-out; }
.modal-container[b-zdoh07trq6] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zdoh07trq6] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zdoh07trq6 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zdoh07trq6] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zdoh07trq6] { max-width: 420px; }
@keyframes fadeIn-b-zdoh07trq6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zdoh07trq6 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zdoh07trq6] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zdoh07trq6] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zdoh07trq6] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zdoh07trq6] { color: #dc2626; }
.modal-close[b-zdoh07trq6] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zdoh07trq6] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zdoh07trq6] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zdoh07trq6] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zdoh07trq6] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zdoh07trq6] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zdoh07trq6] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zdoh07trq6] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zdoh07trq6] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zdoh07trq6] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zdoh07trq6] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zdoh07trq6] { flex: 2; }
.form-group label[b-zdoh07trq6] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zdoh07trq6], .form-group select[b-zdoh07trq6], .form-textarea[b-zdoh07trq6] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zdoh07trq6], .form-group select:focus[b-zdoh07trq6], .form-textarea:focus[b-zdoh07trq6] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zdoh07trq6] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zdoh07trq6] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zdoh07trq6] { flex: 1; display: flex; align-items: center; }
.form-check[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zdoh07trq6] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zdoh07trq6] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zdoh07trq6] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zdoh07trq6] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zdoh07trq6] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zdoh07trq6] { font-size: 3rem; }
.photo-placeholder span[b-zdoh07trq6] { font-size: 0.78rem; }
.photo-actions[b-zdoh07trq6] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zdoh07trq6] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zdoh07trq6] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zdoh07trq6] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zdoh07trq6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zdoh07trq6] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zdoh07trq6] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zdoh07trq6] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zdoh07trq6] { filter: brightness(1.15); transform: scale(1.05); }
[b-zdoh07trq6] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zdoh07trq6] { padding: 0.75rem; }
    .crud-header[b-zdoh07trq6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zdoh07trq6] { font-size: 1.1rem; }
    .btn-text[b-zdoh07trq6] { display: none; }
    .form-row[b-zdoh07trq6] { flex-direction: column; }
    .form-row-4[b-zdoh07trq6] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zdoh07trq6] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zdoh07trq6] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zdoh07trq6] { padding: 0.75rem; }
    .modal-tabs[b-zdoh07trq6] { overflow-x: auto; }
    .modal-tab[b-zdoh07trq6] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zdoh07trq6] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zdoh07trq6] { display: grid !important; }
    .crud-cards-wrapper[b-zdoh07trq6] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zdoh07trq6] { grid-template-columns: 1fr; }
    .card-details[b-zdoh07trq6] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zdoh07trq6] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zdoh07trq6] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zdoh07trq6] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zdoh07trq6] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmdevengo_config.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fie687s359] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fie687s359 0.3s ease-out; }
@keyframes slideUp-b-fie687s359 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fie687s359] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fie687s359] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fie687s359] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fie687s359] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fie687s359] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fie687s359] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fie687s359] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fie687s359] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fie687s359] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fie687s359] { filter: brightness(1.1); }
.btn-outline[b-fie687s359] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fie687s359] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fie687s359] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fie687s359] { filter: brightness(1.1); }
.btn-icon[b-fie687s359] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fie687s359] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fie687s359] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fie687s359] { color: #ef4444; }
.btn-delete:hover[b-fie687s359] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fie687s359] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fie687s359] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fie687s359] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fie687s359] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fie687s359] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fie687s359] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fie687s359] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fie687s359] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fie687s359] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fie687s359] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fie687s359] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fie687s359] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fie687s359] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fie687s359] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fie687s359] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fie687s359] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fie687s359] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fie687s359] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fie687s359] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fie687s359] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fie687s359] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fie687s359] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fie687s359] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fie687s359] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fie687s359] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fie687s359] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fie687s359] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fie687s359] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fie687s359] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fie687s359] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fie687s359] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fie687s359] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fie687s359] { display: block; }
.hide-on-cards[b-fie687s359] { display: none !important; }
.show-on-cards[b-fie687s359] { display: grid; }
.hide-on-grid[b-fie687s359] { display: none !important; }

/* Badges */
.badge[b-fie687s359] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fie687s359] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fie687s359] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fie687s359] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fie687s359] { text-align: center; }
.text-muted[b-fie687s359] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fie687s359], .crud-empty-state[b-fie687s359] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fie687s359] { font-size: 2rem; }
.crud-spinner[b-fie687s359] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fie687s359 0.6s linear infinite; }
.crud-spinner-sm[b-fie687s359] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fie687s359 0.6s linear infinite; }
@keyframes spin-b-fie687s359 { to { transform: rotate(360deg); } }
.spin[b-fie687s359] { animation: spin-b-fie687s359 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fie687s359] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fie687s359 0.15s ease-out; }
.modal-container[b-fie687s359] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fie687s359] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fie687s359 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-fie687s359] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fie687s359] { max-width: 420px; }
@keyframes fadeIn-b-fie687s359 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fie687s359 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fie687s359] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fie687s359] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fie687s359] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fie687s359] { color: #dc2626; }
.modal-close[b-fie687s359] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fie687s359] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fie687s359] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fie687s359] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fie687s359] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fie687s359] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fie687s359] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fie687s359] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fie687s359] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fie687s359] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fie687s359] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fie687s359] { flex: 2; }
.form-group label[b-fie687s359] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fie687s359], .form-group select[b-fie687s359], .form-textarea[b-fie687s359] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fie687s359], .form-group select:focus[b-fie687s359], .form-textarea:focus[b-fie687s359] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fie687s359] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fie687s359] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fie687s359] { flex: 1; display: flex; align-items: center; }
.form-check[b-fie687s359] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fie687s359] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fie687s359] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fie687s359] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fie687s359] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fie687s359] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fie687s359] { font-size: 3rem; }
.photo-placeholder span[b-fie687s359] { font-size: 0.78rem; }
.photo-actions[b-fie687s359] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fie687s359] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-fie687s359] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fie687s359] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fie687s359] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fie687s359] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fie687s359] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fie687s359] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fie687s359] { filter: brightness(1.15); transform: scale(1.05); }
[b-fie687s359] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fie687s359] { padding: 0.75rem; }
    .crud-header[b-fie687s359] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fie687s359] { font-size: 1.1rem; }
    .btn-text[b-fie687s359] { display: none; }
    .form-row[b-fie687s359] { flex-direction: column; }
    .form-row-4[b-fie687s359] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fie687s359] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fie687s359] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fie687s359] { padding: 0.75rem; }
    .modal-tabs[b-fie687s359] { overflow-x: auto; }
    .modal-tab[b-fie687s359] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fie687s359] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fie687s359] { display: grid !important; }
    .crud-cards-wrapper[b-fie687s359] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fie687s359] { grid-template-columns: 1fr; }
    .card-details[b-fie687s359] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-fie687s359] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fie687s359] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fie687s359] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fie687s359] { background:rgba(37,99,235,.25); }

/* ── Extras Farmacia ── */
.far-avatar[b-fie687s359] { width: 30px; height: 30px; border-radius: 0.45rem; display: flex; align-items: center; justify-content: center; background: rgba(13,148,136,0.14); color: #0d9488; }
[data-mode="dark"] .far-avatar[b-fie687s359] { background: rgba(13,148,136,0.2); color: #5eead4; }
.form-grow[b-fie687s359] { flex: 1.6; }
.far-switch[b-fie687s359] { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; font-size: 0.85rem; color: var(--rg-text-primary); padding-top: 0.35rem; }
.far-switch input[b-fie687s359] { width: 1.05rem; height: 1.05rem; accent-color: var(--rg-primary); }

/* ── Extras Farmacia (compartidos) ── */
.far-section-title[b-fie687s359] { display:flex; align-items:center; gap:.45rem; font-size:.82rem; font-weight:700; color:var(--rg-primary); text-transform:uppercase; letter-spacing:.03em; margin:1rem 0 .5rem; padding-bottom:.3rem; border-bottom:1px solid var(--rg-border); }
.far-section-title:first-child[b-fie687s359] { margin-top:0; }
[data-mode="dark"] .far-section-title[b-fie687s359] { color:#93c5fd; }
.far-cold[b-fie687s359] { background:rgba(56,189,248,0.16) !important; color:#0284c7 !important; }
[data-mode="dark"] .far-cold[b-fie687s359] { color:#7dd3fc !important; }
.badge-warn[b-fie687s359] { background:rgba(217,119,6,0.14); color:#92400e; }
[data-mode="dark"] .badge-warn[b-fie687s359] { color:#fcd34d; }
.badge-func[b-fie687s359] { background:rgba(99,102,241,0.14); color:#4338ca; }
[data-mode="dark"] .badge-func[b-fie687s359] { color:#a5b4fc; }
.far-row-venc td[b-fie687s359] { background:rgba(220,38,38,0.06) !important; }
.far-row-warn td[b-fie687s359] { background:rgba(217,119,6,0.07) !important; }
.pc-addbar[b-fie687s359] { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; background:var(--rg-bg-subtle); border:1px solid var(--rg-border); border-radius:.55rem; padding:.6rem; margin-bottom:.85rem; }
.pc-addbar input[b-fie687s359], .pc-addbar select[b-fie687s359] { flex:1; min-width:130px; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:.45rem; padding:.4rem .55rem; font-size:.84rem; }
.help-tip[b-fie687s359] { display:flex; gap:.6rem; align-items:flex-start; background:rgba(37,99,235,0.07); border-left:4px solid var(--rg-accent,#2563eb); border-radius:0 .4rem .4rem 0; padding:.65rem .8rem; margin-top:.5rem; font-size:.82rem; color:var(--rg-text-secondary); }
.help-tip i[b-fie687s359] { color:var(--rg-accent,#2563eb); flex-shrink:0; }
[data-mode="dark"] .help-tip[b-fie687s359] { background:rgba(37,99,235,0.12); }

/* ── Perfil Contable por Documento ── */
.far-input[b-fie687s359] { padding:.4rem .55rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.45rem; font-size:.82rem; color:var(--rg-text-primary,#1e293b); background:var(--rg-bg-input,#fff); outline:none; width:100%; transition:border-color .15s; }
.far-input:focus[b-fie687s359] { border-color:var(--rg-accent,#4f46e5); box-shadow:0 0 0 2px rgba(79,70,229,.15); }
.far-input:disabled[b-fie687s359] { background:var(--rg-bg-subtle,#f8fafc); color:var(--rg-text-muted,#94a3b8); }
.far-input-sm[b-fie687s359] { padding:.3rem .4rem; font-size:.78rem; }

.far-tot[b-fie687s359] { display:inline-flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.5rem; padding:0 .45rem; border-radius:1rem; background:rgba(13,148,136,.14); color:#0d9488; font-weight:700; font-size:.74rem; }
[data-mode="dark"] .far-tot[b-fie687s359] { background:rgba(13,148,136,.22); color:#5eead4; }

.btn-sm[b-fie687s359] { padding:.32rem .6rem; font-size:.74rem; }

/* selectores de movimiento DEB/CRE */
.mov-deb[b-fie687s359] { color:#1d4ed8; font-weight:700; }
.mov-cre[b-fie687s359] { color:#b45309; font-weight:700; }
[data-mode="dark"] .mov-deb[b-fie687s359] { color:#93c5fd; }
[data-mode="dark"] .mov-cre[b-fie687s359] { color:#fcd34d; }

.pc-section-head[b-fie687s359] { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin:1.1rem 0 .35rem; }
.pc-section-head .far-section-title[b-fie687s359] { margin:0; border:none; padding:0; }

.pc-balance-hint[b-fie687s359] { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pc-balance-hint i[b-fie687s359] { margin-right:.2rem; }
.pc-hint-note[b-fie687s359] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); flex:1; min-width:200px; }

.pc-empty[b-fie687s359] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.8rem; border:1px dashed var(--rg-border,#e2e8f0); border-radius:.5rem; }

.pc-lineas td[b-fie687s359] { vertical-align:top; }
.pc-cuenta-nom[b-fie687s359] { display:flex; align-items:center; gap:.3rem; margin-top:.2rem; font-size:.72rem; color:#0d9488; }
[data-mode="dark"] .pc-cuenta-nom[b-fie687s359] { color:#5eead4; }
.pc-cuenta-nom i[b-fie687s359] { font-size:.8rem; }

/* ── Contenido del modal de ayuda ── */
.help-icon-header[b-fie687s359] { color:var(--rg-accent,#2563eb); margin-right:.25rem; }
.help-body[b-fie687s359] { display:flex; flex-direction:column; gap:0; padding:0; }
.help-section[b-fie687s359] { padding:1rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-fie687s359] { border-bottom:none; }
.help-section p[b-fie687s359] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.4rem; }
.help-section ul[b-fie687s359] { padding-left:1.25rem; margin-bottom:0; }
.help-section li[b-fie687s359] { font-size:.85rem; color:var(--rg-text-secondary,#475569); margin-bottom:.2rem; }
.help-section-title[b-fie687s359] { display:flex; align-items:center; gap:.45rem; font-size:.88rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.65rem; }
.help-section-title i[b-fie687s359] { color:var(--rg-accent,#2563eb); }

/* ── POS ── */
.pos-context[b-fie687s359] { display:flex; gap:.75rem; flex-wrap:wrap; align-items:flex-end; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; margin-bottom:.8rem; }
.pos-ctx-field[b-fie687s359] { display:flex; flex-direction:column; gap:.2rem; min-width:160px; }
.pos-ctx-field > label[b-fie687s359] { font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-text-muted,#94a3b8); }
.pos-ctx-grow[b-fie687s359] { flex:1; min-width:240px; }
.pos-cliente-ok[b-fie687s359] { font-size:.74rem; color:#0d9488; margin-top:.15rem; display:inline-flex; align-items:center; gap:.3rem; }
[data-mode="dark"] .pos-cliente-ok[b-fie687s359] { color:#5eead4; }
.pos-modo[b-fie687s359] { display:flex; gap:.3rem; }
.pos-modo-btn[b-fie687s359] { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .7rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.pos-modo-btn.active[b-fie687s359] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }

.pos-grid[b-fie687s359] { display:grid; grid-template-columns: 1fr 1fr; gap:.8rem; }
@media (max-width: 900px) { .pos-grid[b-fie687s359] { grid-template-columns: 1fr; } }
.pos-left[b-fie687s359], .pos-right[b-fie687s359] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.7rem .8rem; min-height:300px; }
.pos-panel-head[b-fie687s359] { display:flex; align-items:center; justify-content:space-between; font-size:.82rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.5rem; padding-bottom:.4rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.pos-panel-head i[b-fie687s359] { color:var(--rg-accent,#2563eb); }

.pos-empty[b-fie687s359] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem; padding:2rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.85rem; }
.pos-empty i[b-fie687s359] { font-size:1.8rem; }

.pos-cola[b-fie687s359] { display:flex; flex-direction:column; gap:.4rem; max-height:calc(100vh - 360px); overflow-y:auto; }
.pos-cola-item[b-fie687s359] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .7rem; cursor:pointer; }
.pos-cola-item.active[b-fie687s359] { border-color:var(--rg-accent,#2563eb); box-shadow:0 0 0 2px rgba(37,99,235,.15); }
.pos-cola-num[b-fie687s359] { font-weight:700; font-size:.84rem; color:var(--rg-text-primary,#1e293b); }
.pos-cola-cli[b-fie687s359] { font-size:.78rem; color:var(--rg-text-secondary,#475569); }
.pos-cola-meta[b-fie687s359] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }

.pos-prod-list[b-fie687s359] { display:flex; flex-direction:column; gap:.35rem; max-height:calc(100vh - 400px); overflow-y:auto; }
.pos-prod-item[b-fie687s359] { text-align:left; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.5rem .65rem; cursor:pointer; }
.pos-prod-item:hover[b-fie687s359] { border-color:var(--rg-accent,#2563eb); }
.pos-prod-nom[b-fie687s359] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.pos-prod-meta[b-fie687s359] { display:flex; gap:.7rem; flex-wrap:wrap; font-size:.72rem; color:var(--rg-text-muted,#94a3b8); margin-top:.15rem; align-items:center; }
.pos-nostock[b-fie687s359] { color:#dc2626; font-weight:600; }

.pos-cart[b-fie687s359] { overflow-x:auto; }
.pos-cart-table[b-fie687s359] { width:100%; }
.pos-cart-table input.far-input-sm[b-fie687s359] { width:100%; text-align:right; }

.pos-totales[b-fie687s359] { margin-top:.6rem; border-top:1px solid var(--rg-border,#e2e8f0); padding-top:.5rem; }
.pos-totales > div[b-fie687s359] { display:flex; justify-content:space-between; font-size:.84rem; color:var(--rg-text-secondary,#475569); padding:.15rem 0; }
.pos-ars[b-fie687s359] { color:#0d9488 !important; }
.pos-ars i[b-fie687s359] { margin-right:.2rem; }
[data-mode="dark"] .pos-ars[b-fie687s359] { color:#5eead4 !important; }
.pos-total-grande[b-fie687s359] { font-size:1.05rem !important; color:var(--rg-text-primary,#1e293b) !important; font-weight:700; border-top:1px dashed var(--rg-border,#e2e8f0); margin-top:.25rem; padding-top:.4rem !important; }

.pos-pagos-head[b-fie687s359] { margin-top:.8rem; }
.pos-pagos-actions[b-fie687s359] { display:flex; gap:.3rem; }
.pos-pago-row[b-fie687s359] { display:flex; gap:.4rem; align-items:center; margin-bottom:.35rem; }
.pos-pago-row .far-input-sm[b-fie687s359] { flex:1; }
.pos-pago-resumen[b-fie687s359] { display:flex; justify-content:space-between; font-size:.8rem; color:var(--rg-text-secondary,#475569); background:var(--rg-bg-subtle,#f8fafc); border-radius:.45rem; padding:.4rem .6rem; margin:.3rem 0 .6rem; }
.pos-pago-resumen.ok[b-fie687s359] { color:#0d9488; }
[data-mode="dark"] .pos-pago-resumen.ok[b-fie687s359] { color:#5eead4; }
.pos-facturar[b-fie687s359] { width:100%; justify-content:center; font-size:.95rem; padding:.7rem; }

/* Evidencia fotográfica */
.pos-evid-head[b-fie687s359] { margin-top:.8rem; }
.pos-evid-actions[b-fie687s359] { display:flex; gap:.3rem; }
.pos-evid-btn[b-fie687s359] { display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:.45rem; cursor:pointer; font-size:.9rem; }
.pos-evid-btn:hover[b-fie687s359] { border-color:var(--rg-accent,#2563eb); color:var(--rg-accent,#2563eb); }
.pos-evid-btn.uploading[b-fie687s359] { opacity:.7; pointer-events:none; }
.pos-evid-empty[b-fie687s359] { font-size:.76rem; color:var(--rg-text-muted,#94a3b8); padding:.5rem 0; }
.pos-qr[b-fie687s359] { display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:.5rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; margin-bottom:.5rem; }
.pos-qr img[b-fie687s359] { width:140px; height:140px; }
.pos-qr span[b-fie687s359] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.pos-evid-galeria[b-fie687s359] { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.5rem; }
.pos-evid-thumb[b-fie687s359] { width:54px; height:54px; border-radius:.4rem; overflow:hidden; border:1px solid var(--rg-border,#e2e8f0); }
.pos-evid-thumb img[b-fie687s359] { width:100%; height:100%; object-fit:cover; }

/* Modales anidados (envío sobre post-grabado) */
.modal-backdrop-nested[b-fie687s359] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-fie687s359] { z-index: 2001 !important; }

/* Post-grabado */
.ps-recibo-info[b-fie687s359] { display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .75rem; margin-bottom:.5rem; }
.ps-label[b-fie687s359] { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--rg-text-muted,#94a3b8); }
.ps-value[b-fie687s359] { font-size:1.05rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.ps-acciones[b-fie687s359] { display:flex; flex-direction:column; gap:.5rem; margin-top:.5rem; }
.ps-acciones .btn-crud[b-fie687s359] { width:100%; justify-content:center; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmestadocuentaprestamos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-zebsna0ip9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-zebsna0ip9 0.3s ease-out; }
@keyframes slideUp-b-zebsna0ip9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-zebsna0ip9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-zebsna0ip9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-zebsna0ip9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-zebsna0ip9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-zebsna0ip9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-zebsna0ip9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-zebsna0ip9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-zebsna0ip9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-zebsna0ip9] { filter: brightness(1.1); }
.btn-outline[b-zebsna0ip9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-zebsna0ip9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-zebsna0ip9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-zebsna0ip9] { filter: brightness(1.1); }
.btn-icon[b-zebsna0ip9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-zebsna0ip9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-zebsna0ip9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-zebsna0ip9] { color: #ef4444; }
.btn-delete:hover[b-zebsna0ip9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-zebsna0ip9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-zebsna0ip9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-zebsna0ip9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-zebsna0ip9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-zebsna0ip9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-zebsna0ip9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-zebsna0ip9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-zebsna0ip9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-zebsna0ip9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-zebsna0ip9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-zebsna0ip9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-zebsna0ip9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-zebsna0ip9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-zebsna0ip9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-zebsna0ip9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-zebsna0ip9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-zebsna0ip9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-zebsna0ip9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-zebsna0ip9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-zebsna0ip9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-zebsna0ip9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-zebsna0ip9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-zebsna0ip9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-zebsna0ip9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-zebsna0ip9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-zebsna0ip9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-zebsna0ip9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-zebsna0ip9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-zebsna0ip9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-zebsna0ip9] { display: block; }
.hide-on-cards[b-zebsna0ip9] { display: none !important; }
.show-on-cards[b-zebsna0ip9] { display: grid; }
.hide-on-grid[b-zebsna0ip9] { display: none !important; }

/* Badges */
.badge[b-zebsna0ip9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-zebsna0ip9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-zebsna0ip9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-zebsna0ip9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-zebsna0ip9] { text-align: center; }
.text-muted[b-zebsna0ip9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-zebsna0ip9], .crud-empty-state[b-zebsna0ip9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-zebsna0ip9] { font-size: 2rem; }
.crud-spinner[b-zebsna0ip9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-zebsna0ip9 0.6s linear infinite; }
.crud-spinner-sm[b-zebsna0ip9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-zebsna0ip9 0.6s linear infinite; }
@keyframes spin-b-zebsna0ip9 { to { transform: rotate(360deg); } }
.spin[b-zebsna0ip9] { animation: spin-b-zebsna0ip9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-zebsna0ip9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-zebsna0ip9 0.15s ease-out; }
.modal-container[b-zebsna0ip9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-zebsna0ip9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-zebsna0ip9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-zebsna0ip9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-zebsna0ip9] { max-width: 420px; }
@keyframes fadeIn-b-zebsna0ip9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-zebsna0ip9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-zebsna0ip9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-zebsna0ip9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-zebsna0ip9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-zebsna0ip9] { color: #dc2626; }
.modal-close[b-zebsna0ip9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-zebsna0ip9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-zebsna0ip9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-zebsna0ip9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-zebsna0ip9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-zebsna0ip9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-zebsna0ip9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-zebsna0ip9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-zebsna0ip9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-zebsna0ip9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-zebsna0ip9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-zebsna0ip9] { flex: 2; }
.form-group label[b-zebsna0ip9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-zebsna0ip9], .form-group select[b-zebsna0ip9], .form-textarea[b-zebsna0ip9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-zebsna0ip9], .form-group select:focus[b-zebsna0ip9], .form-textarea:focus[b-zebsna0ip9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-zebsna0ip9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-zebsna0ip9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-zebsna0ip9] { flex: 1; display: flex; align-items: center; }
.form-check[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-zebsna0ip9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-zebsna0ip9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-zebsna0ip9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-zebsna0ip9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-zebsna0ip9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-zebsna0ip9] { font-size: 3rem; }
.photo-placeholder span[b-zebsna0ip9] { font-size: 0.78rem; }
.photo-actions[b-zebsna0ip9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-zebsna0ip9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-zebsna0ip9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-zebsna0ip9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-zebsna0ip9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-zebsna0ip9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-zebsna0ip9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-zebsna0ip9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-zebsna0ip9] { filter: brightness(1.15); transform: scale(1.05); }
[b-zebsna0ip9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-zebsna0ip9] { padding: 0.75rem; }
    .crud-header[b-zebsna0ip9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-zebsna0ip9] { font-size: 1.1rem; }
    .btn-text[b-zebsna0ip9] { display: none; }
    .form-row[b-zebsna0ip9] { flex-direction: column; }
    .form-row-4[b-zebsna0ip9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-zebsna0ip9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-zebsna0ip9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-zebsna0ip9] { padding: 0.75rem; }
    .modal-tabs[b-zebsna0ip9] { overflow-x: auto; }
    .modal-tab[b-zebsna0ip9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-zebsna0ip9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-zebsna0ip9] { display: grid !important; }
    .crud-cards-wrapper[b-zebsna0ip9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-zebsna0ip9] { grid-template-columns: 1fr; }
    .card-details[b-zebsna0ip9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-zebsna0ip9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-zebsna0ip9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-zebsna0ip9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-zebsna0ip9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmingresosalidadenominadora.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9hkceof3iq] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9hkceof3iq 0.3s ease-out; }
@keyframes slideUp-b-9hkceof3iq { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9hkceof3iq] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9hkceof3iq] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9hkceof3iq] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9hkceof3iq] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9hkceof3iq] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9hkceof3iq] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9hkceof3iq] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9hkceof3iq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9hkceof3iq] { filter: brightness(1.1); }
.btn-outline[b-9hkceof3iq] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9hkceof3iq] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9hkceof3iq] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9hkceof3iq] { filter: brightness(1.1); }
.btn-icon[b-9hkceof3iq] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9hkceof3iq] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9hkceof3iq] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9hkceof3iq] { color: #ef4444; }
.btn-delete:hover[b-9hkceof3iq] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9hkceof3iq] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9hkceof3iq] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9hkceof3iq] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9hkceof3iq] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9hkceof3iq] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9hkceof3iq] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9hkceof3iq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9hkceof3iq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9hkceof3iq] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9hkceof3iq] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9hkceof3iq] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9hkceof3iq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9hkceof3iq] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9hkceof3iq] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9hkceof3iq] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9hkceof3iq] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9hkceof3iq] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9hkceof3iq] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9hkceof3iq] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9hkceof3iq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9hkceof3iq] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9hkceof3iq] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9hkceof3iq] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9hkceof3iq] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9hkceof3iq] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9hkceof3iq] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9hkceof3iq] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9hkceof3iq] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9hkceof3iq] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9hkceof3iq] { display: block; }
.hide-on-cards[b-9hkceof3iq] { display: none !important; }
.show-on-cards[b-9hkceof3iq] { display: grid; }
.hide-on-grid[b-9hkceof3iq] { display: none !important; }

/* Badges */
.badge[b-9hkceof3iq] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9hkceof3iq] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9hkceof3iq] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9hkceof3iq] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9hkceof3iq] { text-align: center; }
.text-muted[b-9hkceof3iq] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9hkceof3iq], .crud-empty-state[b-9hkceof3iq] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9hkceof3iq] { font-size: 2rem; }
.crud-spinner[b-9hkceof3iq] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9hkceof3iq 0.6s linear infinite; }
.crud-spinner-sm[b-9hkceof3iq] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9hkceof3iq 0.6s linear infinite; }
@keyframes spin-b-9hkceof3iq { to { transform: rotate(360deg); } }
.spin[b-9hkceof3iq] { animation: spin-b-9hkceof3iq 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9hkceof3iq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9hkceof3iq 0.15s ease-out; }
.modal-container[b-9hkceof3iq] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9hkceof3iq] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9hkceof3iq 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9hkceof3iq] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9hkceof3iq] { max-width: 420px; }
@keyframes fadeIn-b-9hkceof3iq { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9hkceof3iq { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9hkceof3iq] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9hkceof3iq] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9hkceof3iq] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9hkceof3iq] { color: #dc2626; }
.modal-close[b-9hkceof3iq] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9hkceof3iq] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9hkceof3iq] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9hkceof3iq] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9hkceof3iq] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9hkceof3iq] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9hkceof3iq] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9hkceof3iq] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9hkceof3iq] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9hkceof3iq] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9hkceof3iq] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9hkceof3iq] { flex: 2; }
.form-group label[b-9hkceof3iq] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9hkceof3iq], .form-group select[b-9hkceof3iq], .form-textarea[b-9hkceof3iq] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9hkceof3iq], .form-group select:focus[b-9hkceof3iq], .form-textarea:focus[b-9hkceof3iq] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9hkceof3iq] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9hkceof3iq] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9hkceof3iq] { flex: 1; display: flex; align-items: center; }
.form-check[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9hkceof3iq] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9hkceof3iq] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9hkceof3iq] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9hkceof3iq] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9hkceof3iq] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9hkceof3iq] { font-size: 3rem; }
.photo-placeholder span[b-9hkceof3iq] { font-size: 0.78rem; }
.photo-actions[b-9hkceof3iq] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9hkceof3iq] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9hkceof3iq] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9hkceof3iq] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9hkceof3iq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9hkceof3iq] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9hkceof3iq] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9hkceof3iq] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9hkceof3iq] { filter: brightness(1.15); transform: scale(1.05); }
[b-9hkceof3iq] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9hkceof3iq] { padding: 0.75rem; }
    .crud-header[b-9hkceof3iq] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9hkceof3iq] { font-size: 1.1rem; }
    .btn-text[b-9hkceof3iq] { display: none; }
    .form-row[b-9hkceof3iq] { flex-direction: column; }
    .form-row-4[b-9hkceof3iq] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9hkceof3iq] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9hkceof3iq] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9hkceof3iq] { padding: 0.75rem; }
    .modal-tabs[b-9hkceof3iq] { overflow-x: auto; }
    .modal-tab[b-9hkceof3iq] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9hkceof3iq] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9hkceof3iq] { display: grid !important; }
    .crud-cards-wrapper[b-9hkceof3iq] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9hkceof3iq] { grid-template-columns: 1fr; }
    .card-details[b-9hkceof3iq] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9hkceof3iq] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9hkceof3iq] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9hkceof3iq] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9hkceof3iq] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmlistadoprestamos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-la4vzb7u22] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-la4vzb7u22 0.3s ease-out; }
@keyframes slideUp-b-la4vzb7u22 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-la4vzb7u22] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-la4vzb7u22] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-la4vzb7u22] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-la4vzb7u22] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-la4vzb7u22] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-la4vzb7u22] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-la4vzb7u22] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-la4vzb7u22] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-la4vzb7u22] { filter: brightness(1.1); }
.btn-outline[b-la4vzb7u22] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-la4vzb7u22] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-la4vzb7u22] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-la4vzb7u22] { filter: brightness(1.1); }
.btn-icon[b-la4vzb7u22] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-la4vzb7u22] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-la4vzb7u22] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-la4vzb7u22] { color: #ef4444; }
.btn-delete:hover[b-la4vzb7u22] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-la4vzb7u22] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-la4vzb7u22] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-la4vzb7u22] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-la4vzb7u22] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-la4vzb7u22] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-la4vzb7u22] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-la4vzb7u22] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-la4vzb7u22] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-la4vzb7u22] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-la4vzb7u22] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-la4vzb7u22] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-la4vzb7u22] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-la4vzb7u22] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-la4vzb7u22] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-la4vzb7u22] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-la4vzb7u22] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-la4vzb7u22] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-la4vzb7u22] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-la4vzb7u22] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-la4vzb7u22] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-la4vzb7u22] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-la4vzb7u22] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-la4vzb7u22] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-la4vzb7u22] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-la4vzb7u22] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-la4vzb7u22] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-la4vzb7u22] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-la4vzb7u22] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-la4vzb7u22] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-la4vzb7u22] { display: block; }
.hide-on-cards[b-la4vzb7u22] { display: none !important; }
.show-on-cards[b-la4vzb7u22] { display: grid; }
.hide-on-grid[b-la4vzb7u22] { display: none !important; }

/* Badges */
.badge[b-la4vzb7u22] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-la4vzb7u22] { background: #ecfdf5; color: #065f46; }
.badge-no[b-la4vzb7u22] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-la4vzb7u22] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-la4vzb7u22] { text-align: center; }
.text-muted[b-la4vzb7u22] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-la4vzb7u22], .crud-empty-state[b-la4vzb7u22] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-la4vzb7u22] { font-size: 2rem; }
.crud-spinner[b-la4vzb7u22] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-la4vzb7u22 0.6s linear infinite; }
.crud-spinner-sm[b-la4vzb7u22] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-la4vzb7u22 0.6s linear infinite; }
@keyframes spin-b-la4vzb7u22 { to { transform: rotate(360deg); } }
.spin[b-la4vzb7u22] { animation: spin-b-la4vzb7u22 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-la4vzb7u22] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-la4vzb7u22 0.15s ease-out; }
.modal-container[b-la4vzb7u22] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-la4vzb7u22] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-la4vzb7u22 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-la4vzb7u22] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-la4vzb7u22] { max-width: 420px; }
@keyframes fadeIn-b-la4vzb7u22 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-la4vzb7u22 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-la4vzb7u22] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-la4vzb7u22] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-la4vzb7u22] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-la4vzb7u22] { color: #dc2626; }
.modal-close[b-la4vzb7u22] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-la4vzb7u22] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-la4vzb7u22] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-la4vzb7u22] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-la4vzb7u22] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-la4vzb7u22] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-la4vzb7u22] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-la4vzb7u22] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-la4vzb7u22] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-la4vzb7u22] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-la4vzb7u22] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-la4vzb7u22] { flex: 2; }
.form-group label[b-la4vzb7u22] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-la4vzb7u22], .form-group select[b-la4vzb7u22], .form-textarea[b-la4vzb7u22] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-la4vzb7u22], .form-group select:focus[b-la4vzb7u22], .form-textarea:focus[b-la4vzb7u22] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-la4vzb7u22] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-la4vzb7u22] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-la4vzb7u22] { flex: 1; display: flex; align-items: center; }
.form-check[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-la4vzb7u22] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-la4vzb7u22] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-la4vzb7u22] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-la4vzb7u22] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-la4vzb7u22] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-la4vzb7u22] { font-size: 3rem; }
.photo-placeholder span[b-la4vzb7u22] { font-size: 0.78rem; }
.photo-actions[b-la4vzb7u22] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-la4vzb7u22] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-la4vzb7u22] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-la4vzb7u22] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-la4vzb7u22] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-la4vzb7u22] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-la4vzb7u22] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-la4vzb7u22] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-la4vzb7u22] { filter: brightness(1.15); transform: scale(1.05); }
[b-la4vzb7u22] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-la4vzb7u22] { padding: 0.75rem; }
    .crud-header[b-la4vzb7u22] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-la4vzb7u22] { font-size: 1.1rem; }
    .btn-text[b-la4vzb7u22] { display: none; }
    .form-row[b-la4vzb7u22] { flex-direction: column; }
    .form-row-4[b-la4vzb7u22] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-la4vzb7u22] { width: 98%; max-height: 95vh; }
    .modal-lg[b-la4vzb7u22] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-la4vzb7u22] { padding: 0.75rem; }
    .modal-tabs[b-la4vzb7u22] { overflow-x: auto; }
    .modal-tab[b-la4vzb7u22] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-la4vzb7u22] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-la4vzb7u22] { display: grid !important; }
    .crud-cards-wrapper[b-la4vzb7u22] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-la4vzb7u22] { grid-template-columns: 1fr; }
    .card-details[b-la4vzb7u22] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-la4vzb7u22] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-la4vzb7u22] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-la4vzb7u22] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-la4vzb7u22] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmmantenimiento.razor.rz.scp.css */
/* ============================================================
   Mantenimiento Catalogos — Estilos CRUD estándar
   Copiado del canónico Frmclientes.razor.css
   ============================================================ */

.crud-container[b-js8gqbgz52] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-js8gqbgz52 0.3s ease-out; }
@keyframes slideUp-b-js8gqbgz52 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-js8gqbgz52] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-js8gqbgz52] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-js8gqbgz52] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-js8gqbgz52] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-js8gqbgz52] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-js8gqbgz52] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-js8gqbgz52] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-js8gqbgz52] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-js8gqbgz52] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-js8gqbgz52] { filter: brightness(1.1); }
.btn-outline[b-js8gqbgz52] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-js8gqbgz52] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-js8gqbgz52] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-js8gqbgz52] { filter: brightness(1.1); }
.btn-icon[b-js8gqbgz52] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-js8gqbgz52] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-js8gqbgz52] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-js8gqbgz52] { color: #ef4444; }
.btn-delete:hover[b-js8gqbgz52] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-js8gqbgz52] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-js8gqbgz52] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-js8gqbgz52] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-js8gqbgz52] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Tabs (reutiliza crud-search-bar como contenedor de tabs) */
.crud-search-bar[b-js8gqbgz52] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); flex-wrap: wrap; }
.crud-search-bar i[b-js8gqbgz52] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-js8gqbgz52] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-js8gqbgz52] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-js8gqbgz52] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-js8gqbgz52] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-js8gqbgz52] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-js8gqbgz52] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-js8gqbgz52] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-js8gqbgz52] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-js8gqbgz52] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-js8gqbgz52] { width: 80px; text-align: center; white-space: nowrap; }

/* Icono catálogo (avatar columna) */
.catalogo-icon-sm[b-js8gqbgz52] {
    width: 32px; height: 32px; border-radius: 6px;
    background: rgba(79, 70, 229, 0.1);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.catalogo-icon-sm i[b-js8gqbgz52] { color: #4f46e5; font-size: 1rem; }
[data-mode="dark"] .catalogo-icon-sm[b-js8gqbgz52] { background: rgba(79, 70, 229, 0.18); }
[data-mode="dark"] .catalogo-icon-sm i[b-js8gqbgz52] { color: #a5b4fc; }

/* Badges */
.badge[b-js8gqbgz52] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-js8gqbgz52] { background: #ecfdf5; color: #065f46; }
.badge-no[b-js8gqbgz52] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-js8gqbgz52] { background: rgba(34,197,94,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-js8gqbgz52] { background: rgba(100,116,139,0.15); color: #94a3b8; }

/* Utilities */
.font-mono[b-js8gqbgz52] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-js8gqbgz52] { text-align: center; }
.text-muted[b-js8gqbgz52] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-js8gqbgz52], .crud-empty-state[b-js8gqbgz52] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-js8gqbgz52] { font-size: 2.5rem; opacity: 0.4; }
.crud-spinner[b-js8gqbgz52] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-js8gqbgz52 0.6s linear infinite; }
.crud-spinner-sm[b-js8gqbgz52] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-js8gqbgz52 0.6s linear infinite; }
@keyframes spin-b-js8gqbgz52 { to { transform: rotate(360deg); } }
.spin[b-js8gqbgz52] { animation: spin-b-js8gqbgz52 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-js8gqbgz52] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-js8gqbgz52 0.15s ease-out; }
.modal-container[b-js8gqbgz52] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-js8gqbgz52] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-js8gqbgz52 0.2s ease-out; }
.modal-sm[b-js8gqbgz52] { max-width: 420px; }
@keyframes fadeIn-b-js8gqbgz52 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-js8gqbgz52 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-js8gqbgz52] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-js8gqbgz52] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-js8gqbgz52] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-js8gqbgz52] { color: #dc2626; }
[data-mode="dark"] .modal-header-danger h2[b-js8gqbgz52] { color: #f87171; }
.modal-close[b-js8gqbgz52] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-js8gqbgz52] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-js8gqbgz52] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-js8gqbgz52] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-js8gqbgz52] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-js8gqbgz52] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-js8gqbgz52] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-js8gqbgz52], .form-group select[b-js8gqbgz52] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-js8gqbgz52], .form-group select:focus[b-js8gqbgz52] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-js8gqbgz52] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-js8gqbgz52] { padding: 0.75rem; }
    .crud-header[b-js8gqbgz52] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-js8gqbgz52] { font-size: 1.1rem; }
    .btn-text[b-js8gqbgz52] { display: none; }
    .form-row[b-js8gqbgz52] { flex-direction: column; }
    .modal-dialog[b-js8gqbgz52] { width: 98%; max-height: 95vh; }
    .modal-body[b-js8gqbgz52] { padding: 0.75rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-js8gqbgz52] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-js8gqbgz52] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-js8gqbgz52] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-js8gqbgz52] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmmodificadatosprestamos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-a84oa816or] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-a84oa816or 0.3s ease-out; }
@keyframes slideUp-b-a84oa816or { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-a84oa816or] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-a84oa816or] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-a84oa816or] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-a84oa816or] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-a84oa816or] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-a84oa816or] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-a84oa816or] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-a84oa816or] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-a84oa816or] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-a84oa816or] { filter: brightness(1.1); }
.btn-outline[b-a84oa816or] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-a84oa816or] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-a84oa816or] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-a84oa816or] { filter: brightness(1.1); }
.btn-icon[b-a84oa816or] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-a84oa816or] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-a84oa816or] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-a84oa816or] { color: #ef4444; }
.btn-delete:hover[b-a84oa816or] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-a84oa816or] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-a84oa816or] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-a84oa816or] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-a84oa816or] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-a84oa816or] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-a84oa816or] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-a84oa816or] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-a84oa816or] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-a84oa816or] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-a84oa816or] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-a84oa816or] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-a84oa816or] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-a84oa816or] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-a84oa816or] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-a84oa816or] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-a84oa816or] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-a84oa816or] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-a84oa816or] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-a84oa816or] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-a84oa816or] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-a84oa816or] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-a84oa816or] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-a84oa816or] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-a84oa816or] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-a84oa816or] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-a84oa816or] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-a84oa816or] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-a84oa816or] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-a84oa816or] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-a84oa816or] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-a84oa816or] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-a84oa816or] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-a84oa816or] { display: block; }
.hide-on-cards[b-a84oa816or] { display: none !important; }
.show-on-cards[b-a84oa816or] { display: grid; }
.hide-on-grid[b-a84oa816or] { display: none !important; }

/* Badges */
.badge[b-a84oa816or] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-a84oa816or] { background: #ecfdf5; color: #065f46; }
.badge-no[b-a84oa816or] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-a84oa816or] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-a84oa816or] { text-align: center; }
.text-muted[b-a84oa816or] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-a84oa816or], .crud-empty-state[b-a84oa816or] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-a84oa816or] { font-size: 2rem; }
.crud-spinner[b-a84oa816or] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-a84oa816or 0.6s linear infinite; }
.crud-spinner-sm[b-a84oa816or] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-a84oa816or 0.6s linear infinite; }
@keyframes spin-b-a84oa816or { to { transform: rotate(360deg); } }
.spin[b-a84oa816or] { animation: spin-b-a84oa816or 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-a84oa816or] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-a84oa816or 0.15s ease-out; }
.modal-container[b-a84oa816or] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-a84oa816or] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-a84oa816or 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-a84oa816or] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-a84oa816or] { max-width: 420px; }
@keyframes fadeIn-b-a84oa816or { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-a84oa816or { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-a84oa816or] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-a84oa816or] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-a84oa816or] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-a84oa816or] { color: #dc2626; }
.modal-close[b-a84oa816or] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-a84oa816or] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-a84oa816or] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-a84oa816or] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-a84oa816or] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-a84oa816or] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-a84oa816or] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-a84oa816or] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-a84oa816or] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-a84oa816or] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-a84oa816or] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-a84oa816or] { flex: 2; }
.form-group label[b-a84oa816or] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-a84oa816or], .form-group select[b-a84oa816or], .form-textarea[b-a84oa816or] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-a84oa816or], .form-group select:focus[b-a84oa816or], .form-textarea:focus[b-a84oa816or] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-a84oa816or] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-a84oa816or] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-a84oa816or] { flex: 1; display: flex; align-items: center; }
.form-check[b-a84oa816or] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-a84oa816or] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-a84oa816or] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-a84oa816or] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-a84oa816or] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-a84oa816or] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-a84oa816or] { font-size: 3rem; }
.photo-placeholder span[b-a84oa816or] { font-size: 0.78rem; }
.photo-actions[b-a84oa816or] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-a84oa816or] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-a84oa816or] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-a84oa816or] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-a84oa816or] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-a84oa816or] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-a84oa816or] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-a84oa816or] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-a84oa816or] { filter: brightness(1.15); transform: scale(1.05); }
[b-a84oa816or] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-a84oa816or] { padding: 0.75rem; }
    .crud-header[b-a84oa816or] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-a84oa816or] { font-size: 1.1rem; }
    .btn-text[b-a84oa816or] { display: none; }
    .form-row[b-a84oa816or] { flex-direction: column; }
    .form-row-4[b-a84oa816or] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-a84oa816or] { width: 98%; max-height: 95vh; }
    .modal-lg[b-a84oa816or] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-a84oa816or] { padding: 0.75rem; }
    .modal-tabs[b-a84oa816or] { overflow-x: auto; }
    .modal-tab[b-a84oa816or] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-a84oa816or] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-a84oa816or] { display: grid !important; }
    .crud-cards-wrapper[b-a84oa816or] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-a84oa816or] { grid-template-columns: 1fr; }
    .card-details[b-a84oa816or] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-a84oa816or] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-a84oa816or] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-a84oa816or] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-a84oa816or] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmmodificalinecredito.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2wwjmde2ij] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2wwjmde2ij 0.3s ease-out; }
@keyframes slideUp-b-2wwjmde2ij { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2wwjmde2ij] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2wwjmde2ij] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2wwjmde2ij] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2wwjmde2ij] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2wwjmde2ij] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2wwjmde2ij] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2wwjmde2ij] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2wwjmde2ij] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2wwjmde2ij] { filter: brightness(1.1); }
.btn-outline[b-2wwjmde2ij] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2wwjmde2ij] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2wwjmde2ij] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2wwjmde2ij] { filter: brightness(1.1); }
.btn-icon[b-2wwjmde2ij] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2wwjmde2ij] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2wwjmde2ij] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2wwjmde2ij] { color: #ef4444; }
.btn-delete:hover[b-2wwjmde2ij] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2wwjmde2ij] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2wwjmde2ij] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2wwjmde2ij] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2wwjmde2ij] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2wwjmde2ij] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2wwjmde2ij] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2wwjmde2ij] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2wwjmde2ij] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2wwjmde2ij] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2wwjmde2ij] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2wwjmde2ij] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2wwjmde2ij] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2wwjmde2ij] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2wwjmde2ij] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2wwjmde2ij] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2wwjmde2ij] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2wwjmde2ij] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2wwjmde2ij] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2wwjmde2ij] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2wwjmde2ij] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2wwjmde2ij] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2wwjmde2ij] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2wwjmde2ij] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2wwjmde2ij] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2wwjmde2ij] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2wwjmde2ij] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2wwjmde2ij] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2wwjmde2ij] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2wwjmde2ij] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2wwjmde2ij] { display: block; }
.hide-on-cards[b-2wwjmde2ij] { display: none !important; }
.show-on-cards[b-2wwjmde2ij] { display: grid; }
.hide-on-grid[b-2wwjmde2ij] { display: none !important; }

/* Badges */
.badge[b-2wwjmde2ij] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2wwjmde2ij] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2wwjmde2ij] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2wwjmde2ij] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2wwjmde2ij] { text-align: center; }
.text-muted[b-2wwjmde2ij] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2wwjmde2ij], .crud-empty-state[b-2wwjmde2ij] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2wwjmde2ij] { font-size: 2rem; }
.crud-spinner[b-2wwjmde2ij] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2wwjmde2ij 0.6s linear infinite; }
.crud-spinner-sm[b-2wwjmde2ij] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2wwjmde2ij 0.6s linear infinite; }
@keyframes spin-b-2wwjmde2ij { to { transform: rotate(360deg); } }
.spin[b-2wwjmde2ij] { animation: spin-b-2wwjmde2ij 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2wwjmde2ij] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2wwjmde2ij 0.15s ease-out; }
.modal-container[b-2wwjmde2ij] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2wwjmde2ij] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2wwjmde2ij 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2wwjmde2ij] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2wwjmde2ij] { max-width: 420px; }
@keyframes fadeIn-b-2wwjmde2ij { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2wwjmde2ij { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2wwjmde2ij] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2wwjmde2ij] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2wwjmde2ij] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2wwjmde2ij] { color: #dc2626; }
.modal-close[b-2wwjmde2ij] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2wwjmde2ij] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2wwjmde2ij] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2wwjmde2ij] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2wwjmde2ij] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2wwjmde2ij] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2wwjmde2ij] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2wwjmde2ij] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2wwjmde2ij] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2wwjmde2ij] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2wwjmde2ij] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2wwjmde2ij] { flex: 2; }
.form-group label[b-2wwjmde2ij] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2wwjmde2ij], .form-group select[b-2wwjmde2ij], .form-textarea[b-2wwjmde2ij] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2wwjmde2ij], .form-group select:focus[b-2wwjmde2ij], .form-textarea:focus[b-2wwjmde2ij] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2wwjmde2ij] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2wwjmde2ij] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2wwjmde2ij] { flex: 1; display: flex; align-items: center; }
.form-check[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2wwjmde2ij] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2wwjmde2ij] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2wwjmde2ij] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2wwjmde2ij] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2wwjmde2ij] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2wwjmde2ij] { font-size: 3rem; }
.photo-placeholder span[b-2wwjmde2ij] { font-size: 0.78rem; }
.photo-actions[b-2wwjmde2ij] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2wwjmde2ij] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2wwjmde2ij] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2wwjmde2ij] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2wwjmde2ij] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2wwjmde2ij] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2wwjmde2ij] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2wwjmde2ij] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2wwjmde2ij] { filter: brightness(1.15); transform: scale(1.05); }
[b-2wwjmde2ij] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2wwjmde2ij] { padding: 0.75rem; }
    .crud-header[b-2wwjmde2ij] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2wwjmde2ij] { font-size: 1.1rem; }
    .btn-text[b-2wwjmde2ij] { display: none; }
    .form-row[b-2wwjmde2ij] { flex-direction: column; }
    .form-row-4[b-2wwjmde2ij] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2wwjmde2ij] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2wwjmde2ij] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2wwjmde2ij] { padding: 0.75rem; }
    .modal-tabs[b-2wwjmde2ij] { overflow-x: auto; }
    .modal-tab[b-2wwjmde2ij] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2wwjmde2ij] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2wwjmde2ij] { display: grid !important; }
    .crud-cards-wrapper[b-2wwjmde2ij] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2wwjmde2ij] { grid-template-columns: 1fr; }
    .card-details[b-2wwjmde2ij] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2wwjmde2ij] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2wwjmde2ij] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2wwjmde2ij] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2wwjmde2ij] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprCastigadosListado.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-feh3zfdkia] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-feh3zfdkia 0.3s ease-out; }
@keyframes slideUp-b-feh3zfdkia { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-feh3zfdkia] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-feh3zfdkia] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-feh3zfdkia] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-feh3zfdkia] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-feh3zfdkia] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-feh3zfdkia] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-feh3zfdkia] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-feh3zfdkia] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-feh3zfdkia] { filter: brightness(1.1); }
.btn-outline[b-feh3zfdkia] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-feh3zfdkia] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-feh3zfdkia] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-feh3zfdkia] { filter: brightness(1.1); }
.btn-icon[b-feh3zfdkia] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-feh3zfdkia] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-feh3zfdkia] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-feh3zfdkia] { color: #ef4444; }
.btn-delete:hover[b-feh3zfdkia] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-feh3zfdkia] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-feh3zfdkia] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-feh3zfdkia] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-feh3zfdkia] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-feh3zfdkia] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-feh3zfdkia] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-feh3zfdkia] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-feh3zfdkia] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-feh3zfdkia] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-feh3zfdkia] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-feh3zfdkia] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-feh3zfdkia] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-feh3zfdkia] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-feh3zfdkia] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-feh3zfdkia] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-feh3zfdkia] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-feh3zfdkia] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-feh3zfdkia] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-feh3zfdkia] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-feh3zfdkia] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-feh3zfdkia] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-feh3zfdkia] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-feh3zfdkia] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-feh3zfdkia] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-feh3zfdkia] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-feh3zfdkia] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-feh3zfdkia] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-feh3zfdkia] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-feh3zfdkia] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-feh3zfdkia] { display: block; }
.hide-on-cards[b-feh3zfdkia] { display: none !important; }
.show-on-cards[b-feh3zfdkia] { display: grid; }
.hide-on-grid[b-feh3zfdkia] { display: none !important; }

/* Badges */
.badge[b-feh3zfdkia] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-feh3zfdkia] { background: #ecfdf5; color: #065f46; }
.badge-no[b-feh3zfdkia] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-feh3zfdkia] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-feh3zfdkia] { text-align: center; }
.text-muted[b-feh3zfdkia] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-feh3zfdkia], .crud-empty-state[b-feh3zfdkia] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-feh3zfdkia] { font-size: 2rem; }
.crud-spinner[b-feh3zfdkia] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-feh3zfdkia 0.6s linear infinite; }
.crud-spinner-sm[b-feh3zfdkia] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-feh3zfdkia 0.6s linear infinite; }
@keyframes spin-b-feh3zfdkia { to { transform: rotate(360deg); } }
.spin[b-feh3zfdkia] { animation: spin-b-feh3zfdkia 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-feh3zfdkia] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-feh3zfdkia 0.15s ease-out; }
.modal-container[b-feh3zfdkia] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-feh3zfdkia] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-feh3zfdkia 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-feh3zfdkia] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-feh3zfdkia] { max-width: 420px; }
@keyframes fadeIn-b-feh3zfdkia { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-feh3zfdkia { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-feh3zfdkia] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-feh3zfdkia] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-feh3zfdkia] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-feh3zfdkia] { color: #dc2626; }
.modal-close[b-feh3zfdkia] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-feh3zfdkia] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-feh3zfdkia] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-feh3zfdkia] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-feh3zfdkia] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-feh3zfdkia] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-feh3zfdkia] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-feh3zfdkia] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-feh3zfdkia] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-feh3zfdkia] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-feh3zfdkia] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-feh3zfdkia] { flex: 2; }
.form-group label[b-feh3zfdkia] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-feh3zfdkia], .form-group select[b-feh3zfdkia], .form-textarea[b-feh3zfdkia] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-feh3zfdkia], .form-group select:focus[b-feh3zfdkia], .form-textarea:focus[b-feh3zfdkia] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-feh3zfdkia] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-feh3zfdkia] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-feh3zfdkia] { flex: 1; display: flex; align-items: center; }
.form-check[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-feh3zfdkia] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-feh3zfdkia] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-feh3zfdkia] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-feh3zfdkia] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-feh3zfdkia] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-feh3zfdkia] { font-size: 3rem; }
.photo-placeholder span[b-feh3zfdkia] { font-size: 0.78rem; }
.photo-actions[b-feh3zfdkia] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-feh3zfdkia] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-feh3zfdkia] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-feh3zfdkia] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-feh3zfdkia] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-feh3zfdkia] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-feh3zfdkia] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-feh3zfdkia] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-feh3zfdkia] { filter: brightness(1.15); transform: scale(1.05); }
[b-feh3zfdkia] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-feh3zfdkia] { padding: 0.75rem; }
    .crud-header[b-feh3zfdkia] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-feh3zfdkia] { font-size: 1.1rem; }
    .btn-text[b-feh3zfdkia] { display: none; }
    .form-row[b-feh3zfdkia] { flex-direction: column; }
    .form-row-4[b-feh3zfdkia] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-feh3zfdkia] { width: 98%; max-height: 95vh; }
    .modal-lg[b-feh3zfdkia] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-feh3zfdkia] { padding: 0.75rem; }
    .modal-tabs[b-feh3zfdkia] { overflow-x: auto; }
    .modal-tab[b-feh3zfdkia] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-feh3zfdkia] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-feh3zfdkia] { display: grid !important; }
    .crud-cards-wrapper[b-feh3zfdkia] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-feh3zfdkia] { grid-template-columns: 1fr; }
    .card-details[b-feh3zfdkia] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-feh3zfdkia] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-feh3zfdkia] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-feh3zfdkia] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-feh3zfdkia] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-feh3zfdkia] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-feh3zfdkia] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-feh3zfdkia] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-feh3zfdkia] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-feh3zfdkia] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-feh3zfdkia] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-feh3zfdkia] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-feh3zfdkia] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-feh3zfdkia] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-feh3zfdkia] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-feh3zfdkia] { background:rgba(79,70,229,.18); color:#c7d2fe; }

/* ── Reporte específico ── */
.rep-filters[b-feh3zfdkia] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.75rem; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem 1rem; margin-bottom:1rem; }

.rep-kpis[b-feh3zfdkia] { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; margin-bottom:1rem; }
.rep-kpi[b-feh3zfdkia] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#4f46e5); border-radius:.55rem; padding:.65rem .85rem; }
.rep-kpi-label[b-feh3zfdkia] { font-size:.66rem; font-weight:700; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); letter-spacing:.04em; margin-bottom:.2rem; }
.rep-kpi-value[b-feh3zfdkia] { font-size:1.1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.rep-kpi-ok[b-feh3zfdkia]     { border-left-color:#16a34a; }
.rep-kpi-warn[b-feh3zfdkia]   { border-left-color:#d97706; }
.rep-kpi-danger[b-feh3zfdkia] { border-left-color:#dc2626; }
[data-mode="dark"] .rep-kpi[b-feh3zfdkia] { background:var(--rg-bg-card); }

.cat-badge[b-feh3zfdkia] { display:inline-flex; align-items:center; justify-content:center; min-width:1.7rem; padding:.1rem .45rem; border-radius:1rem; font-size:.72rem; font-weight:700; }
.cat-a[b-feh3zfdkia]  { background:rgba(22,163,74,.12);  color:#166534; }
.cat-b[b-feh3zfdkia]  { background:rgba(217,119,6,.12);  color:#92400e; }
.cat-c[b-feh3zfdkia]  { background:rgba(234,88,12,.12);  color:#9a3412; }
.cat-d[b-feh3zfdkia]  { background:rgba(220,38,38,.10);  color:#991b1b; }
.cat-d1[b-feh3zfdkia] { background:rgba(220,38,38,.12);  color:#991b1b; }
.cat-d2[b-feh3zfdkia] { background:rgba(220,38,38,.18);  color:#7f1d1d; }
.cat-e[b-feh3zfdkia]  { background:rgba(127,29,29,.18);  color:#7f1d1d; }
[data-mode="dark"] .cat-a[b-feh3zfdkia]  { color:#86efac; }
[data-mode="dark"] .cat-b[b-feh3zfdkia]  { color:#fcd34d; }
[data-mode="dark"] .cat-c[b-feh3zfdkia]  { color:#fdba74; }
[data-mode="dark"] .cat-d[b-feh3zfdkia], [data-mode="dark"] .cat-d1[b-feh3zfdkia], [data-mode="dark"] .cat-d2[b-feh3zfdkia], [data-mode="dark"] .cat-e[b-feh3zfdkia] { color:#fca5a5; }

.rep-mini-info[b-feh3zfdkia] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:500; margin-left:.5rem; }
.rep-cliente[b-feh3zfdkia] { display:flex; align-items:center; gap:.4rem; }
.rep-cliente-id[b-feh3zfdkia] { font-size:.7rem; background:rgba(79,70,229,.08); color:var(--rg-accent,#4f46e5); padding:.05rem .35rem; border-radius:.3rem; }
[data-mode="dark"] .rep-cliente-id[b-feh3zfdkia] { color:#93c5fd; }

.rep-pager[b-feh3zfdkia] { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.5rem; margin-top:.5rem; }
.rep-pager-info[b-feh3zfdkia] { font-size:.78rem; color:var(--rg-text-muted,#94a3b8); }
.btn-sm[b-feh3zfdkia] { padding:.35rem .65rem; font-size:.75rem; }
.text-end[b-feh3zfdkia] { text-align:right; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprCastigoConfig.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ecbxp2ikbu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ecbxp2ikbu 0.3s ease-out; }
@keyframes slideUp-b-ecbxp2ikbu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ecbxp2ikbu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ecbxp2ikbu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ecbxp2ikbu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ecbxp2ikbu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ecbxp2ikbu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ecbxp2ikbu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ecbxp2ikbu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ecbxp2ikbu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ecbxp2ikbu] { filter: brightness(1.1); }
.btn-outline[b-ecbxp2ikbu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ecbxp2ikbu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ecbxp2ikbu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ecbxp2ikbu] { filter: brightness(1.1); }
.btn-icon[b-ecbxp2ikbu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ecbxp2ikbu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ecbxp2ikbu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ecbxp2ikbu] { color: #ef4444; }
.btn-delete:hover[b-ecbxp2ikbu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ecbxp2ikbu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ecbxp2ikbu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ecbxp2ikbu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ecbxp2ikbu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ecbxp2ikbu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ecbxp2ikbu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ecbxp2ikbu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ecbxp2ikbu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ecbxp2ikbu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ecbxp2ikbu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ecbxp2ikbu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ecbxp2ikbu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ecbxp2ikbu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ecbxp2ikbu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ecbxp2ikbu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ecbxp2ikbu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ecbxp2ikbu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ecbxp2ikbu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ecbxp2ikbu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ecbxp2ikbu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ecbxp2ikbu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ecbxp2ikbu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ecbxp2ikbu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ecbxp2ikbu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ecbxp2ikbu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ecbxp2ikbu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ecbxp2ikbu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ecbxp2ikbu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ecbxp2ikbu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ecbxp2ikbu] { display: block; }
.hide-on-cards[b-ecbxp2ikbu] { display: none !important; }
.show-on-cards[b-ecbxp2ikbu] { display: grid; }
.hide-on-grid[b-ecbxp2ikbu] { display: none !important; }

/* Badges */
.badge[b-ecbxp2ikbu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ecbxp2ikbu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ecbxp2ikbu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ecbxp2ikbu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ecbxp2ikbu] { text-align: center; }
.text-muted[b-ecbxp2ikbu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ecbxp2ikbu], .crud-empty-state[b-ecbxp2ikbu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ecbxp2ikbu] { font-size: 2rem; }
.crud-spinner[b-ecbxp2ikbu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ecbxp2ikbu 0.6s linear infinite; }
.crud-spinner-sm[b-ecbxp2ikbu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ecbxp2ikbu 0.6s linear infinite; }
@keyframes spin-b-ecbxp2ikbu { to { transform: rotate(360deg); } }
.spin[b-ecbxp2ikbu] { animation: spin-b-ecbxp2ikbu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ecbxp2ikbu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ecbxp2ikbu 0.15s ease-out; }
.modal-container[b-ecbxp2ikbu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ecbxp2ikbu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ecbxp2ikbu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-ecbxp2ikbu] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ecbxp2ikbu] { max-width: 420px; }
@keyframes fadeIn-b-ecbxp2ikbu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ecbxp2ikbu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ecbxp2ikbu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ecbxp2ikbu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ecbxp2ikbu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ecbxp2ikbu] { color: #dc2626; }
.modal-close[b-ecbxp2ikbu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ecbxp2ikbu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ecbxp2ikbu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ecbxp2ikbu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ecbxp2ikbu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ecbxp2ikbu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ecbxp2ikbu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ecbxp2ikbu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ecbxp2ikbu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ecbxp2ikbu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ecbxp2ikbu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ecbxp2ikbu] { flex: 2; }
.form-group label[b-ecbxp2ikbu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ecbxp2ikbu], .form-group select[b-ecbxp2ikbu], .form-textarea[b-ecbxp2ikbu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ecbxp2ikbu], .form-group select:focus[b-ecbxp2ikbu], .form-textarea:focus[b-ecbxp2ikbu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ecbxp2ikbu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ecbxp2ikbu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ecbxp2ikbu] { flex: 1; display: flex; align-items: center; }
.form-check[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ecbxp2ikbu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ecbxp2ikbu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ecbxp2ikbu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ecbxp2ikbu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ecbxp2ikbu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ecbxp2ikbu] { font-size: 3rem; }
.photo-placeholder span[b-ecbxp2ikbu] { font-size: 0.78rem; }
.photo-actions[b-ecbxp2ikbu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ecbxp2ikbu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-ecbxp2ikbu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ecbxp2ikbu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ecbxp2ikbu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ecbxp2ikbu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ecbxp2ikbu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ecbxp2ikbu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ecbxp2ikbu] { filter: brightness(1.15); transform: scale(1.05); }
[b-ecbxp2ikbu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ecbxp2ikbu] { padding: 0.75rem; }
    .crud-header[b-ecbxp2ikbu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ecbxp2ikbu] { font-size: 1.1rem; }
    .btn-text[b-ecbxp2ikbu] { display: none; }
    .form-row[b-ecbxp2ikbu] { flex-direction: column; }
    .form-row-4[b-ecbxp2ikbu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ecbxp2ikbu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ecbxp2ikbu] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ecbxp2ikbu] { padding: 0.75rem; }
    .modal-tabs[b-ecbxp2ikbu] { overflow-x: auto; }
    .modal-tab[b-ecbxp2ikbu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ecbxp2ikbu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ecbxp2ikbu] { display: grid !important; }
    .crud-cards-wrapper[b-ecbxp2ikbu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ecbxp2ikbu] { grid-template-columns: 1fr; }
    .card-details[b-ecbxp2ikbu] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-ecbxp2ikbu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ecbxp2ikbu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ecbxp2ikbu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ecbxp2ikbu] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-ecbxp2ikbu] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-ecbxp2ikbu] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-ecbxp2ikbu] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-ecbxp2ikbu] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-ecbxp2ikbu] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-ecbxp2ikbu] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-ecbxp2ikbu] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-ecbxp2ikbu] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-ecbxp2ikbu] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-ecbxp2ikbu] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-ecbxp2ikbu] { background:rgba(79,70,229,.18); color:#c7d2fe; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprClasificacionConfig.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-u3xaz5mluh] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-u3xaz5mluh 0.3s ease-out; }
@keyframes slideUp-b-u3xaz5mluh { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-u3xaz5mluh] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-u3xaz5mluh] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-u3xaz5mluh] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-u3xaz5mluh] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-u3xaz5mluh] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-u3xaz5mluh] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-u3xaz5mluh] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-u3xaz5mluh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-u3xaz5mluh] { filter: brightness(1.1); }
.btn-outline[b-u3xaz5mluh] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-u3xaz5mluh] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-u3xaz5mluh] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-u3xaz5mluh] { filter: brightness(1.1); }
.btn-icon[b-u3xaz5mluh] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-u3xaz5mluh] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-u3xaz5mluh] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-u3xaz5mluh] { color: #ef4444; }
.btn-delete:hover[b-u3xaz5mluh] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-u3xaz5mluh] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-u3xaz5mluh] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-u3xaz5mluh] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-u3xaz5mluh] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-u3xaz5mluh] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-u3xaz5mluh] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-u3xaz5mluh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-u3xaz5mluh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-u3xaz5mluh] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-u3xaz5mluh] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-u3xaz5mluh] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-u3xaz5mluh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-u3xaz5mluh] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-u3xaz5mluh] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-u3xaz5mluh] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-u3xaz5mluh] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-u3xaz5mluh] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-u3xaz5mluh] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-u3xaz5mluh] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-u3xaz5mluh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-u3xaz5mluh] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-u3xaz5mluh] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-u3xaz5mluh] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-u3xaz5mluh] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-u3xaz5mluh] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-u3xaz5mluh] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-u3xaz5mluh] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-u3xaz5mluh] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-u3xaz5mluh] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-u3xaz5mluh] { display: block; }
.hide-on-cards[b-u3xaz5mluh] { display: none !important; }
.show-on-cards[b-u3xaz5mluh] { display: grid; }
.hide-on-grid[b-u3xaz5mluh] { display: none !important; }

/* Badges */
.badge[b-u3xaz5mluh] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-u3xaz5mluh] { background: #ecfdf5; color: #065f46; }
.badge-no[b-u3xaz5mluh] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-u3xaz5mluh] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-u3xaz5mluh] { text-align: center; }
.text-muted[b-u3xaz5mluh] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-u3xaz5mluh], .crud-empty-state[b-u3xaz5mluh] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-u3xaz5mluh] { font-size: 2rem; }
.crud-spinner[b-u3xaz5mluh] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-u3xaz5mluh 0.6s linear infinite; }
.crud-spinner-sm[b-u3xaz5mluh] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-u3xaz5mluh 0.6s linear infinite; }
@keyframes spin-b-u3xaz5mluh { to { transform: rotate(360deg); } }
.spin[b-u3xaz5mluh] { animation: spin-b-u3xaz5mluh 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-u3xaz5mluh] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-u3xaz5mluh 0.15s ease-out; }
.modal-container[b-u3xaz5mluh] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-u3xaz5mluh] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-u3xaz5mluh 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-u3xaz5mluh] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-u3xaz5mluh] { max-width: 420px; }
@keyframes fadeIn-b-u3xaz5mluh { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-u3xaz5mluh { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-u3xaz5mluh] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-u3xaz5mluh] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-u3xaz5mluh] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-u3xaz5mluh] { color: #dc2626; }
.modal-close[b-u3xaz5mluh] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-u3xaz5mluh] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-u3xaz5mluh] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-u3xaz5mluh] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-u3xaz5mluh] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-u3xaz5mluh] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-u3xaz5mluh] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-u3xaz5mluh] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-u3xaz5mluh] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-u3xaz5mluh] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-u3xaz5mluh] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-u3xaz5mluh] { flex: 2; }
.form-group label[b-u3xaz5mluh] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-u3xaz5mluh], .form-group select[b-u3xaz5mluh], .form-textarea[b-u3xaz5mluh] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-u3xaz5mluh], .form-group select:focus[b-u3xaz5mluh], .form-textarea:focus[b-u3xaz5mluh] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-u3xaz5mluh] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-u3xaz5mluh] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-u3xaz5mluh] { flex: 1; display: flex; align-items: center; }
.form-check[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-u3xaz5mluh] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-u3xaz5mluh] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-u3xaz5mluh] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-u3xaz5mluh] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-u3xaz5mluh] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-u3xaz5mluh] { font-size: 3rem; }
.photo-placeholder span[b-u3xaz5mluh] { font-size: 0.78rem; }
.photo-actions[b-u3xaz5mluh] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-u3xaz5mluh] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-u3xaz5mluh] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-u3xaz5mluh] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-u3xaz5mluh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-u3xaz5mluh] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-u3xaz5mluh] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-u3xaz5mluh] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-u3xaz5mluh] { filter: brightness(1.15); transform: scale(1.05); }
[b-u3xaz5mluh] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-u3xaz5mluh] { padding: 0.75rem; }
    .crud-header[b-u3xaz5mluh] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-u3xaz5mluh] { font-size: 1.1rem; }
    .btn-text[b-u3xaz5mluh] { display: none; }
    .form-row[b-u3xaz5mluh] { flex-direction: column; }
    .form-row-4[b-u3xaz5mluh] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-u3xaz5mluh] { width: 98%; max-height: 95vh; }
    .modal-lg[b-u3xaz5mluh] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-u3xaz5mluh] { padding: 0.75rem; }
    .modal-tabs[b-u3xaz5mluh] { overflow-x: auto; }
    .modal-tab[b-u3xaz5mluh] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-u3xaz5mluh] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-u3xaz5mluh] { display: grid !important; }
    .crud-cards-wrapper[b-u3xaz5mluh] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-u3xaz5mluh] { grid-template-columns: 1fr; }
    .card-details[b-u3xaz5mluh] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-u3xaz5mluh] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-u3xaz5mluh] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-u3xaz5mluh] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-u3xaz5mluh] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-u3xaz5mluh] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-u3xaz5mluh] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-u3xaz5mluh] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-u3xaz5mluh] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-u3xaz5mluh] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-u3xaz5mluh] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-u3xaz5mluh] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-u3xaz5mluh] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-u3xaz5mluh] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-u3xaz5mluh] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-u3xaz5mluh] { background:rgba(79,70,229,.18); color:#c7d2fe; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprClasificacionReporte.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4mdpbwjkgp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4mdpbwjkgp 0.3s ease-out; }
@keyframes slideUp-b-4mdpbwjkgp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4mdpbwjkgp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4mdpbwjkgp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4mdpbwjkgp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4mdpbwjkgp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4mdpbwjkgp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4mdpbwjkgp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4mdpbwjkgp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4mdpbwjkgp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4mdpbwjkgp] { filter: brightness(1.1); }
.btn-outline[b-4mdpbwjkgp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4mdpbwjkgp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4mdpbwjkgp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4mdpbwjkgp] { filter: brightness(1.1); }
.btn-icon[b-4mdpbwjkgp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4mdpbwjkgp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4mdpbwjkgp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4mdpbwjkgp] { color: #ef4444; }
.btn-delete:hover[b-4mdpbwjkgp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4mdpbwjkgp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4mdpbwjkgp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4mdpbwjkgp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4mdpbwjkgp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4mdpbwjkgp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4mdpbwjkgp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4mdpbwjkgp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4mdpbwjkgp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4mdpbwjkgp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4mdpbwjkgp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4mdpbwjkgp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4mdpbwjkgp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4mdpbwjkgp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4mdpbwjkgp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4mdpbwjkgp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4mdpbwjkgp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4mdpbwjkgp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4mdpbwjkgp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4mdpbwjkgp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4mdpbwjkgp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4mdpbwjkgp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4mdpbwjkgp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4mdpbwjkgp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4mdpbwjkgp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4mdpbwjkgp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4mdpbwjkgp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4mdpbwjkgp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4mdpbwjkgp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4mdpbwjkgp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4mdpbwjkgp] { display: block; }
.hide-on-cards[b-4mdpbwjkgp] { display: none !important; }
.show-on-cards[b-4mdpbwjkgp] { display: grid; }
.hide-on-grid[b-4mdpbwjkgp] { display: none !important; }

/* Badges */
.badge[b-4mdpbwjkgp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4mdpbwjkgp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4mdpbwjkgp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4mdpbwjkgp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4mdpbwjkgp] { text-align: center; }
.text-muted[b-4mdpbwjkgp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4mdpbwjkgp], .crud-empty-state[b-4mdpbwjkgp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4mdpbwjkgp] { font-size: 2rem; }
.crud-spinner[b-4mdpbwjkgp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4mdpbwjkgp 0.6s linear infinite; }
.crud-spinner-sm[b-4mdpbwjkgp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4mdpbwjkgp 0.6s linear infinite; }
@keyframes spin-b-4mdpbwjkgp { to { transform: rotate(360deg); } }
.spin[b-4mdpbwjkgp] { animation: spin-b-4mdpbwjkgp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4mdpbwjkgp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4mdpbwjkgp 0.15s ease-out; }
.modal-container[b-4mdpbwjkgp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4mdpbwjkgp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4mdpbwjkgp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-4mdpbwjkgp] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4mdpbwjkgp] { max-width: 420px; }
@keyframes fadeIn-b-4mdpbwjkgp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4mdpbwjkgp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4mdpbwjkgp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4mdpbwjkgp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4mdpbwjkgp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4mdpbwjkgp] { color: #dc2626; }
.modal-close[b-4mdpbwjkgp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4mdpbwjkgp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4mdpbwjkgp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4mdpbwjkgp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4mdpbwjkgp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4mdpbwjkgp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4mdpbwjkgp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4mdpbwjkgp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4mdpbwjkgp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4mdpbwjkgp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4mdpbwjkgp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4mdpbwjkgp] { flex: 2; }
.form-group label[b-4mdpbwjkgp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4mdpbwjkgp], .form-group select[b-4mdpbwjkgp], .form-textarea[b-4mdpbwjkgp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4mdpbwjkgp], .form-group select:focus[b-4mdpbwjkgp], .form-textarea:focus[b-4mdpbwjkgp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4mdpbwjkgp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4mdpbwjkgp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4mdpbwjkgp] { flex: 1; display: flex; align-items: center; }
.form-check[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4mdpbwjkgp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4mdpbwjkgp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4mdpbwjkgp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4mdpbwjkgp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4mdpbwjkgp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4mdpbwjkgp] { font-size: 3rem; }
.photo-placeholder span[b-4mdpbwjkgp] { font-size: 0.78rem; }
.photo-actions[b-4mdpbwjkgp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4mdpbwjkgp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-4mdpbwjkgp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4mdpbwjkgp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4mdpbwjkgp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4mdpbwjkgp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4mdpbwjkgp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4mdpbwjkgp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4mdpbwjkgp] { filter: brightness(1.15); transform: scale(1.05); }
[b-4mdpbwjkgp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4mdpbwjkgp] { padding: 0.75rem; }
    .crud-header[b-4mdpbwjkgp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4mdpbwjkgp] { font-size: 1.1rem; }
    .btn-text[b-4mdpbwjkgp] { display: none; }
    .form-row[b-4mdpbwjkgp] { flex-direction: column; }
    .form-row-4[b-4mdpbwjkgp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4mdpbwjkgp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4mdpbwjkgp] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4mdpbwjkgp] { padding: 0.75rem; }
    .modal-tabs[b-4mdpbwjkgp] { overflow-x: auto; }
    .modal-tab[b-4mdpbwjkgp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4mdpbwjkgp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4mdpbwjkgp] { display: grid !important; }
    .crud-cards-wrapper[b-4mdpbwjkgp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4mdpbwjkgp] { grid-template-columns: 1fr; }
    .card-details[b-4mdpbwjkgp] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-4mdpbwjkgp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4mdpbwjkgp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4mdpbwjkgp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4mdpbwjkgp] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-4mdpbwjkgp] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-4mdpbwjkgp] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-4mdpbwjkgp] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-4mdpbwjkgp] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-4mdpbwjkgp] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-4mdpbwjkgp] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-4mdpbwjkgp] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-4mdpbwjkgp] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-4mdpbwjkgp] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-4mdpbwjkgp] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-4mdpbwjkgp] { background:rgba(79,70,229,.18); color:#c7d2fe; }

/* ── Reporte específico ── */
.rep-filters[b-4mdpbwjkgp] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.75rem; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem 1rem; margin-bottom:1rem; }

.rep-kpis[b-4mdpbwjkgp] { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; margin-bottom:1rem; }
.rep-kpi[b-4mdpbwjkgp] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#4f46e5); border-radius:.55rem; padding:.65rem .85rem; }
.rep-kpi-label[b-4mdpbwjkgp] { font-size:.66rem; font-weight:700; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); letter-spacing:.04em; margin-bottom:.2rem; }
.rep-kpi-value[b-4mdpbwjkgp] { font-size:1.1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.rep-kpi-ok[b-4mdpbwjkgp]     { border-left-color:#16a34a; }
.rep-kpi-warn[b-4mdpbwjkgp]   { border-left-color:#d97706; }
.rep-kpi-danger[b-4mdpbwjkgp] { border-left-color:#dc2626; }
[data-mode="dark"] .rep-kpi[b-4mdpbwjkgp] { background:var(--rg-bg-card); }

.cat-badge[b-4mdpbwjkgp] { display:inline-flex; align-items:center; justify-content:center; min-width:1.7rem; padding:.1rem .45rem; border-radius:1rem; font-size:.72rem; font-weight:700; }
.cat-a[b-4mdpbwjkgp]  { background:rgba(22,163,74,.12);  color:#166534; }
.cat-b[b-4mdpbwjkgp]  { background:rgba(217,119,6,.12);  color:#92400e; }
.cat-c[b-4mdpbwjkgp]  { background:rgba(234,88,12,.12);  color:#9a3412; }
.cat-d[b-4mdpbwjkgp]  { background:rgba(220,38,38,.10);  color:#991b1b; }
.cat-d1[b-4mdpbwjkgp] { background:rgba(220,38,38,.12);  color:#991b1b; }
.cat-d2[b-4mdpbwjkgp] { background:rgba(220,38,38,.18);  color:#7f1d1d; }
.cat-e[b-4mdpbwjkgp]  { background:rgba(127,29,29,.18);  color:#7f1d1d; }
[data-mode="dark"] .cat-a[b-4mdpbwjkgp]  { color:#86efac; }
[data-mode="dark"] .cat-b[b-4mdpbwjkgp]  { color:#fcd34d; }
[data-mode="dark"] .cat-c[b-4mdpbwjkgp]  { color:#fdba74; }
[data-mode="dark"] .cat-d[b-4mdpbwjkgp], [data-mode="dark"] .cat-d1[b-4mdpbwjkgp], [data-mode="dark"] .cat-d2[b-4mdpbwjkgp], [data-mode="dark"] .cat-e[b-4mdpbwjkgp] { color:#fca5a5; }

.rep-mini-info[b-4mdpbwjkgp] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:500; margin-left:.5rem; }
.rep-cliente[b-4mdpbwjkgp] { display:flex; align-items:center; gap:.4rem; }
.rep-cliente-id[b-4mdpbwjkgp] { font-size:.7rem; background:rgba(79,70,229,.08); color:var(--rg-accent,#4f46e5); padding:.05rem .35rem; border-radius:.3rem; }
[data-mode="dark"] .rep-cliente-id[b-4mdpbwjkgp] { color:#93c5fd; }

.rep-pager[b-4mdpbwjkgp] { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.5rem; margin-top:.5rem; }
.rep-pager-info[b-4mdpbwjkgp] { font-size:.78rem; color:var(--rg-text-muted,#94a3b8); }
.btn-sm[b-4mdpbwjkgp] { padding:.35rem .65rem; font-size:.75rem; }
.text-end[b-4mdpbwjkgp] { text-align:right; }

/* ── Alerta inconsistencia capital ── */
.row-inconsistencia[b-4mdpbwjkgp] { background:rgba(220,38,38,.06); }
[data-mode="dark"] .row-inconsistencia[b-4mdpbwjkgp] { background:rgba(220,38,38,.10); }
.alert-icon[b-4mdpbwjkgp] { cursor:help; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmprestamos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-7hp4bj5zyg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-7hp4bj5zyg 0.3s ease-out; }
@keyframes slideUp-b-7hp4bj5zyg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-7hp4bj5zyg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7hp4bj5zyg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7hp4bj5zyg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-7hp4bj5zyg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-7hp4bj5zyg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-7hp4bj5zyg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7hp4bj5zyg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7hp4bj5zyg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7hp4bj5zyg] { filter: brightness(1.1); }
.btn-outline[b-7hp4bj5zyg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-7hp4bj5zyg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-7hp4bj5zyg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-7hp4bj5zyg] { filter: brightness(1.1); }
.btn-icon[b-7hp4bj5zyg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-7hp4bj5zyg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7hp4bj5zyg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7hp4bj5zyg] { color: #ef4444; }
.btn-delete:hover[b-7hp4bj5zyg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-7hp4bj5zyg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7hp4bj5zyg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7hp4bj5zyg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7hp4bj5zyg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-7hp4bj5zyg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-7hp4bj5zyg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-7hp4bj5zyg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-7hp4bj5zyg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-7hp4bj5zyg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-7hp4bj5zyg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7hp4bj5zyg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7hp4bj5zyg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7hp4bj5zyg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-7hp4bj5zyg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-7hp4bj5zyg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-7hp4bj5zyg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-7hp4bj5zyg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-7hp4bj5zyg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-7hp4bj5zyg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-7hp4bj5zyg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-7hp4bj5zyg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-7hp4bj5zyg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-7hp4bj5zyg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-7hp4bj5zyg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-7hp4bj5zyg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-7hp4bj5zyg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-7hp4bj5zyg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-7hp4bj5zyg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-7hp4bj5zyg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-7hp4bj5zyg] { display: block; }
.hide-on-cards[b-7hp4bj5zyg] { display: none !important; }
.show-on-cards[b-7hp4bj5zyg] { display: grid; }
.hide-on-grid[b-7hp4bj5zyg] { display: none !important; }

/* Badges */
.badge[b-7hp4bj5zyg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-7hp4bj5zyg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7hp4bj5zyg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-7hp4bj5zyg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-7hp4bj5zyg] { text-align: center; }
.text-muted[b-7hp4bj5zyg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-7hp4bj5zyg], .crud-empty-state[b-7hp4bj5zyg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-7hp4bj5zyg] { font-size: 2rem; }
.crud-spinner[b-7hp4bj5zyg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-7hp4bj5zyg 0.6s linear infinite; }
.crud-spinner-sm[b-7hp4bj5zyg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-7hp4bj5zyg 0.6s linear infinite; }
@keyframes spin-b-7hp4bj5zyg { to { transform: rotate(360deg); } }
.spin[b-7hp4bj5zyg] { animation: spin-b-7hp4bj5zyg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-7hp4bj5zyg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-7hp4bj5zyg 0.15s ease-out; }
.modal-container[b-7hp4bj5zyg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7hp4bj5zyg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-7hp4bj5zyg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-7hp4bj5zyg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-7hp4bj5zyg] { max-width: 420px; }
@keyframes fadeIn-b-7hp4bj5zyg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-7hp4bj5zyg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-7hp4bj5zyg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-7hp4bj5zyg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-7hp4bj5zyg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-7hp4bj5zyg] { color: #dc2626; }
.modal-close[b-7hp4bj5zyg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7hp4bj5zyg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-7hp4bj5zyg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-7hp4bj5zyg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-7hp4bj5zyg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-7hp4bj5zyg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-7hp4bj5zyg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-7hp4bj5zyg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-7hp4bj5zyg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-7hp4bj5zyg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-7hp4bj5zyg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-7hp4bj5zyg] { flex: 2; }
.form-group label[b-7hp4bj5zyg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-7hp4bj5zyg], .form-group select[b-7hp4bj5zyg], .form-textarea[b-7hp4bj5zyg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-7hp4bj5zyg], .form-group select:focus[b-7hp4bj5zyg], .form-textarea:focus[b-7hp4bj5zyg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-7hp4bj5zyg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-7hp4bj5zyg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-7hp4bj5zyg] { flex: 1; display: flex; align-items: center; }
.form-check[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-7hp4bj5zyg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-7hp4bj5zyg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-7hp4bj5zyg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-7hp4bj5zyg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-7hp4bj5zyg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-7hp4bj5zyg] { font-size: 3rem; }
.photo-placeholder span[b-7hp4bj5zyg] { font-size: 0.78rem; }
.photo-actions[b-7hp4bj5zyg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-7hp4bj5zyg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-7hp4bj5zyg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-7hp4bj5zyg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-7hp4bj5zyg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-7hp4bj5zyg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-7hp4bj5zyg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-7hp4bj5zyg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-7hp4bj5zyg] { filter: brightness(1.15); transform: scale(1.05); }
[b-7hp4bj5zyg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-7hp4bj5zyg] { padding: 0.75rem; }
    .crud-header[b-7hp4bj5zyg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-7hp4bj5zyg] { font-size: 1.1rem; }
    .btn-text[b-7hp4bj5zyg] { display: none; }
    .form-row[b-7hp4bj5zyg] { flex-direction: column; }
    .form-row-4[b-7hp4bj5zyg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-7hp4bj5zyg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-7hp4bj5zyg] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-7hp4bj5zyg] { padding: 0.75rem; }
    .modal-tabs[b-7hp4bj5zyg] { overflow-x: auto; }
    .modal-tab[b-7hp4bj5zyg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-7hp4bj5zyg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-7hp4bj5zyg] { display: grid !important; }
    .crud-cards-wrapper[b-7hp4bj5zyg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-7hp4bj5zyg] { grid-template-columns: 1fr; }
    .card-details[b-7hp4bj5zyg] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-7hp4bj5zyg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-7hp4bj5zyg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-7hp4bj5zyg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-7hp4bj5zyg] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmproducto.razor.rz.scp.css */
/* ============================================================
   Productos de Préstamos — Estilos CRUD estándar
   Copiado del canónico Frmclientes.razor.css
   ============================================================ */

.crud-container[b-roo5xmqv5r] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-roo5xmqv5r 0.3s ease-out; }
@keyframes slideUp-b-roo5xmqv5r { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-roo5xmqv5r] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-roo5xmqv5r] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-roo5xmqv5r] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-roo5xmqv5r] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-roo5xmqv5r] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-roo5xmqv5r] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-roo5xmqv5r] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-roo5xmqv5r] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-roo5xmqv5r] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-roo5xmqv5r] { filter: brightness(1.1); }
.btn-outline[b-roo5xmqv5r] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-roo5xmqv5r] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-roo5xmqv5r] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-roo5xmqv5r] { filter: brightness(1.1); }
.btn-icon[b-roo5xmqv5r] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-roo5xmqv5r] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-roo5xmqv5r] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-roo5xmqv5r] { color: #ef4444; }
.btn-delete:hover[b-roo5xmqv5r] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-roo5xmqv5r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-roo5xmqv5r] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-roo5xmqv5r] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-roo5xmqv5r] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-roo5xmqv5r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-roo5xmqv5r] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-roo5xmqv5r] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-roo5xmqv5r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-roo5xmqv5r] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-roo5xmqv5r] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-roo5xmqv5r] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-roo5xmqv5r] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-roo5xmqv5r] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-roo5xmqv5r] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-roo5xmqv5r] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-roo5xmqv5r] { width: 80px; text-align: center; white-space: nowrap; }

/* Icono producto (avatar columna) */
.producto-icon-sm[b-roo5xmqv5r] {
    width: 32px; height: 32px; border-radius: 6px;
    background: rgba(25, 118, 210, 0.1);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.producto-icon-sm i[b-roo5xmqv5r] { color: #1976d2; font-size: 1rem; }
[data-mode="dark"] .producto-icon-sm[b-roo5xmqv5r] { background: rgba(25, 118, 210, 0.18); }
[data-mode="dark"] .producto-icon-sm i[b-roo5xmqv5r] { color: #90caf9; }

/* Badges */
.badge[b-roo5xmqv5r] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-roo5xmqv5r] { background: #ecfdf5; color: #065f46; }
.badge-no[b-roo5xmqv5r] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-roo5xmqv5r] { background: rgba(34,197,94,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-roo5xmqv5r] { background: rgba(100,116,139,0.15); color: #94a3b8; }

/* Utilities */
.font-mono[b-roo5xmqv5r] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-roo5xmqv5r] { text-align: center; }
.text-muted[b-roo5xmqv5r] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-roo5xmqv5r], .crud-empty-state[b-roo5xmqv5r] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-roo5xmqv5r] { font-size: 2.5rem; opacity: 0.4; }
.crud-spinner[b-roo5xmqv5r] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-roo5xmqv5r 0.6s linear infinite; }
.crud-spinner-sm[b-roo5xmqv5r] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-roo5xmqv5r 0.6s linear infinite; }
@keyframes spin-b-roo5xmqv5r { to { transform: rotate(360deg); } }
.spin[b-roo5xmqv5r] { animation: spin-b-roo5xmqv5r 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-roo5xmqv5r] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-roo5xmqv5r 0.15s ease-out; }
.modal-container[b-roo5xmqv5r] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-roo5xmqv5r] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-roo5xmqv5r 0.2s ease-out; }
.modal-sm[b-roo5xmqv5r] { max-width: 420px; }
@keyframes fadeIn-b-roo5xmqv5r { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-roo5xmqv5r { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-roo5xmqv5r] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-roo5xmqv5r] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-roo5xmqv5r] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-roo5xmqv5r] { color: #dc2626; }
[data-mode="dark"] .modal-header-danger h2[b-roo5xmqv5r] { color: #f87171; }
.modal-close[b-roo5xmqv5r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-roo5xmqv5r] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-roo5xmqv5r] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-roo5xmqv5r] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-roo5xmqv5r] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-roo5xmqv5r] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-roo5xmqv5r] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-roo5xmqv5r], .form-group select[b-roo5xmqv5r] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-roo5xmqv5r], .form-group select:focus[b-roo5xmqv5r] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-roo5xmqv5r] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

/* Modal grande para producto */
.modal-lg[b-roo5xmqv5r] { max-width: 880px; }

/* Boton pequeño dentro de filas del grid contable */
.btn-sm[b-roo5xmqv5r] { padding: 0.3rem 0.55rem; font-size: 0.72rem; }

/* Grid contable dentro del modal de producto */
.prod-grid-wrap[b-roo5xmqv5r] {
    margin-top: 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--rg-bg-card, #fff);
}
.prod-grid[b-roo5xmqv5r] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.prod-grid th[b-roo5xmqv5r] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    text-align: left;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.prod-grid td[b-roo5xmqv5r] {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
}
.prod-grid tbody tr:last-child td[b-roo5xmqv5r] { border-bottom: none; }
.prod-grid tbody tr:hover[b-roo5xmqv5r] { background: var(--rg-bg-hover, #f8fafc); }
.prod-cell-lookup[b-roo5xmqv5r] { display: flex; flex-direction: column; min-height: 1.6rem; }
.prod-cell-id[b-roo5xmqv5r] { font-weight: 600; color: var(--rg-text-primary, #1e293b); }
.prod-cell-desc[b-roo5xmqv5r] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-roo5xmqv5r] { padding: 0.75rem; }
    .crud-header[b-roo5xmqv5r] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-roo5xmqv5r] { font-size: 1.1rem; }
    .btn-text[b-roo5xmqv5r] { display: none; }
    .form-row[b-roo5xmqv5r] { flex-direction: column; }
    .modal-dialog[b-roo5xmqv5r] { width: 98%; max-height: 95vh; }
    .modal-body[b-roo5xmqv5r] { padding: 0.75rem; }
    .prod-grid[b-roo5xmqv5r] { font-size: 0.7rem; }
    .prod-grid th[b-roo5xmqv5r], .prod-grid td[b-roo5xmqv5r] { padding: 0.35rem 0.5rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-roo5xmqv5r] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-roo5xmqv5r] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-roo5xmqv5r] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-roo5xmqv5r] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmprpresupuestoyingreso.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-106cvol6xo] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-106cvol6xo 0.3s ease-out; }
@keyframes slideUp-b-106cvol6xo { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-106cvol6xo] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-106cvol6xo] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-106cvol6xo] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-106cvol6xo] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-106cvol6xo] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-106cvol6xo] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-106cvol6xo] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-106cvol6xo] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-106cvol6xo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-106cvol6xo] { filter: brightness(1.1); }
.btn-outline[b-106cvol6xo] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-106cvol6xo] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-106cvol6xo] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-106cvol6xo] { filter: brightness(1.1); }
.btn-icon[b-106cvol6xo] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-106cvol6xo] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-106cvol6xo] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-106cvol6xo] { color: #ef4444; }
.btn-delete:hover[b-106cvol6xo] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-106cvol6xo] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-106cvol6xo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-106cvol6xo] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-106cvol6xo] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-106cvol6xo] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-106cvol6xo] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-106cvol6xo] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-106cvol6xo] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-106cvol6xo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-106cvol6xo] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-106cvol6xo] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-106cvol6xo] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-106cvol6xo] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-106cvol6xo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-106cvol6xo] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-106cvol6xo] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-106cvol6xo] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-106cvol6xo] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-106cvol6xo] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-106cvol6xo] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-106cvol6xo] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-106cvol6xo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-106cvol6xo] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-106cvol6xo] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-106cvol6xo] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-106cvol6xo] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-106cvol6xo] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-106cvol6xo] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-106cvol6xo] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-106cvol6xo] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-106cvol6xo] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-106cvol6xo] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-106cvol6xo] { display: block; }
.hide-on-cards[b-106cvol6xo] { display: none !important; }
.show-on-cards[b-106cvol6xo] { display: grid; }
.hide-on-grid[b-106cvol6xo] { display: none !important; }

/* Badges */
.badge[b-106cvol6xo] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-106cvol6xo] { background: #ecfdf5; color: #065f46; }
.badge-no[b-106cvol6xo] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-106cvol6xo] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-106cvol6xo] { text-align: center; }
.text-muted[b-106cvol6xo] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-106cvol6xo], .crud-empty-state[b-106cvol6xo] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-106cvol6xo] { font-size: 2rem; }
.crud-spinner[b-106cvol6xo] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-106cvol6xo 0.6s linear infinite; }
.crud-spinner-sm[b-106cvol6xo] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-106cvol6xo 0.6s linear infinite; }
@keyframes spin-b-106cvol6xo { to { transform: rotate(360deg); } }
.spin[b-106cvol6xo] { animation: spin-b-106cvol6xo 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-106cvol6xo] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-106cvol6xo 0.15s ease-out; }
.modal-container[b-106cvol6xo] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-106cvol6xo] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-106cvol6xo 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-106cvol6xo] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-106cvol6xo] { max-width: 420px; }
@keyframes fadeIn-b-106cvol6xo { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-106cvol6xo { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-106cvol6xo] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-106cvol6xo] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-106cvol6xo] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-106cvol6xo] { color: #dc2626; }
.modal-close[b-106cvol6xo] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-106cvol6xo] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-106cvol6xo] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-106cvol6xo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-106cvol6xo] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-106cvol6xo] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-106cvol6xo] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-106cvol6xo] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-106cvol6xo] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-106cvol6xo] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-106cvol6xo] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-106cvol6xo] { flex: 2; }
.form-group label[b-106cvol6xo] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-106cvol6xo], .form-group select[b-106cvol6xo], .form-textarea[b-106cvol6xo] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-106cvol6xo], .form-group select:focus[b-106cvol6xo], .form-textarea:focus[b-106cvol6xo] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-106cvol6xo] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-106cvol6xo] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-106cvol6xo] { flex: 1; display: flex; align-items: center; }
.form-check[b-106cvol6xo] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-106cvol6xo] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-106cvol6xo] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-106cvol6xo] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-106cvol6xo] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-106cvol6xo] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-106cvol6xo] { font-size: 3rem; }
.photo-placeholder span[b-106cvol6xo] { font-size: 0.78rem; }
.photo-actions[b-106cvol6xo] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-106cvol6xo] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-106cvol6xo] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-106cvol6xo] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-106cvol6xo] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-106cvol6xo] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-106cvol6xo] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-106cvol6xo] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-106cvol6xo] { filter: brightness(1.15); transform: scale(1.05); }
[b-106cvol6xo] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-106cvol6xo] { padding: 0.75rem; }
    .crud-header[b-106cvol6xo] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-106cvol6xo] { font-size: 1.1rem; }
    .btn-text[b-106cvol6xo] { display: none; }
    .form-row[b-106cvol6xo] { flex-direction: column; }
    .form-row-4[b-106cvol6xo] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-106cvol6xo] { width: 98%; max-height: 95vh; }
    .modal-lg[b-106cvol6xo] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-106cvol6xo] { padding: 0.75rem; }
    .modal-tabs[b-106cvol6xo] { overflow-x: auto; }
    .modal-tab[b-106cvol6xo] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-106cvol6xo] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-106cvol6xo] { display: grid !important; }
    .crud-cards-wrapper[b-106cvol6xo] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-106cvol6xo] { grid-template-columns: 1fr; }
    .card-details[b-106cvol6xo] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-106cvol6xo] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-106cvol6xo] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-106cvol6xo] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-106cvol6xo] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprProvisionMensual.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-c2u0ujcf8h] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c2u0ujcf8h 0.3s ease-out; }
@keyframes slideUp-b-c2u0ujcf8h { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-c2u0ujcf8h] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c2u0ujcf8h] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c2u0ujcf8h] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c2u0ujcf8h] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c2u0ujcf8h] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-c2u0ujcf8h] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c2u0ujcf8h] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c2u0ujcf8h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c2u0ujcf8h] { filter: brightness(1.1); }
.btn-outline[b-c2u0ujcf8h] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c2u0ujcf8h] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-c2u0ujcf8h] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-c2u0ujcf8h] { filter: brightness(1.1); }
.btn-icon[b-c2u0ujcf8h] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-c2u0ujcf8h] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-c2u0ujcf8h] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-c2u0ujcf8h] { color: #ef4444; }
.btn-delete:hover[b-c2u0ujcf8h] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-c2u0ujcf8h] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c2u0ujcf8h] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-c2u0ujcf8h] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-c2u0ujcf8h] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-c2u0ujcf8h] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-c2u0ujcf8h] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-c2u0ujcf8h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-c2u0ujcf8h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-c2u0ujcf8h] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-c2u0ujcf8h] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c2u0ujcf8h] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c2u0ujcf8h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-c2u0ujcf8h] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c2u0ujcf8h] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-c2u0ujcf8h] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-c2u0ujcf8h] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-c2u0ujcf8h] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-c2u0ujcf8h] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-c2u0ujcf8h] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-c2u0ujcf8h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-c2u0ujcf8h] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-c2u0ujcf8h] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-c2u0ujcf8h] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-c2u0ujcf8h] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-c2u0ujcf8h] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-c2u0ujcf8h] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-c2u0ujcf8h] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-c2u0ujcf8h] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-c2u0ujcf8h] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-c2u0ujcf8h] { display: block; }
.hide-on-cards[b-c2u0ujcf8h] { display: none !important; }
.show-on-cards[b-c2u0ujcf8h] { display: grid; }
.hide-on-grid[b-c2u0ujcf8h] { display: none !important; }

/* Badges */
.badge[b-c2u0ujcf8h] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-c2u0ujcf8h] { background: #ecfdf5; color: #065f46; }
.badge-no[b-c2u0ujcf8h] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-c2u0ujcf8h] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-c2u0ujcf8h] { text-align: center; }
.text-muted[b-c2u0ujcf8h] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-c2u0ujcf8h], .crud-empty-state[b-c2u0ujcf8h] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c2u0ujcf8h] { font-size: 2rem; }
.crud-spinner[b-c2u0ujcf8h] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-c2u0ujcf8h 0.6s linear infinite; }
.crud-spinner-sm[b-c2u0ujcf8h] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-c2u0ujcf8h 0.6s linear infinite; }
@keyframes spin-b-c2u0ujcf8h { to { transform: rotate(360deg); } }
.spin[b-c2u0ujcf8h] { animation: spin-b-c2u0ujcf8h 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-c2u0ujcf8h] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-c2u0ujcf8h 0.15s ease-out; }
.modal-container[b-c2u0ujcf8h] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-c2u0ujcf8h] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-c2u0ujcf8h 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-c2u0ujcf8h] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-c2u0ujcf8h] { max-width: 420px; }
@keyframes fadeIn-b-c2u0ujcf8h { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-c2u0ujcf8h { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-c2u0ujcf8h] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-c2u0ujcf8h] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-c2u0ujcf8h] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-c2u0ujcf8h] { color: #dc2626; }
.modal-close[b-c2u0ujcf8h] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-c2u0ujcf8h] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-c2u0ujcf8h] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-c2u0ujcf8h] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-c2u0ujcf8h] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-c2u0ujcf8h] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-c2u0ujcf8h] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-c2u0ujcf8h] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-c2u0ujcf8h] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-c2u0ujcf8h] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-c2u0ujcf8h] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-c2u0ujcf8h] { flex: 2; }
.form-group label[b-c2u0ujcf8h] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-c2u0ujcf8h], .form-group select[b-c2u0ujcf8h], .form-textarea[b-c2u0ujcf8h] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-c2u0ujcf8h], .form-group select:focus[b-c2u0ujcf8h], .form-textarea:focus[b-c2u0ujcf8h] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-c2u0ujcf8h] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-c2u0ujcf8h] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-c2u0ujcf8h] { flex: 1; display: flex; align-items: center; }
.form-check[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-c2u0ujcf8h] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-c2u0ujcf8h] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-c2u0ujcf8h] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-c2u0ujcf8h] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-c2u0ujcf8h] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-c2u0ujcf8h] { font-size: 3rem; }
.photo-placeholder span[b-c2u0ujcf8h] { font-size: 0.78rem; }
.photo-actions[b-c2u0ujcf8h] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-c2u0ujcf8h] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-c2u0ujcf8h] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-c2u0ujcf8h] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-c2u0ujcf8h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-c2u0ujcf8h] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-c2u0ujcf8h] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-c2u0ujcf8h] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-c2u0ujcf8h] { filter: brightness(1.15); transform: scale(1.05); }
[b-c2u0ujcf8h] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-c2u0ujcf8h] { padding: 0.75rem; }
    .crud-header[b-c2u0ujcf8h] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-c2u0ujcf8h] { font-size: 1.1rem; }
    .btn-text[b-c2u0ujcf8h] { display: none; }
    .form-row[b-c2u0ujcf8h] { flex-direction: column; }
    .form-row-4[b-c2u0ujcf8h] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-c2u0ujcf8h] { width: 98%; max-height: 95vh; }
    .modal-lg[b-c2u0ujcf8h] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-c2u0ujcf8h] { padding: 0.75rem; }
    .modal-tabs[b-c2u0ujcf8h] { overflow-x: auto; }
    .modal-tab[b-c2u0ujcf8h] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-c2u0ujcf8h] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-c2u0ujcf8h] { display: grid !important; }
    .crud-cards-wrapper[b-c2u0ujcf8h] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-c2u0ujcf8h] { grid-template-columns: 1fr; }
    .card-details[b-c2u0ujcf8h] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-c2u0ujcf8h] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-c2u0ujcf8h] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-c2u0ujcf8h] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-c2u0ujcf8h] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-c2u0ujcf8h] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-c2u0ujcf8h] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-c2u0ujcf8h] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-c2u0ujcf8h] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-c2u0ujcf8h] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-c2u0ujcf8h] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-c2u0ujcf8h] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-c2u0ujcf8h] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-c2u0ujcf8h] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-c2u0ujcf8h] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-c2u0ujcf8h] { background:rgba(79,70,229,.18); color:#c7d2fe; }

/* ── Reporte específico ── */
.rep-filters[b-c2u0ujcf8h] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.75rem; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem 1rem; margin-bottom:1rem; }

.rep-kpis[b-c2u0ujcf8h] { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; margin-bottom:1rem; }
.rep-kpi[b-c2u0ujcf8h] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#4f46e5); border-radius:.55rem; padding:.65rem .85rem; }
.rep-kpi-label[b-c2u0ujcf8h] { font-size:.66rem; font-weight:700; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); letter-spacing:.04em; margin-bottom:.2rem; }
.rep-kpi-value[b-c2u0ujcf8h] { font-size:1.1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.rep-kpi-ok[b-c2u0ujcf8h]     { border-left-color:#16a34a; }
.rep-kpi-warn[b-c2u0ujcf8h]   { border-left-color:#d97706; }
.rep-kpi-danger[b-c2u0ujcf8h] { border-left-color:#dc2626; }
[data-mode="dark"] .rep-kpi[b-c2u0ujcf8h] { background:var(--rg-bg-card); }

.cat-badge[b-c2u0ujcf8h] { display:inline-flex; align-items:center; justify-content:center; min-width:1.7rem; padding:.1rem .45rem; border-radius:1rem; font-size:.72rem; font-weight:700; }
.cat-a[b-c2u0ujcf8h]  { background:rgba(22,163,74,.12);  color:#166534; }
.cat-b[b-c2u0ujcf8h]  { background:rgba(217,119,6,.12);  color:#92400e; }
.cat-c[b-c2u0ujcf8h]  { background:rgba(234,88,12,.12);  color:#9a3412; }
.cat-d[b-c2u0ujcf8h]  { background:rgba(220,38,38,.10);  color:#991b1b; }
.cat-d1[b-c2u0ujcf8h] { background:rgba(220,38,38,.12);  color:#991b1b; }
.cat-d2[b-c2u0ujcf8h] { background:rgba(220,38,38,.18);  color:#7f1d1d; }
.cat-e[b-c2u0ujcf8h]  { background:rgba(127,29,29,.18);  color:#7f1d1d; }
[data-mode="dark"] .cat-a[b-c2u0ujcf8h]  { color:#86efac; }
[data-mode="dark"] .cat-b[b-c2u0ujcf8h]  { color:#fcd34d; }
[data-mode="dark"] .cat-c[b-c2u0ujcf8h]  { color:#fdba74; }
[data-mode="dark"] .cat-d[b-c2u0ujcf8h], [data-mode="dark"] .cat-d1[b-c2u0ujcf8h], [data-mode="dark"] .cat-d2[b-c2u0ujcf8h], [data-mode="dark"] .cat-e[b-c2u0ujcf8h] { color:#fca5a5; }

.rep-mini-info[b-c2u0ujcf8h] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:500; margin-left:.5rem; }
.rep-cliente[b-c2u0ujcf8h] { display:flex; align-items:center; gap:.4rem; }
.rep-cliente-id[b-c2u0ujcf8h] { font-size:.7rem; background:rgba(79,70,229,.08); color:var(--rg-accent,#4f46e5); padding:.05rem .35rem; border-radius:.3rem; }
[data-mode="dark"] .rep-cliente-id[b-c2u0ujcf8h] { color:#93c5fd; }

.rep-pager[b-c2u0ujcf8h] { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.5rem; margin-top:.5rem; }
.rep-pager-info[b-c2u0ujcf8h] { font-size:.78rem; color:var(--rg-text-muted,#94a3b8); }
.btn-sm[b-c2u0ujcf8h] { padding:.35rem .65rem; font-size:.75rem; }
.text-end[b-c2u0ujcf8h] { text-align:right; }

/* ── Provisión específico ── */
.cfg-mini-input[b-c2u0ujcf8h] { padding:.25rem .4rem; font-size:.74rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.3rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); width:100%; max-width:130px; font-family:'Cascadia Code',monospace; }
.ajuste-pos[b-c2u0ujcf8h] { color:#dc2626; font-weight:700; }
.ajuste-neg[b-c2u0ujcf8h] { color:#16a34a; font-weight:700; }
[data-mode="dark"] .ajuste-pos[b-c2u0ujcf8h] { color:#fca5a5; }
[data-mode="dark"] .ajuste-neg[b-c2u0ujcf8h] { color:#86efac; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprSugerirCastigos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-kfjiecogvn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-kfjiecogvn 0.3s ease-out; }
@keyframes slideUp-b-kfjiecogvn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-kfjiecogvn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-kfjiecogvn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-kfjiecogvn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-kfjiecogvn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-kfjiecogvn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-kfjiecogvn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-kfjiecogvn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-kfjiecogvn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-kfjiecogvn] { filter: brightness(1.1); }
.btn-outline[b-kfjiecogvn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-kfjiecogvn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-kfjiecogvn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-kfjiecogvn] { filter: brightness(1.1); }
.btn-icon[b-kfjiecogvn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-kfjiecogvn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-kfjiecogvn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-kfjiecogvn] { color: #ef4444; }
.btn-delete:hover[b-kfjiecogvn] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-kfjiecogvn] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-kfjiecogvn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-kfjiecogvn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-kfjiecogvn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-kfjiecogvn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-kfjiecogvn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-kfjiecogvn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-kfjiecogvn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-kfjiecogvn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-kfjiecogvn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-kfjiecogvn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-kfjiecogvn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-kfjiecogvn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-kfjiecogvn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-kfjiecogvn] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-kfjiecogvn] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-kfjiecogvn] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-kfjiecogvn] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-kfjiecogvn] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-kfjiecogvn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-kfjiecogvn] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-kfjiecogvn] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-kfjiecogvn] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-kfjiecogvn] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-kfjiecogvn] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-kfjiecogvn] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-kfjiecogvn] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-kfjiecogvn] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-kfjiecogvn] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-kfjiecogvn] { display: block; }
.hide-on-cards[b-kfjiecogvn] { display: none !important; }
.show-on-cards[b-kfjiecogvn] { display: grid; }
.hide-on-grid[b-kfjiecogvn] { display: none !important; }

/* Badges */
.badge[b-kfjiecogvn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-kfjiecogvn] { background: #ecfdf5; color: #065f46; }
.badge-no[b-kfjiecogvn] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-kfjiecogvn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-kfjiecogvn] { text-align: center; }
.text-muted[b-kfjiecogvn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-kfjiecogvn], .crud-empty-state[b-kfjiecogvn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-kfjiecogvn] { font-size: 2rem; }
.crud-spinner[b-kfjiecogvn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-kfjiecogvn 0.6s linear infinite; }
.crud-spinner-sm[b-kfjiecogvn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-kfjiecogvn 0.6s linear infinite; }
@keyframes spin-b-kfjiecogvn { to { transform: rotate(360deg); } }
.spin[b-kfjiecogvn] { animation: spin-b-kfjiecogvn 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-kfjiecogvn] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-kfjiecogvn 0.15s ease-out; }
.modal-container[b-kfjiecogvn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-kfjiecogvn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-kfjiecogvn 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-kfjiecogvn] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-kfjiecogvn] { max-width: 420px; }
@keyframes fadeIn-b-kfjiecogvn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-kfjiecogvn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-kfjiecogvn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-kfjiecogvn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-kfjiecogvn] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-kfjiecogvn] { color: #dc2626; }
.modal-close[b-kfjiecogvn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-kfjiecogvn] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-kfjiecogvn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-kfjiecogvn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-kfjiecogvn] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-kfjiecogvn] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-kfjiecogvn] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-kfjiecogvn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-kfjiecogvn] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-kfjiecogvn] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-kfjiecogvn] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-kfjiecogvn] { flex: 2; }
.form-group label[b-kfjiecogvn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-kfjiecogvn], .form-group select[b-kfjiecogvn], .form-textarea[b-kfjiecogvn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-kfjiecogvn], .form-group select:focus[b-kfjiecogvn], .form-textarea:focus[b-kfjiecogvn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-kfjiecogvn] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-kfjiecogvn] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-kfjiecogvn] { flex: 1; display: flex; align-items: center; }
.form-check[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-kfjiecogvn] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-kfjiecogvn] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-kfjiecogvn] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-kfjiecogvn] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-kfjiecogvn] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-kfjiecogvn] { font-size: 3rem; }
.photo-placeholder span[b-kfjiecogvn] { font-size: 0.78rem; }
.photo-actions[b-kfjiecogvn] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-kfjiecogvn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-kfjiecogvn] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-kfjiecogvn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-kfjiecogvn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-kfjiecogvn] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-kfjiecogvn] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-kfjiecogvn] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-kfjiecogvn] { filter: brightness(1.15); transform: scale(1.05); }
[b-kfjiecogvn] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-kfjiecogvn] { padding: 0.75rem; }
    .crud-header[b-kfjiecogvn] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-kfjiecogvn] { font-size: 1.1rem; }
    .btn-text[b-kfjiecogvn] { display: none; }
    .form-row[b-kfjiecogvn] { flex-direction: column; }
    .form-row-4[b-kfjiecogvn] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-kfjiecogvn] { width: 98%; max-height: 95vh; }
    .modal-lg[b-kfjiecogvn] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-kfjiecogvn] { padding: 0.75rem; }
    .modal-tabs[b-kfjiecogvn] { overflow-x: auto; }
    .modal-tab[b-kfjiecogvn] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-kfjiecogvn] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-kfjiecogvn] { display: grid !important; }
    .crud-cards-wrapper[b-kfjiecogvn] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-kfjiecogvn] { grid-template-columns: 1fr; }
    .card-details[b-kfjiecogvn] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-kfjiecogvn] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-kfjiecogvn] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-kfjiecogvn] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-kfjiecogvn] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-kfjiecogvn] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-kfjiecogvn] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-kfjiecogvn] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-kfjiecogvn] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-kfjiecogvn] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-kfjiecogvn] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-kfjiecogvn] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-kfjiecogvn] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-kfjiecogvn] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-kfjiecogvn] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-kfjiecogvn] { background:rgba(79,70,229,.18); color:#c7d2fe; }

/* ── Reporte específico ── */
.rep-filters[b-kfjiecogvn] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.75rem; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem 1rem; margin-bottom:1rem; }

.rep-kpis[b-kfjiecogvn] { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; margin-bottom:1rem; }
.rep-kpi[b-kfjiecogvn] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#4f46e5); border-radius:.55rem; padding:.65rem .85rem; }
.rep-kpi-label[b-kfjiecogvn] { font-size:.66rem; font-weight:700; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); letter-spacing:.04em; margin-bottom:.2rem; }
.rep-kpi-value[b-kfjiecogvn] { font-size:1.1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.rep-kpi-ok[b-kfjiecogvn]     { border-left-color:#16a34a; }
.rep-kpi-warn[b-kfjiecogvn]   { border-left-color:#d97706; }
.rep-kpi-danger[b-kfjiecogvn] { border-left-color:#dc2626; }
[data-mode="dark"] .rep-kpi[b-kfjiecogvn] { background:var(--rg-bg-card); }

.cat-badge[b-kfjiecogvn] { display:inline-flex; align-items:center; justify-content:center; min-width:1.7rem; padding:.1rem .45rem; border-radius:1rem; font-size:.72rem; font-weight:700; }
.cat-a[b-kfjiecogvn]  { background:rgba(22,163,74,.12);  color:#166534; }
.cat-b[b-kfjiecogvn]  { background:rgba(217,119,6,.12);  color:#92400e; }
.cat-c[b-kfjiecogvn]  { background:rgba(234,88,12,.12);  color:#9a3412; }
.cat-d[b-kfjiecogvn]  { background:rgba(220,38,38,.10);  color:#991b1b; }
.cat-d1[b-kfjiecogvn] { background:rgba(220,38,38,.12);  color:#991b1b; }
.cat-d2[b-kfjiecogvn] { background:rgba(220,38,38,.18);  color:#7f1d1d; }
.cat-e[b-kfjiecogvn]  { background:rgba(127,29,29,.18);  color:#7f1d1d; }
[data-mode="dark"] .cat-a[b-kfjiecogvn]  { color:#86efac; }
[data-mode="dark"] .cat-b[b-kfjiecogvn]  { color:#fcd34d; }
[data-mode="dark"] .cat-c[b-kfjiecogvn]  { color:#fdba74; }
[data-mode="dark"] .cat-d[b-kfjiecogvn], [data-mode="dark"] .cat-d1[b-kfjiecogvn], [data-mode="dark"] .cat-d2[b-kfjiecogvn], [data-mode="dark"] .cat-e[b-kfjiecogvn] { color:#fca5a5; }

.rep-mini-info[b-kfjiecogvn] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:500; margin-left:.5rem; }
.rep-cliente[b-kfjiecogvn] { display:flex; align-items:center; gap:.4rem; }
.rep-cliente-id[b-kfjiecogvn] { font-size:.7rem; background:rgba(79,70,229,.08); color:var(--rg-accent,#4f46e5); padding:.05rem .35rem; border-radius:.3rem; }
[data-mode="dark"] .rep-cliente-id[b-kfjiecogvn] { color:#93c5fd; }

.rep-pager[b-kfjiecogvn] { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.5rem; margin-top:.5rem; }
.rep-pager-info[b-kfjiecogvn] { font-size:.78rem; color:var(--rg-text-muted,#94a3b8); }
.btn-sm[b-kfjiecogvn] { padding:.35rem .65rem; font-size:.75rem; }
.text-end[b-kfjiecogvn] { text-align:right; }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/FrmprValidadorCuentas.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-s3kptyxd23] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-s3kptyxd23 0.3s ease-out; }
@keyframes slideUp-b-s3kptyxd23 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-s3kptyxd23] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-s3kptyxd23] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-s3kptyxd23] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-s3kptyxd23] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-s3kptyxd23] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-s3kptyxd23] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-s3kptyxd23] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-s3kptyxd23] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-s3kptyxd23] { filter: brightness(1.1); }
.btn-outline[b-s3kptyxd23] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-s3kptyxd23] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-s3kptyxd23] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-s3kptyxd23] { filter: brightness(1.1); }
.btn-icon[b-s3kptyxd23] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-s3kptyxd23] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-s3kptyxd23] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-s3kptyxd23] { color: #ef4444; }
.btn-delete:hover[b-s3kptyxd23] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-s3kptyxd23] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-s3kptyxd23] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-s3kptyxd23] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-s3kptyxd23] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-s3kptyxd23] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-s3kptyxd23] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-s3kptyxd23] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-s3kptyxd23] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-s3kptyxd23] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-s3kptyxd23] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-s3kptyxd23] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-s3kptyxd23] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-s3kptyxd23] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-s3kptyxd23] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-s3kptyxd23] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-s3kptyxd23] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-s3kptyxd23] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-s3kptyxd23] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-s3kptyxd23] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-s3kptyxd23] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-s3kptyxd23] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-s3kptyxd23] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-s3kptyxd23] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-s3kptyxd23] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-s3kptyxd23] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-s3kptyxd23] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-s3kptyxd23] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-s3kptyxd23] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-s3kptyxd23] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-s3kptyxd23] { display: block; }
.hide-on-cards[b-s3kptyxd23] { display: none !important; }
.show-on-cards[b-s3kptyxd23] { display: grid; }
.hide-on-grid[b-s3kptyxd23] { display: none !important; }

/* Badges */
.badge[b-s3kptyxd23] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-s3kptyxd23] { background: #ecfdf5; color: #065f46; }
.badge-no[b-s3kptyxd23] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-s3kptyxd23] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-s3kptyxd23] { text-align: center; }
.text-muted[b-s3kptyxd23] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-s3kptyxd23], .crud-empty-state[b-s3kptyxd23] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-s3kptyxd23] { font-size: 2rem; }
.crud-spinner[b-s3kptyxd23] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-s3kptyxd23 0.6s linear infinite; }
.crud-spinner-sm[b-s3kptyxd23] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-s3kptyxd23 0.6s linear infinite; }
@keyframes spin-b-s3kptyxd23 { to { transform: rotate(360deg); } }
.spin[b-s3kptyxd23] { animation: spin-b-s3kptyxd23 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-s3kptyxd23] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-s3kptyxd23 0.15s ease-out; }
.modal-container[b-s3kptyxd23] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-s3kptyxd23] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-s3kptyxd23 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-s3kptyxd23] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-s3kptyxd23] { max-width: 420px; }
@keyframes fadeIn-b-s3kptyxd23 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-s3kptyxd23 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-s3kptyxd23] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-s3kptyxd23] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-s3kptyxd23] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-s3kptyxd23] { color: #dc2626; }
.modal-close[b-s3kptyxd23] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-s3kptyxd23] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-s3kptyxd23] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-s3kptyxd23] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-s3kptyxd23] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-s3kptyxd23] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-s3kptyxd23] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-s3kptyxd23] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-s3kptyxd23] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-s3kptyxd23] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-s3kptyxd23] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-s3kptyxd23] { flex: 2; }
.form-group label[b-s3kptyxd23] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-s3kptyxd23], .form-group select[b-s3kptyxd23], .form-textarea[b-s3kptyxd23] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-s3kptyxd23], .form-group select:focus[b-s3kptyxd23], .form-textarea:focus[b-s3kptyxd23] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-s3kptyxd23] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-s3kptyxd23] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-s3kptyxd23] { flex: 1; display: flex; align-items: center; }
.form-check[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-s3kptyxd23] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-s3kptyxd23] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-s3kptyxd23] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-s3kptyxd23] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-s3kptyxd23] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-s3kptyxd23] { font-size: 3rem; }
.photo-placeholder span[b-s3kptyxd23] { font-size: 0.78rem; }
.photo-actions[b-s3kptyxd23] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-s3kptyxd23] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-s3kptyxd23] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-s3kptyxd23] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-s3kptyxd23] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-s3kptyxd23] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-s3kptyxd23] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-s3kptyxd23] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-s3kptyxd23] { filter: brightness(1.15); transform: scale(1.05); }
[b-s3kptyxd23] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-s3kptyxd23] { padding: 0.75rem; }
    .crud-header[b-s3kptyxd23] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-s3kptyxd23] { font-size: 1.1rem; }
    .btn-text[b-s3kptyxd23] { display: none; }
    .form-row[b-s3kptyxd23] { flex-direction: column; }
    .form-row-4[b-s3kptyxd23] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-s3kptyxd23] { width: 98%; max-height: 95vh; }
    .modal-lg[b-s3kptyxd23] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-s3kptyxd23] { padding: 0.75rem; }
    .modal-tabs[b-s3kptyxd23] { overflow-x: auto; }
    .modal-tab[b-s3kptyxd23] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-s3kptyxd23] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-s3kptyxd23] { display: grid !important; }
    .crud-cards-wrapper[b-s3kptyxd23] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-s3kptyxd23] { grid-template-columns: 1fr; }
    .card-details[b-s3kptyxd23] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-s3kptyxd23] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-s3kptyxd23] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-s3kptyxd23] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-s3kptyxd23] { background:rgba(37,99,235,.25); }

/* ── Estilos específicos Clasificación ── */
.cfg-tabs[b-s3kptyxd23] { display:flex; gap:.25rem; border-bottom:2px solid var(--rg-border,#e2e8f0); margin-bottom:1rem; flex-wrap:wrap; }
.cfg-tab[b-s3kptyxd23] { background:none; border:none; padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--rg-text-muted,#94a3b8); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; display:flex; align-items:center; gap:.35rem; transition:all .15s; }
.cfg-tab:hover[b-s3kptyxd23] { color:var(--rg-text-primary,#1e293b); }
.cfg-tab.active[b-s3kptyxd23] { color:var(--rg-accent,#4f46e5); border-bottom-color:var(--rg-accent,#4f46e5); }

.cfg-card[b-s3kptyxd23] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.75rem; padding:1rem 1.25rem; margin-bottom:1rem; }
.cfg-card-title[b-s3kptyxd23] { font-size:.95rem; font-weight:700; color:var(--rg-text-primary,#1e293b); margin-bottom:.4rem; }
.cfg-help[b-s3kptyxd23] { font-size:.78rem; color:var(--rg-text-secondary,#475569); margin-bottom:.75rem; line-height:1.5; }
.cfg-note[b-s3kptyxd23] { font-size:.78rem; color:var(--rg-accent,#4f46e5); background:rgba(79,70,229,.08); border-left:3px solid var(--rg-accent,#4f46e5); padding:.5rem .75rem; border-radius:.35rem; margin-top:.5rem; display:flex; align-items:center; gap:.45rem; }
.cfg-mini-select[b-s3kptyxd23] { padding:.25rem .4rem; font-size:.75rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.35rem; background:var(--rg-bg-card,#fff); color:var(--rg-text-primary,#1e293b); }

[data-mode="dark"] .cfg-card[b-s3kptyxd23] { background:var(--rg-bg-card); border-color:var(--rg-border); }
[data-mode="dark"] .cfg-note[b-s3kptyxd23] { background:rgba(79,70,229,.18); color:#c7d2fe; }

/* ── Reporte específico ── */
.rep-filters[b-s3kptyxd23] { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:.75rem; background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; padding:.75rem 1rem; margin-bottom:1rem; }

.rep-kpis[b-s3kptyxd23] { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:.6rem; margin-bottom:1rem; }
.rep-kpi[b-s3kptyxd23] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-left:4px solid var(--rg-accent,#4f46e5); border-radius:.55rem; padding:.65rem .85rem; }
.rep-kpi-label[b-s3kptyxd23] { font-size:.66rem; font-weight:700; text-transform:uppercase; color:var(--rg-text-muted,#94a3b8); letter-spacing:.04em; margin-bottom:.2rem; }
.rep-kpi-value[b-s3kptyxd23] { font-size:1.1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); font-family:'Cascadia Code',monospace; }
.rep-kpi-ok[b-s3kptyxd23]     { border-left-color:#16a34a; }
.rep-kpi-warn[b-s3kptyxd23]   { border-left-color:#d97706; }
.rep-kpi-danger[b-s3kptyxd23] { border-left-color:#dc2626; }
[data-mode="dark"] .rep-kpi[b-s3kptyxd23] { background:var(--rg-bg-card); }

.cat-badge[b-s3kptyxd23] { display:inline-flex; align-items:center; justify-content:center; min-width:1.7rem; padding:.1rem .45rem; border-radius:1rem; font-size:.72rem; font-weight:700; }
.cat-a[b-s3kptyxd23]  { background:rgba(22,163,74,.12);  color:#166534; }
.cat-b[b-s3kptyxd23]  { background:rgba(217,119,6,.12);  color:#92400e; }
.cat-c[b-s3kptyxd23]  { background:rgba(234,88,12,.12);  color:#9a3412; }
.cat-d[b-s3kptyxd23]  { background:rgba(220,38,38,.10);  color:#991b1b; }
.cat-d1[b-s3kptyxd23] { background:rgba(220,38,38,.12);  color:#991b1b; }
.cat-d2[b-s3kptyxd23] { background:rgba(220,38,38,.18);  color:#7f1d1d; }
.cat-e[b-s3kptyxd23]  { background:rgba(127,29,29,.18);  color:#7f1d1d; }
[data-mode="dark"] .cat-a[b-s3kptyxd23]  { color:#86efac; }
[data-mode="dark"] .cat-b[b-s3kptyxd23]  { color:#fcd34d; }
[data-mode="dark"] .cat-c[b-s3kptyxd23]  { color:#fdba74; }
[data-mode="dark"] .cat-d[b-s3kptyxd23], [data-mode="dark"] .cat-d1[b-s3kptyxd23], [data-mode="dark"] .cat-d2[b-s3kptyxd23], [data-mode="dark"] .cat-e[b-s3kptyxd23] { color:#fca5a5; }

.rep-mini-info[b-s3kptyxd23] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); font-weight:500; margin-left:.5rem; }
.rep-cliente[b-s3kptyxd23] { display:flex; align-items:center; gap:.4rem; }
.rep-cliente-id[b-s3kptyxd23] { font-size:.7rem; background:rgba(79,70,229,.08); color:var(--rg-accent,#4f46e5); padding:.05rem .35rem; border-radius:.3rem; }
[data-mode="dark"] .rep-cliente-id[b-s3kptyxd23] { color:#93c5fd; }

.rep-pager[b-s3kptyxd23] { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.5rem; margin-top:.5rem; }
.rep-pager-info[b-s3kptyxd23] { font-size:.78rem; color:var(--rg-text-muted,#94a3b8); }
.btn-sm[b-s3kptyxd23] { padding:.35rem .65rem; font-size:.75rem; }
.text-end[b-s3kptyxd23] { text-align:right; }

/* ── Validador específico ── */
.row-error[b-s3kptyxd23] { background:rgba(220,38,38,.05); }
.row-warn[b-s3kptyxd23]  { background:rgba(217,119,6,.06); }
[data-mode="dark"] .row-error[b-s3kptyxd23] { background:rgba(220,38,38,.10); }
[data-mode="dark"] .row-warn[b-s3kptyxd23]  { background:rgba(217,119,6,.12); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmpr_ingresos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-x7xs1zt26e] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x7xs1zt26e 0.3s ease-out; }
@keyframes slideUp-b-x7xs1zt26e { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-x7xs1zt26e] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x7xs1zt26e] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x7xs1zt26e] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x7xs1zt26e] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x7xs1zt26e] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-x7xs1zt26e] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x7xs1zt26e] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x7xs1zt26e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x7xs1zt26e] { filter: brightness(1.1); }
.btn-outline[b-x7xs1zt26e] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x7xs1zt26e] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x7xs1zt26e] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x7xs1zt26e] { filter: brightness(1.1); }
.btn-icon[b-x7xs1zt26e] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x7xs1zt26e] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x7xs1zt26e] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-x7xs1zt26e] { color: #ef4444; }
.btn-delete:hover[b-x7xs1zt26e] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-x7xs1zt26e] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x7xs1zt26e] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x7xs1zt26e] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-x7xs1zt26e] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-x7xs1zt26e] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-x7xs1zt26e] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-x7xs1zt26e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-x7xs1zt26e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-x7xs1zt26e] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-x7xs1zt26e] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x7xs1zt26e] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x7xs1zt26e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x7xs1zt26e] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x7xs1zt26e] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x7xs1zt26e] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-x7xs1zt26e] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-x7xs1zt26e] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-x7xs1zt26e] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-x7xs1zt26e] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-x7xs1zt26e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-x7xs1zt26e] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-x7xs1zt26e] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-x7xs1zt26e] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-x7xs1zt26e] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-x7xs1zt26e] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-x7xs1zt26e] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-x7xs1zt26e] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-x7xs1zt26e] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-x7xs1zt26e] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-x7xs1zt26e] { display: block; }
.hide-on-cards[b-x7xs1zt26e] { display: none !important; }
.show-on-cards[b-x7xs1zt26e] { display: grid; }
.hide-on-grid[b-x7xs1zt26e] { display: none !important; }

/* Badges */
.badge[b-x7xs1zt26e] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-x7xs1zt26e] { background: #ecfdf5; color: #065f46; }
.badge-no[b-x7xs1zt26e] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-x7xs1zt26e] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x7xs1zt26e] { text-align: center; }
.text-muted[b-x7xs1zt26e] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-x7xs1zt26e], .crud-empty-state[b-x7xs1zt26e] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x7xs1zt26e] { font-size: 2rem; }
.crud-spinner[b-x7xs1zt26e] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x7xs1zt26e 0.6s linear infinite; }
.crud-spinner-sm[b-x7xs1zt26e] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-x7xs1zt26e 0.6s linear infinite; }
@keyframes spin-b-x7xs1zt26e { to { transform: rotate(360deg); } }
.spin[b-x7xs1zt26e] { animation: spin-b-x7xs1zt26e 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-x7xs1zt26e] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x7xs1zt26e 0.15s ease-out; }
.modal-container[b-x7xs1zt26e] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x7xs1zt26e] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x7xs1zt26e 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-x7xs1zt26e] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-x7xs1zt26e] { max-width: 420px; }
@keyframes fadeIn-b-x7xs1zt26e { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x7xs1zt26e { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x7xs1zt26e] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x7xs1zt26e] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-x7xs1zt26e] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-x7xs1zt26e] { color: #dc2626; }
.modal-close[b-x7xs1zt26e] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x7xs1zt26e] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x7xs1zt26e] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x7xs1zt26e] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-x7xs1zt26e] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-x7xs1zt26e] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-x7xs1zt26e] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-x7xs1zt26e] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-x7xs1zt26e] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-x7xs1zt26e] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-x7xs1zt26e] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-x7xs1zt26e] { flex: 2; }
.form-group label[b-x7xs1zt26e] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-x7xs1zt26e], .form-group select[b-x7xs1zt26e], .form-textarea[b-x7xs1zt26e] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-x7xs1zt26e], .form-group select:focus[b-x7xs1zt26e], .form-textarea:focus[b-x7xs1zt26e] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-x7xs1zt26e] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-x7xs1zt26e] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-x7xs1zt26e] { flex: 1; display: flex; align-items: center; }
.form-check[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-x7xs1zt26e] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-x7xs1zt26e] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-x7xs1zt26e] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-x7xs1zt26e] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-x7xs1zt26e] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-x7xs1zt26e] { font-size: 3rem; }
.photo-placeholder span[b-x7xs1zt26e] { font-size: 0.78rem; }
.photo-actions[b-x7xs1zt26e] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-x7xs1zt26e] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-x7xs1zt26e] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-x7xs1zt26e] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-x7xs1zt26e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-x7xs1zt26e] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-x7xs1zt26e] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-x7xs1zt26e] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-x7xs1zt26e] { filter: brightness(1.15); transform: scale(1.05); }
[b-x7xs1zt26e] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-x7xs1zt26e] { padding: 0.75rem; }
    .crud-header[b-x7xs1zt26e] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x7xs1zt26e] { font-size: 1.1rem; }
    .btn-text[b-x7xs1zt26e] { display: none; }
    .form-row[b-x7xs1zt26e] { flex-direction: column; }
    .form-row-4[b-x7xs1zt26e] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-x7xs1zt26e] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x7xs1zt26e] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-x7xs1zt26e] { padding: 0.75rem; }
    .modal-tabs[b-x7xs1zt26e] { overflow-x: auto; }
    .modal-tab[b-x7xs1zt26e] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-x7xs1zt26e] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-x7xs1zt26e] { display: grid !important; }
    .crud-cards-wrapper[b-x7xs1zt26e] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-x7xs1zt26e] { grid-template-columns: 1fr; }
    .card-details[b-x7xs1zt26e] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-x7xs1zt26e] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x7xs1zt26e] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x7xs1zt26e] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x7xs1zt26e] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmpr_reestructuracion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h4zojlp3ae] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h4zojlp3ae 0.3s ease-out; }
@keyframes slideUp-b-h4zojlp3ae { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h4zojlp3ae] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h4zojlp3ae] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h4zojlp3ae] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h4zojlp3ae] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h4zojlp3ae] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h4zojlp3ae] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h4zojlp3ae] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h4zojlp3ae] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h4zojlp3ae] { filter: brightness(1.1); }
.btn-outline[b-h4zojlp3ae] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h4zojlp3ae] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h4zojlp3ae] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h4zojlp3ae] { filter: brightness(1.1); }
.btn-icon[b-h4zojlp3ae] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h4zojlp3ae] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h4zojlp3ae] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h4zojlp3ae] { color: #ef4444; }
.btn-delete:hover[b-h4zojlp3ae] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h4zojlp3ae] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h4zojlp3ae] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h4zojlp3ae] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h4zojlp3ae] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h4zojlp3ae] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h4zojlp3ae] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h4zojlp3ae] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h4zojlp3ae] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h4zojlp3ae] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h4zojlp3ae] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h4zojlp3ae] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h4zojlp3ae] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h4zojlp3ae] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h4zojlp3ae] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h4zojlp3ae] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h4zojlp3ae] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h4zojlp3ae] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h4zojlp3ae] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h4zojlp3ae] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h4zojlp3ae] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h4zojlp3ae] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h4zojlp3ae] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h4zojlp3ae] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h4zojlp3ae] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h4zojlp3ae] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h4zojlp3ae] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h4zojlp3ae] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h4zojlp3ae] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h4zojlp3ae] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h4zojlp3ae] { display: block; }
.hide-on-cards[b-h4zojlp3ae] { display: none !important; }
.show-on-cards[b-h4zojlp3ae] { display: grid; }
.hide-on-grid[b-h4zojlp3ae] { display: none !important; }

/* Badges */
.badge[b-h4zojlp3ae] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h4zojlp3ae] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h4zojlp3ae] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h4zojlp3ae] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h4zojlp3ae] { text-align: center; }
.text-muted[b-h4zojlp3ae] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h4zojlp3ae], .crud-empty-state[b-h4zojlp3ae] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h4zojlp3ae] { font-size: 2rem; }
.crud-spinner[b-h4zojlp3ae] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h4zojlp3ae 0.6s linear infinite; }
.crud-spinner-sm[b-h4zojlp3ae] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h4zojlp3ae 0.6s linear infinite; }
@keyframes spin-b-h4zojlp3ae { to { transform: rotate(360deg); } }
.spin[b-h4zojlp3ae] { animation: spin-b-h4zojlp3ae 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h4zojlp3ae] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h4zojlp3ae 0.15s ease-out; }
.modal-container[b-h4zojlp3ae] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h4zojlp3ae] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h4zojlp3ae 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h4zojlp3ae] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h4zojlp3ae] { max-width: 420px; }
@keyframes fadeIn-b-h4zojlp3ae { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h4zojlp3ae { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h4zojlp3ae] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h4zojlp3ae] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h4zojlp3ae] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h4zojlp3ae] { color: #dc2626; }
.modal-close[b-h4zojlp3ae] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h4zojlp3ae] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h4zojlp3ae] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h4zojlp3ae] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h4zojlp3ae] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h4zojlp3ae] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h4zojlp3ae] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h4zojlp3ae] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h4zojlp3ae] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h4zojlp3ae] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h4zojlp3ae] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h4zojlp3ae] { flex: 2; }
.form-group label[b-h4zojlp3ae] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h4zojlp3ae], .form-group select[b-h4zojlp3ae], .form-textarea[b-h4zojlp3ae] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h4zojlp3ae], .form-group select:focus[b-h4zojlp3ae], .form-textarea:focus[b-h4zojlp3ae] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h4zojlp3ae] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h4zojlp3ae] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h4zojlp3ae] { flex: 1; display: flex; align-items: center; }
.form-check[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h4zojlp3ae] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h4zojlp3ae] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h4zojlp3ae] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h4zojlp3ae] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h4zojlp3ae] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h4zojlp3ae] { font-size: 3rem; }
.photo-placeholder span[b-h4zojlp3ae] { font-size: 0.78rem; }
.photo-actions[b-h4zojlp3ae] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h4zojlp3ae] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h4zojlp3ae] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h4zojlp3ae] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h4zojlp3ae] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h4zojlp3ae] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h4zojlp3ae] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h4zojlp3ae] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h4zojlp3ae] { filter: brightness(1.15); transform: scale(1.05); }
[b-h4zojlp3ae] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h4zojlp3ae] { padding: 0.75rem; }
    .crud-header[b-h4zojlp3ae] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h4zojlp3ae] { font-size: 1.1rem; }
    .btn-text[b-h4zojlp3ae] { display: none; }
    .form-row[b-h4zojlp3ae] { flex-direction: column; }
    .form-row-4[b-h4zojlp3ae] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h4zojlp3ae] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h4zojlp3ae] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h4zojlp3ae] { padding: 0.75rem; }
    .modal-tabs[b-h4zojlp3ae] { overflow-x: auto; }
    .modal-tab[b-h4zojlp3ae] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h4zojlp3ae] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h4zojlp3ae] { display: grid !important; }
    .crud-cards-wrapper[b-h4zojlp3ae] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h4zojlp3ae] { grid-template-columns: 1fr; }
    .card-details[b-h4zojlp3ae] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h4zojlp3ae] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h4zojlp3ae] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h4zojlp3ae] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h4zojlp3ae] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmregistracargoprestamo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-2p6uukea7f] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2p6uukea7f 0.3s ease-out; }
@keyframes slideUp-b-2p6uukea7f { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2p6uukea7f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2p6uukea7f] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2p6uukea7f] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2p6uukea7f] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2p6uukea7f] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2p6uukea7f] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2p6uukea7f] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-2p6uukea7f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2p6uukea7f] { filter: brightness(1.1); }
.btn-outline[b-2p6uukea7f] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2p6uukea7f] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2p6uukea7f] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2p6uukea7f] { filter: brightness(1.1); }
.btn-icon[b-2p6uukea7f] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2p6uukea7f] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2p6uukea7f] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2p6uukea7f] { color: #ef4444; }
.btn-delete:hover[b-2p6uukea7f] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-2p6uukea7f] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-2p6uukea7f] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2p6uukea7f] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2p6uukea7f] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2p6uukea7f] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2p6uukea7f] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2p6uukea7f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2p6uukea7f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2p6uukea7f] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2p6uukea7f] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2p6uukea7f] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2p6uukea7f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2p6uukea7f] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2p6uukea7f] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2p6uukea7f] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-2p6uukea7f] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-2p6uukea7f] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-2p6uukea7f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-2p6uukea7f] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-2p6uukea7f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-2p6uukea7f] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-2p6uukea7f] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-2p6uukea7f] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-2p6uukea7f] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-2p6uukea7f] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-2p6uukea7f] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-2p6uukea7f] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-2p6uukea7f] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-2p6uukea7f] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-2p6uukea7f] { display: block; }
.hide-on-cards[b-2p6uukea7f] { display: none !important; }
.show-on-cards[b-2p6uukea7f] { display: grid; }
.hide-on-grid[b-2p6uukea7f] { display: none !important; }

/* Badges */
.badge[b-2p6uukea7f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-2p6uukea7f] { background: #ecfdf5; color: #065f46; }
.badge-no[b-2p6uukea7f] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-2p6uukea7f] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2p6uukea7f] { text-align: center; }
.text-muted[b-2p6uukea7f] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2p6uukea7f], .crud-empty-state[b-2p6uukea7f] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2p6uukea7f] { font-size: 2rem; }
.crud-spinner[b-2p6uukea7f] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2p6uukea7f 0.6s linear infinite; }
.crud-spinner-sm[b-2p6uukea7f] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2p6uukea7f 0.6s linear infinite; }
@keyframes spin-b-2p6uukea7f { to { transform: rotate(360deg); } }
.spin[b-2p6uukea7f] { animation: spin-b-2p6uukea7f 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-2p6uukea7f] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2p6uukea7f 0.15s ease-out; }
.modal-container[b-2p6uukea7f] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2p6uukea7f] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2p6uukea7f 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-2p6uukea7f] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-2p6uukea7f] { max-width: 420px; }
@keyframes fadeIn-b-2p6uukea7f { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2p6uukea7f { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2p6uukea7f] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2p6uukea7f] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-2p6uukea7f] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-2p6uukea7f] { color: #dc2626; }
.modal-close[b-2p6uukea7f] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2p6uukea7f] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-2p6uukea7f] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2p6uukea7f] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-2p6uukea7f] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-2p6uukea7f] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-2p6uukea7f] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-2p6uukea7f] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-2p6uukea7f] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-2p6uukea7f] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-2p6uukea7f] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-2p6uukea7f] { flex: 2; }
.form-group label[b-2p6uukea7f] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2p6uukea7f], .form-group select[b-2p6uukea7f], .form-textarea[b-2p6uukea7f] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2p6uukea7f], .form-group select:focus[b-2p6uukea7f], .form-textarea:focus[b-2p6uukea7f] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-2p6uukea7f] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-2p6uukea7f] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-2p6uukea7f] { flex: 1; display: flex; align-items: center; }
.form-check[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-2p6uukea7f] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-2p6uukea7f] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-2p6uukea7f] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-2p6uukea7f] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-2p6uukea7f] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-2p6uukea7f] { font-size: 3rem; }
.photo-placeholder span[b-2p6uukea7f] { font-size: 0.78rem; }
.photo-actions[b-2p6uukea7f] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-2p6uukea7f] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-2p6uukea7f] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-2p6uukea7f] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-2p6uukea7f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-2p6uukea7f] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-2p6uukea7f] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-2p6uukea7f] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-2p6uukea7f] { filter: brightness(1.15); transform: scale(1.05); }
[b-2p6uukea7f] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2p6uukea7f] { padding: 0.75rem; }
    .crud-header[b-2p6uukea7f] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-2p6uukea7f] { font-size: 1.1rem; }
    .btn-text[b-2p6uukea7f] { display: none; }
    .form-row[b-2p6uukea7f] { flex-direction: column; }
    .form-row-4[b-2p6uukea7f] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-2p6uukea7f] { width: 98%; max-height: 95vh; }
    .modal-lg[b-2p6uukea7f] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-2p6uukea7f] { padding: 0.75rem; }
    .modal-tabs[b-2p6uukea7f] { overflow-x: auto; }
    .modal-tab[b-2p6uukea7f] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-2p6uukea7f] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-2p6uukea7f] { display: grid !important; }
    .crud-cards-wrapper[b-2p6uukea7f] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-2p6uukea7f] { grid-template-columns: 1fr; }
    .card-details[b-2p6uukea7f] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-2p6uukea7f] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-2p6uukea7f] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-2p6uukea7f] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-2p6uukea7f] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmregistragarantepr.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-qeeldevj7j] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-qeeldevj7j 0.3s ease-out; }
@keyframes slideUp-b-qeeldevj7j { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-qeeldevj7j] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-qeeldevj7j] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-qeeldevj7j] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-qeeldevj7j] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-qeeldevj7j] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-qeeldevj7j] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-qeeldevj7j] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qeeldevj7j] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qeeldevj7j] { filter: brightness(1.1); }
.btn-outline[b-qeeldevj7j] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qeeldevj7j] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-qeeldevj7j] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-qeeldevj7j] { filter: brightness(1.1); }
.btn-icon[b-qeeldevj7j] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-qeeldevj7j] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-qeeldevj7j] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-qeeldevj7j] { color: #ef4444; }
.btn-delete:hover[b-qeeldevj7j] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-qeeldevj7j] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-qeeldevj7j] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-qeeldevj7j] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-qeeldevj7j] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-qeeldevj7j] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-qeeldevj7j] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-qeeldevj7j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-qeeldevj7j] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-qeeldevj7j] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-qeeldevj7j] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-qeeldevj7j] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qeeldevj7j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-qeeldevj7j] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-qeeldevj7j] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-qeeldevj7j] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-qeeldevj7j] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-qeeldevj7j] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-qeeldevj7j] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-qeeldevj7j] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-qeeldevj7j] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-qeeldevj7j] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-qeeldevj7j] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-qeeldevj7j] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-qeeldevj7j] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-qeeldevj7j] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-qeeldevj7j] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-qeeldevj7j] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-qeeldevj7j] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-qeeldevj7j] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-qeeldevj7j] { display: block; }
.hide-on-cards[b-qeeldevj7j] { display: none !important; }
.show-on-cards[b-qeeldevj7j] { display: grid; }
.hide-on-grid[b-qeeldevj7j] { display: none !important; }

/* Badges */
.badge[b-qeeldevj7j] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-qeeldevj7j] { background: #ecfdf5; color: #065f46; }
.badge-no[b-qeeldevj7j] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-qeeldevj7j] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-qeeldevj7j] { text-align: center; }
.text-muted[b-qeeldevj7j] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-qeeldevj7j], .crud-empty-state[b-qeeldevj7j] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-qeeldevj7j] { font-size: 2rem; }
.crud-spinner[b-qeeldevj7j] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-qeeldevj7j 0.6s linear infinite; }
.crud-spinner-sm[b-qeeldevj7j] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-qeeldevj7j 0.6s linear infinite; }
@keyframes spin-b-qeeldevj7j { to { transform: rotate(360deg); } }
.spin[b-qeeldevj7j] { animation: spin-b-qeeldevj7j 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-qeeldevj7j] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-qeeldevj7j 0.15s ease-out; }
.modal-container[b-qeeldevj7j] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-qeeldevj7j] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-qeeldevj7j 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-qeeldevj7j] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-qeeldevj7j] { max-width: 420px; }
@keyframes fadeIn-b-qeeldevj7j { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-qeeldevj7j { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-qeeldevj7j] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-qeeldevj7j] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-qeeldevj7j] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-qeeldevj7j] { color: #dc2626; }
.modal-close[b-qeeldevj7j] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-qeeldevj7j] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-qeeldevj7j] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-qeeldevj7j] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-qeeldevj7j] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-qeeldevj7j] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-qeeldevj7j] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-qeeldevj7j] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-qeeldevj7j] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-qeeldevj7j] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-qeeldevj7j] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-qeeldevj7j] { flex: 2; }
.form-group label[b-qeeldevj7j] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-qeeldevj7j], .form-group select[b-qeeldevj7j], .form-textarea[b-qeeldevj7j] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-qeeldevj7j], .form-group select:focus[b-qeeldevj7j], .form-textarea:focus[b-qeeldevj7j] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-qeeldevj7j] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-qeeldevj7j] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-qeeldevj7j] { flex: 1; display: flex; align-items: center; }
.form-check[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-qeeldevj7j] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-qeeldevj7j] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-qeeldevj7j] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-qeeldevj7j] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-qeeldevj7j] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-qeeldevj7j] { font-size: 3rem; }
.photo-placeholder span[b-qeeldevj7j] { font-size: 0.78rem; }
.photo-actions[b-qeeldevj7j] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-qeeldevj7j] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-qeeldevj7j] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-qeeldevj7j] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-qeeldevj7j] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-qeeldevj7j] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-qeeldevj7j] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-qeeldevj7j] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-qeeldevj7j] { filter: brightness(1.15); transform: scale(1.05); }
[b-qeeldevj7j] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-qeeldevj7j] { padding: 0.75rem; }
    .crud-header[b-qeeldevj7j] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-qeeldevj7j] { font-size: 1.1rem; }
    .btn-text[b-qeeldevj7j] { display: none; }
    .form-row[b-qeeldevj7j] { flex-direction: column; }
    .form-row-4[b-qeeldevj7j] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-qeeldevj7j] { width: 98%; max-height: 95vh; }
    .modal-lg[b-qeeldevj7j] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-qeeldevj7j] { padding: 0.75rem; }
    .modal-tabs[b-qeeldevj7j] { overflow-x: auto; }
    .modal-tab[b-qeeldevj7j] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-qeeldevj7j] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-qeeldevj7j] { display: grid !important; }
    .crud-cards-wrapper[b-qeeldevj7j] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-qeeldevj7j] { grid-template-columns: 1fr; }
    .card-details[b-qeeldevj7j] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-qeeldevj7j] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-qeeldevj7j] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-qeeldevj7j] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-qeeldevj7j] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmregistragarantia.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-89k764hgik] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-89k764hgik 0.3s ease-out; }
@keyframes slideUp-b-89k764hgik { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-89k764hgik] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-89k764hgik] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-89k764hgik] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-89k764hgik] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-89k764hgik] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-89k764hgik] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-89k764hgik] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-89k764hgik] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-89k764hgik] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-89k764hgik] { filter: brightness(1.1); }
.btn-outline[b-89k764hgik] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-89k764hgik] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-89k764hgik] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-89k764hgik] { filter: brightness(1.1); }
.btn-icon[b-89k764hgik] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-89k764hgik] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-89k764hgik] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-89k764hgik] { color: #ef4444; }
.btn-delete:hover[b-89k764hgik] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-89k764hgik] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-89k764hgik] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-89k764hgik] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-89k764hgik] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-89k764hgik] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-89k764hgik] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-89k764hgik] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-89k764hgik] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-89k764hgik] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-89k764hgik] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-89k764hgik] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-89k764hgik] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-89k764hgik] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-89k764hgik] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-89k764hgik] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-89k764hgik] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-89k764hgik] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-89k764hgik] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-89k764hgik] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-89k764hgik] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-89k764hgik] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-89k764hgik] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-89k764hgik] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-89k764hgik] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-89k764hgik] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-89k764hgik] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-89k764hgik] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-89k764hgik] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-89k764hgik] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-89k764hgik] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-89k764hgik] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-89k764hgik] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-89k764hgik] { display: block; }
.hide-on-cards[b-89k764hgik] { display: none !important; }
.show-on-cards[b-89k764hgik] { display: grid; }
.hide-on-grid[b-89k764hgik] { display: none !important; }

/* Badges */
.badge[b-89k764hgik] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-89k764hgik] { background: #ecfdf5; color: #065f46; }
.badge-no[b-89k764hgik] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-89k764hgik] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-89k764hgik] { text-align: center; }
.text-muted[b-89k764hgik] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-89k764hgik], .crud-empty-state[b-89k764hgik] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-89k764hgik] { font-size: 2rem; }
.crud-spinner[b-89k764hgik] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-89k764hgik 0.6s linear infinite; }
.crud-spinner-sm[b-89k764hgik] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-89k764hgik 0.6s linear infinite; }
@keyframes spin-b-89k764hgik { to { transform: rotate(360deg); } }
.spin[b-89k764hgik] { animation: spin-b-89k764hgik 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-89k764hgik] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-89k764hgik 0.15s ease-out; }
.modal-container[b-89k764hgik] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-89k764hgik] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-89k764hgik 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-89k764hgik] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-89k764hgik] { max-width: 420px; }
@keyframes fadeIn-b-89k764hgik { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-89k764hgik { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-89k764hgik] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-89k764hgik] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-89k764hgik] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-89k764hgik] { color: #dc2626; }
.modal-close[b-89k764hgik] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-89k764hgik] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-89k764hgik] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-89k764hgik] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-89k764hgik] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-89k764hgik] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-89k764hgik] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-89k764hgik] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-89k764hgik] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-89k764hgik] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-89k764hgik] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-89k764hgik] { flex: 2; }
.form-group label[b-89k764hgik] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-89k764hgik], .form-group select[b-89k764hgik], .form-textarea[b-89k764hgik] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-89k764hgik], .form-group select:focus[b-89k764hgik], .form-textarea:focus[b-89k764hgik] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-89k764hgik] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-89k764hgik] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-89k764hgik] { flex: 1; display: flex; align-items: center; }
.form-check[b-89k764hgik] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-89k764hgik] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-89k764hgik] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-89k764hgik] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-89k764hgik] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-89k764hgik] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-89k764hgik] { font-size: 3rem; }
.photo-placeholder span[b-89k764hgik] { font-size: 0.78rem; }
.photo-actions[b-89k764hgik] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-89k764hgik] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-89k764hgik] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-89k764hgik] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-89k764hgik] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-89k764hgik] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-89k764hgik] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-89k764hgik] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-89k764hgik] { filter: brightness(1.15); transform: scale(1.05); }
[b-89k764hgik] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-89k764hgik] { padding: 0.75rem; }
    .crud-header[b-89k764hgik] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-89k764hgik] { font-size: 1.1rem; }
    .btn-text[b-89k764hgik] { display: none; }
    .form-row[b-89k764hgik] { flex-direction: column; }
    .form-row-4[b-89k764hgik] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-89k764hgik] { width: 98%; max-height: 95vh; }
    .modal-lg[b-89k764hgik] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-89k764hgik] { padding: 0.75rem; }
    .modal-tabs[b-89k764hgik] { overflow-x: auto; }
    .modal-tab[b-89k764hgik] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-89k764hgik] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-89k764hgik] { display: grid !important; }
    .crud-cards-wrapper[b-89k764hgik] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-89k764hgik] { grid-template-columns: 1fr; }
    .card-details[b-89k764hgik] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-89k764hgik] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-89k764hgik] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-89k764hgik] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-89k764hgik] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmreimpresioncierre.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-eo3c836jm8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-eo3c836jm8 0.3s ease-out; }
@keyframes slideUp-b-eo3c836jm8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-eo3c836jm8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-eo3c836jm8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-eo3c836jm8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-eo3c836jm8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-eo3c836jm8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-eo3c836jm8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-eo3c836jm8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-eo3c836jm8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-eo3c836jm8] { filter: brightness(1.1); }
.btn-outline[b-eo3c836jm8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-eo3c836jm8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-eo3c836jm8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-eo3c836jm8] { filter: brightness(1.1); }
.btn-icon[b-eo3c836jm8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-eo3c836jm8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-eo3c836jm8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-eo3c836jm8] { color: #ef4444; }
.btn-delete:hover[b-eo3c836jm8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-eo3c836jm8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-eo3c836jm8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-eo3c836jm8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-eo3c836jm8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-eo3c836jm8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-eo3c836jm8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-eo3c836jm8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-eo3c836jm8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-eo3c836jm8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-eo3c836jm8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-eo3c836jm8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-eo3c836jm8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-eo3c836jm8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-eo3c836jm8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-eo3c836jm8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-eo3c836jm8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-eo3c836jm8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-eo3c836jm8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-eo3c836jm8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-eo3c836jm8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-eo3c836jm8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-eo3c836jm8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-eo3c836jm8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-eo3c836jm8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-eo3c836jm8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-eo3c836jm8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-eo3c836jm8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-eo3c836jm8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-eo3c836jm8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-eo3c836jm8] { display: block; }
.hide-on-cards[b-eo3c836jm8] { display: none !important; }
.show-on-cards[b-eo3c836jm8] { display: grid; }
.hide-on-grid[b-eo3c836jm8] { display: none !important; }

/* Badges */
.badge[b-eo3c836jm8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-eo3c836jm8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-eo3c836jm8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-eo3c836jm8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-eo3c836jm8] { text-align: center; }
.text-muted[b-eo3c836jm8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-eo3c836jm8], .crud-empty-state[b-eo3c836jm8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-eo3c836jm8] { font-size: 2rem; }
.crud-spinner[b-eo3c836jm8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-eo3c836jm8 0.6s linear infinite; }
.crud-spinner-sm[b-eo3c836jm8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-eo3c836jm8 0.6s linear infinite; }
@keyframes spin-b-eo3c836jm8 { to { transform: rotate(360deg); } }
.spin[b-eo3c836jm8] { animation: spin-b-eo3c836jm8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-eo3c836jm8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-eo3c836jm8 0.15s ease-out; }
.modal-container[b-eo3c836jm8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-eo3c836jm8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-eo3c836jm8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-eo3c836jm8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-eo3c836jm8] { max-width: 420px; }
@keyframes fadeIn-b-eo3c836jm8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-eo3c836jm8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-eo3c836jm8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-eo3c836jm8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-eo3c836jm8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-eo3c836jm8] { color: #dc2626; }
.modal-close[b-eo3c836jm8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-eo3c836jm8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-eo3c836jm8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-eo3c836jm8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-eo3c836jm8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-eo3c836jm8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-eo3c836jm8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-eo3c836jm8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-eo3c836jm8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-eo3c836jm8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-eo3c836jm8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-eo3c836jm8] { flex: 2; }
.form-group label[b-eo3c836jm8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-eo3c836jm8], .form-group select[b-eo3c836jm8], .form-textarea[b-eo3c836jm8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-eo3c836jm8], .form-group select:focus[b-eo3c836jm8], .form-textarea:focus[b-eo3c836jm8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-eo3c836jm8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-eo3c836jm8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-eo3c836jm8] { flex: 1; display: flex; align-items: center; }
.form-check[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-eo3c836jm8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-eo3c836jm8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-eo3c836jm8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-eo3c836jm8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-eo3c836jm8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-eo3c836jm8] { font-size: 3rem; }
.photo-placeholder span[b-eo3c836jm8] { font-size: 0.78rem; }
.photo-actions[b-eo3c836jm8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-eo3c836jm8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-eo3c836jm8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-eo3c836jm8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-eo3c836jm8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-eo3c836jm8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-eo3c836jm8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-eo3c836jm8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-eo3c836jm8] { filter: brightness(1.15); transform: scale(1.05); }
[b-eo3c836jm8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-eo3c836jm8] { padding: 0.75rem; }
    .crud-header[b-eo3c836jm8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-eo3c836jm8] { font-size: 1.1rem; }
    .btn-text[b-eo3c836jm8] { display: none; }
    .form-row[b-eo3c836jm8] { flex-direction: column; }
    .form-row-4[b-eo3c836jm8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-eo3c836jm8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-eo3c836jm8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-eo3c836jm8] { padding: 0.75rem; }
    .modal-tabs[b-eo3c836jm8] { overflow-x: auto; }
    .modal-tab[b-eo3c836jm8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-eo3c836jm8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-eo3c836jm8] { display: grid !important; }
    .crud-cards-wrapper[b-eo3c836jm8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-eo3c836jm8] { grid-template-columns: 1fr; }
    .card-details[b-eo3c836jm8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-eo3c836jm8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-eo3c836jm8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-eo3c836jm8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-eo3c836jm8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmreimpresionrc.razor.rz.scp.css */
/* ============================================================
   Frmreimpresionrc — Reimpresión RC/NC/ND Préstamos
   Base CRUD/Modal/Form copiada de Frmclientes.razor.css por
   CSS isolation de Blazor.
   ============================================================ */

.crud-container[b-x477wpdgsf] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-x477wpdgsf 0.3s ease-out; }
@keyframes slideUp-b-x477wpdgsf { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-x477wpdgsf] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-x477wpdgsf] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-x477wpdgsf] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-x477wpdgsf] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-x477wpdgsf] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-x477wpdgsf] { display: flex; gap: 0.5rem; }

.btn-crud[b-x477wpdgsf] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-x477wpdgsf] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-x477wpdgsf] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-x477wpdgsf] { filter: brightness(1.1); }
.btn-outline[b-x477wpdgsf] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-x477wpdgsf] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-x477wpdgsf] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-x477wpdgsf] { filter: brightness(1.1); }
.btn-icon[b-x477wpdgsf] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-x477wpdgsf] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-x477wpdgsf] { background: rgba(79, 70, 229, 0.1); }

.crud-alert[b-x477wpdgsf] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-x477wpdgsf] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-x477wpdgsf]   { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert.info[b-x477wpdgsf]    { background: rgba(37,99,235,0.06); color: #1e40af; border: 1px solid rgba(37,99,235,0.2); }
.crud-alert-close[b-x477wpdgsf] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

.crud-grid-wrapper[b-x477wpdgsf] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 320px); }
.crud-table[b-x477wpdgsf] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-x477wpdgsf] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-x477wpdgsf] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-x477wpdgsf] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-x477wpdgsf] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-x477wpdgsf] { width: 60px; text-align: center; white-space: nowrap; }

.font-mono[b-x477wpdgsf] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-x477wpdgsf] { text-align: center; }
.text-right[b-x477wpdgsf]  { text-align: right; }
.text-muted[b-x477wpdgsf]  { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

.crud-loading[b-x477wpdgsf], .crud-empty-state[b-x477wpdgsf] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-x477wpdgsf] { font-size: 2rem; }
.crud-spinner[b-x477wpdgsf] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-x477wpdgsf 0.6s linear infinite; }
@keyframes spin-b-x477wpdgsf { to { transform: rotate(360deg); } }
.spin[b-x477wpdgsf] { animation: spin-b-x477wpdgsf 0.8s linear infinite; }

/* ── Modal ──────────────────────────────────────────────────── */
.modal-backdrop[b-x477wpdgsf] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-x477wpdgsf 0.15s ease-out; }
.modal-container[b-x477wpdgsf] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-x477wpdgsf] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-x477wpdgsf 0.2s ease-out; }
.modal-lg[b-x477wpdgsf] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-x477wpdgsf] { max-width: 420px; }
@keyframes fadeIn-b-x477wpdgsf { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-x477wpdgsf { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-x477wpdgsf] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-x477wpdgsf] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-x477wpdgsf] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-x477wpdgsf] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-x477wpdgsf] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-x477wpdgsf] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ── Form ───────────────────────────────────────────────────── */
.form-group[b-x477wpdgsf] { display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-x477wpdgsf] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-input[b-x477wpdgsf] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; width: 100%; box-sizing: border-box; font-family: inherit; resize: vertical; }
.form-input:focus[b-x477wpdgsf] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-input:disabled[b-x477wpdgsf] { opacity: 0.5; cursor: not-allowed; background: var(--rg-bg-sidebar, #f8fafc); }

@media (max-width: 768px) {
    .crud-container[b-x477wpdgsf] { padding: 0.75rem; }
    .crud-header[b-x477wpdgsf] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-x477wpdgsf] { font-size: 1.1rem; }
    .btn-text[b-x477wpdgsf] { display: none; }
    .modal-dialog[b-x477wpdgsf] { width: 98%; max-height: 95vh; }
    .modal-lg[b-x477wpdgsf] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-x477wpdgsf] { padding: 0.75rem; }
}

/* ============================================================
   Frmreimpresionrc — estilos específicos
   ============================================================ */

/* ── Filtros ──────────────────────────────────────────────────── */
.reimp-filtros[b-x477wpdgsf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: flex-end;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.6rem;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.reimp-filtro[b-x477wpdgsf] {
    display: flex;
    flex-direction: column;
    min-width: 130px;
    flex: 1 1 130px;
}

.reimp-filtro label[b-x477wpdgsf] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--rg-text-muted);
    margin-bottom: 0.25rem;
}

.reimp-filtro .form-input[b-x477wpdgsf] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.4rem 0.55rem;
    font-size: 0.85rem;
}

.reimp-filtro .form-input:focus[b-x477wpdgsf] {
    border-color: var(--rg-primary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.reimp-filtro .form-input:disabled[b-x477wpdgsf] {
    opacity: 0.5;
    cursor: not-allowed;
}

.reimp-btn-buscar[b-x477wpdgsf] {
    align-self: flex-end;
    padding: 0.45rem 0.85rem;
    flex: 0 0 auto;
}

.reimp-filter-notice[b-x477wpdgsf] {
    background: rgba(37, 99, 235, 0.08);
    border-left: 4px solid var(--rg-primary);
    color: var(--rg-text-secondary);
    padding: 0.55rem 0.85rem;
    border-radius: 0 0.4rem 0.4rem 0;
    font-size: 0.82rem;
    margin: 0.3rem 0 0.75rem;
}

/* ── Badges de tipo doc ───────────────────────────────────────── */
.reimp-badge[b-x477wpdgsf] {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    font-family: 'Cascadia Code', monospace;
}
.reimp-badge-rc[b-x477wpdgsf] { background: rgba(22,163,74,0.15);  color: #166534; }
.reimp-badge-nc[b-x477wpdgsf] { background: rgba(37,99,235,0.15);  color: #1e40af; }
.reimp-badge-nd[b-x477wpdgsf] { background: rgba(220,38,38,0.15);  color: #991b1b; }

[data-mode="dark"] .reimp-badge-rc[b-x477wpdgsf] { color: #86efac; }
[data-mode="dark"] .reimp-badge-nc[b-x477wpdgsf] { color: #93c5fd; }
[data-mode="dark"] .reimp-badge-nd[b-x477wpdgsf] { color: #fca5a5; }

.reimp-sub[b-x477wpdgsf] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-top: 0.1rem;
}

.reimp-evid-count[b-x477wpdgsf] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--rg-accent);
    font-weight: 600;
    font-size: 0.82rem;
}

.reimp-ncf-modificado[b-x477wpdgsf] {
    color: var(--rg-danger);
    font-size: 0.66rem;
    font-weight: 600;
}

[data-mode="dark"] .reimp-ncf-modificado[b-x477wpdgsf] {
    color: #fca5a5;
}

.reimp-count[b-x477wpdgsf] {
    text-align: right;
    color: var(--rg-text-muted);
    font-size: 0.78rem;
    padding: 0.5rem 0.25rem;
}

/* ── Modal de acciones ────────────────────────────────────────── */
.reimp-info-card[b-x477wpdgsf] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0.6rem 0.8rem;
    margin-bottom: 0.75rem;
    font-size: 0.82rem;
}
.reimp-info-card > div[b-x477wpdgsf] { margin-bottom: 0.2rem; }
.reimp-info-card > div:last-child[b-x477wpdgsf] { margin-bottom: 0; }

.reimp-acciones[b-x477wpdgsf] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.reimp-acciones .btn-crud[b-x477wpdgsf] {
    width: 100%;
    justify-content: flex-start;
}

/* ── Modales anidados ─────────────────────────────────────────── */
.modal-backdrop-nested[b-x477wpdgsf]  { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-x477wpdgsf] { z-index: 2001 !important; }

/* ── Galería de evidencias ────────────────────────────────────── */
.reimp-galeria[b-x477wpdgsf] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.75rem;
    max-height: 60vh;
    overflow-y: auto;
}

.reimp-thumb[b-x477wpdgsf] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: transform 0.12s, box-shadow 0.12s;
}
.reimp-thumb:hover[b-x477wpdgsf] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.reimp-thumb img[b-x477wpdgsf] {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
    cursor: zoom-in;
}

.reimp-thumb-loading[b-x477wpdgsf] {
    width: 100%;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rg-text-muted);
    font-size: 1.2rem;
}

.reimp-thumb-info[b-x477wpdgsf] {
    padding: 0.4rem 0.6rem;
    font-size: 0.72rem;
}
.reimp-thumb-info span[b-x477wpdgsf] { display: block; color: var(--rg-text-primary); font-weight: 600; word-break: break-all; }
.reimp-thumb-info small[b-x477wpdgsf] { display: block; color: var(--rg-text-muted); margin-top: 0.2rem; }

/* ── Lightbox imagen fullscreen ───────────────────────────────── */
.reimp-lightbox[b-x477wpdgsf] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.92);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3000;
    cursor: zoom-out;
}
.reimp-lightbox img[b-x477wpdgsf] {
    max-width: 95vw;
    max-height: 95vh;
    object-fit: contain;
}
.reimp-lightbox-close[b-x477wpdgsf] {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: rgba(255,255,255,0.1);
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.reimp-lightbox-close:hover[b-x477wpdgsf] { background: rgba(255,255,255,0.2); }

.text-muted[b-x477wpdgsf] { color: var(--rg-text-muted); }

/* Toggle Papel (Carta / POS) en modal de acciones */
.reimp-papel-toggle[b-x477wpdgsf] {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .35rem .55rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    margin-bottom: .5rem;
}
.reimp-papel-label[b-x477wpdgsf] {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--rg-text-muted);
    margin-right: .25rem;
}
.reimp-papel-btn[b-x477wpdgsf] {
    flex: 1;
    padding: .35rem .6rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    color: var(--rg-text-secondary);
    border-radius: .35rem;
    font-size: .78rem;
    font-weight: 500;
    cursor: pointer;
    transition: all .15s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .3rem;
}
.reimp-papel-btn:hover[b-x477wpdgsf] { border-color: var(--rg-primary); color: var(--rg-text-primary); }
.reimp-papel-btn.active[b-x477wpdgsf] {
    background: var(--rg-primary);
    color: #fff;
    border-color: var(--rg-primary);
    font-weight: 600;
}

/* ── Contacto guardado (email / celular pre-llenado) ──────── */
.reimp-contacto-loading[b-x477wpdgsf] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .78rem;
    color: var(--rg-text-muted);
    margin-bottom: .75rem;
    padding: .4rem .6rem;
    background: var(--rg-bg-subtle);
    border-radius: .375rem;
    border: 1px solid var(--rg-border);
}
.reimp-contacto-badge[b-x477wpdgsf] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .65rem;
    font-weight: 600;
    color: var(--rg-success);
    background: rgba(22,163,74,.1);
    border: 1px solid rgba(22,163,74,.25);
    border-radius: 1rem;
    padding: .05rem .45rem;
    margin-left: .35rem;
    vertical-align: middle;
}
[data-mode="dark"] .reimp-contacto-badge[b-x477wpdgsf] {
    color: #86efac;
    background: rgba(22,163,74,.18);
}

/* ── Encabezado del documento en modal envío combinado ───── */
.reimp-envio-doc-info[b-x477wpdgsf] {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    padding: .5rem .75rem;
    margin-bottom: .75rem;
    font-size: .82rem;
    flex-wrap: wrap;
}
.reimp-envio-cliente[b-x477wpdgsf] {
    color: var(--rg-text-secondary);
    font-size: .78rem;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-x477wpdgsf] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-x477wpdgsf] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-x477wpdgsf] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-x477wpdgsf] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmrelaccion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-iup6ewyl8y] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-iup6ewyl8y 0.3s ease-out; }
@keyframes slideUp-b-iup6ewyl8y { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-iup6ewyl8y] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-iup6ewyl8y] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-iup6ewyl8y] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-iup6ewyl8y] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-iup6ewyl8y] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-iup6ewyl8y] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-iup6ewyl8y] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-iup6ewyl8y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-iup6ewyl8y] { filter: brightness(1.1); }
.btn-outline[b-iup6ewyl8y] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-iup6ewyl8y] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-iup6ewyl8y] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-iup6ewyl8y] { filter: brightness(1.1); }
.btn-icon[b-iup6ewyl8y] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-iup6ewyl8y] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-iup6ewyl8y] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-iup6ewyl8y] { color: #ef4444; }
.btn-delete:hover[b-iup6ewyl8y] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-iup6ewyl8y] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-iup6ewyl8y] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-iup6ewyl8y] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-iup6ewyl8y] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-iup6ewyl8y] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-iup6ewyl8y] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-iup6ewyl8y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-iup6ewyl8y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-iup6ewyl8y] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-iup6ewyl8y] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-iup6ewyl8y] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-iup6ewyl8y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-iup6ewyl8y] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-iup6ewyl8y] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-iup6ewyl8y] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-iup6ewyl8y] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-iup6ewyl8y] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-iup6ewyl8y] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-iup6ewyl8y] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-iup6ewyl8y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-iup6ewyl8y] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-iup6ewyl8y] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-iup6ewyl8y] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-iup6ewyl8y] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-iup6ewyl8y] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-iup6ewyl8y] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-iup6ewyl8y] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-iup6ewyl8y] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-iup6ewyl8y] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-iup6ewyl8y] { display: block; }
.hide-on-cards[b-iup6ewyl8y] { display: none !important; }
.show-on-cards[b-iup6ewyl8y] { display: grid; }
.hide-on-grid[b-iup6ewyl8y] { display: none !important; }

/* Badges */
.badge[b-iup6ewyl8y] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-iup6ewyl8y] { background: #ecfdf5; color: #065f46; }
.badge-no[b-iup6ewyl8y] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-iup6ewyl8y] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-iup6ewyl8y] { text-align: center; }
.text-muted[b-iup6ewyl8y] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-iup6ewyl8y], .crud-empty-state[b-iup6ewyl8y] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-iup6ewyl8y] { font-size: 2rem; }
.crud-spinner[b-iup6ewyl8y] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-iup6ewyl8y 0.6s linear infinite; }
.crud-spinner-sm[b-iup6ewyl8y] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-iup6ewyl8y 0.6s linear infinite; }
@keyframes spin-b-iup6ewyl8y { to { transform: rotate(360deg); } }
.spin[b-iup6ewyl8y] { animation: spin-b-iup6ewyl8y 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-iup6ewyl8y] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-iup6ewyl8y 0.15s ease-out; }
.modal-container[b-iup6ewyl8y] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-iup6ewyl8y] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-iup6ewyl8y 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-iup6ewyl8y] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-iup6ewyl8y] { max-width: 420px; }
@keyframes fadeIn-b-iup6ewyl8y { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-iup6ewyl8y { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-iup6ewyl8y] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-iup6ewyl8y] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-iup6ewyl8y] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-iup6ewyl8y] { color: #dc2626; }
.modal-close[b-iup6ewyl8y] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-iup6ewyl8y] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-iup6ewyl8y] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-iup6ewyl8y] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-iup6ewyl8y] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-iup6ewyl8y] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-iup6ewyl8y] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-iup6ewyl8y] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-iup6ewyl8y] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-iup6ewyl8y] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-iup6ewyl8y] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-iup6ewyl8y] { flex: 2; }
.form-group label[b-iup6ewyl8y] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-iup6ewyl8y], .form-group select[b-iup6ewyl8y], .form-textarea[b-iup6ewyl8y] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-iup6ewyl8y], .form-group select:focus[b-iup6ewyl8y], .form-textarea:focus[b-iup6ewyl8y] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-iup6ewyl8y] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-iup6ewyl8y] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-iup6ewyl8y] { flex: 1; display: flex; align-items: center; }
.form-check[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-iup6ewyl8y] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-iup6ewyl8y] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-iup6ewyl8y] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-iup6ewyl8y] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-iup6ewyl8y] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-iup6ewyl8y] { font-size: 3rem; }
.photo-placeholder span[b-iup6ewyl8y] { font-size: 0.78rem; }
.photo-actions[b-iup6ewyl8y] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-iup6ewyl8y] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-iup6ewyl8y] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-iup6ewyl8y] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-iup6ewyl8y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-iup6ewyl8y] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-iup6ewyl8y] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-iup6ewyl8y] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-iup6ewyl8y] { filter: brightness(1.15); transform: scale(1.05); }
[b-iup6ewyl8y] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-iup6ewyl8y] { padding: 0.75rem; }
    .crud-header[b-iup6ewyl8y] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-iup6ewyl8y] { font-size: 1.1rem; }
    .btn-text[b-iup6ewyl8y] { display: none; }
    .form-row[b-iup6ewyl8y] { flex-direction: column; }
    .form-row-4[b-iup6ewyl8y] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-iup6ewyl8y] { width: 98%; max-height: 95vh; }
    .modal-lg[b-iup6ewyl8y] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-iup6ewyl8y] { padding: 0.75rem; }
    .modal-tabs[b-iup6ewyl8y] { overflow-x: auto; }
    .modal-tab[b-iup6ewyl8y] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-iup6ewyl8y] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-iup6ewyl8y] { display: grid !important; }
    .crud-cards-wrapper[b-iup6ewyl8y] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-iup6ewyl8y] { grid-template-columns: 1fr; }
    .card-details[b-iup6ewyl8y] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-iup6ewyl8y] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-iup6ewyl8y] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-iup6ewyl8y] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-iup6ewyl8y] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmreportegarantes.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-aw7jzc2tru] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-aw7jzc2tru 0.3s ease-out; }
@keyframes slideUp-b-aw7jzc2tru { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-aw7jzc2tru] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-aw7jzc2tru] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-aw7jzc2tru] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-aw7jzc2tru] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-aw7jzc2tru] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-aw7jzc2tru] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-aw7jzc2tru] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-aw7jzc2tru] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-aw7jzc2tru] { filter: brightness(1.1); }
.btn-outline[b-aw7jzc2tru] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-aw7jzc2tru] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-aw7jzc2tru] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-aw7jzc2tru] { filter: brightness(1.1); }
.btn-icon[b-aw7jzc2tru] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-aw7jzc2tru] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-aw7jzc2tru] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-aw7jzc2tru] { color: #ef4444; }
.btn-delete:hover[b-aw7jzc2tru] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-aw7jzc2tru] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-aw7jzc2tru] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-aw7jzc2tru] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-aw7jzc2tru] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-aw7jzc2tru] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-aw7jzc2tru] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-aw7jzc2tru] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-aw7jzc2tru] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-aw7jzc2tru] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-aw7jzc2tru] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-aw7jzc2tru] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-aw7jzc2tru] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-aw7jzc2tru] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-aw7jzc2tru] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-aw7jzc2tru] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-aw7jzc2tru] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-aw7jzc2tru] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-aw7jzc2tru] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-aw7jzc2tru] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-aw7jzc2tru] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-aw7jzc2tru] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-aw7jzc2tru] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-aw7jzc2tru] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-aw7jzc2tru] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-aw7jzc2tru] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-aw7jzc2tru] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-aw7jzc2tru] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-aw7jzc2tru] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-aw7jzc2tru] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-aw7jzc2tru] { display: block; }
.hide-on-cards[b-aw7jzc2tru] { display: none !important; }
.show-on-cards[b-aw7jzc2tru] { display: grid; }
.hide-on-grid[b-aw7jzc2tru] { display: none !important; }

/* Badges */
.badge[b-aw7jzc2tru] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-aw7jzc2tru] { background: #ecfdf5; color: #065f46; }
.badge-no[b-aw7jzc2tru] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-aw7jzc2tru] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-aw7jzc2tru] { text-align: center; }
.text-muted[b-aw7jzc2tru] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-aw7jzc2tru], .crud-empty-state[b-aw7jzc2tru] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-aw7jzc2tru] { font-size: 2rem; }
.crud-spinner[b-aw7jzc2tru] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-aw7jzc2tru 0.6s linear infinite; }
.crud-spinner-sm[b-aw7jzc2tru] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-aw7jzc2tru 0.6s linear infinite; }
@keyframes spin-b-aw7jzc2tru { to { transform: rotate(360deg); } }
.spin[b-aw7jzc2tru] { animation: spin-b-aw7jzc2tru 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-aw7jzc2tru] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-aw7jzc2tru 0.15s ease-out; }
.modal-container[b-aw7jzc2tru] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-aw7jzc2tru] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-aw7jzc2tru 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-aw7jzc2tru] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-aw7jzc2tru] { max-width: 420px; }
@keyframes fadeIn-b-aw7jzc2tru { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-aw7jzc2tru { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-aw7jzc2tru] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-aw7jzc2tru] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-aw7jzc2tru] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-aw7jzc2tru] { color: #dc2626; }
.modal-close[b-aw7jzc2tru] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-aw7jzc2tru] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-aw7jzc2tru] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-aw7jzc2tru] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-aw7jzc2tru] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-aw7jzc2tru] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-aw7jzc2tru] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-aw7jzc2tru] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-aw7jzc2tru] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-aw7jzc2tru] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-aw7jzc2tru] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-aw7jzc2tru] { flex: 2; }
.form-group label[b-aw7jzc2tru] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-aw7jzc2tru], .form-group select[b-aw7jzc2tru], .form-textarea[b-aw7jzc2tru] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-aw7jzc2tru], .form-group select:focus[b-aw7jzc2tru], .form-textarea:focus[b-aw7jzc2tru] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-aw7jzc2tru] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-aw7jzc2tru] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-aw7jzc2tru] { flex: 1; display: flex; align-items: center; }
.form-check[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-aw7jzc2tru] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-aw7jzc2tru] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-aw7jzc2tru] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-aw7jzc2tru] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-aw7jzc2tru] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-aw7jzc2tru] { font-size: 3rem; }
.photo-placeholder span[b-aw7jzc2tru] { font-size: 0.78rem; }
.photo-actions[b-aw7jzc2tru] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-aw7jzc2tru] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-aw7jzc2tru] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-aw7jzc2tru] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-aw7jzc2tru] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-aw7jzc2tru] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-aw7jzc2tru] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-aw7jzc2tru] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-aw7jzc2tru] { filter: brightness(1.15); transform: scale(1.05); }
[b-aw7jzc2tru] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-aw7jzc2tru] { padding: 0.75rem; }
    .crud-header[b-aw7jzc2tru] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-aw7jzc2tru] { font-size: 1.1rem; }
    .btn-text[b-aw7jzc2tru] { display: none; }
    .form-row[b-aw7jzc2tru] { flex-direction: column; }
    .form-row-4[b-aw7jzc2tru] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-aw7jzc2tru] { width: 98%; max-height: 95vh; }
    .modal-lg[b-aw7jzc2tru] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-aw7jzc2tru] { padding: 0.75rem; }
    .modal-tabs[b-aw7jzc2tru] { overflow-x: auto; }
    .modal-tab[b-aw7jzc2tru] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-aw7jzc2tru] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-aw7jzc2tru] { display: grid !important; }
    .crud-cards-wrapper[b-aw7jzc2tru] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-aw7jzc2tru] { grid-template-columns: 1fr; }
    .card-details[b-aw7jzc2tru] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-aw7jzc2tru] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-aw7jzc2tru] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-aw7jzc2tru] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-aw7jzc2tru] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmreportegarantiaasignada.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1xpnlz93ow] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1xpnlz93ow 0.3s ease-out; }
@keyframes slideUp-b-1xpnlz93ow { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1xpnlz93ow] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1xpnlz93ow] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1xpnlz93ow] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1xpnlz93ow] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1xpnlz93ow] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1xpnlz93ow] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1xpnlz93ow] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1xpnlz93ow] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1xpnlz93ow] { filter: brightness(1.1); }
.btn-outline[b-1xpnlz93ow] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1xpnlz93ow] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1xpnlz93ow] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1xpnlz93ow] { filter: brightness(1.1); }
.btn-icon[b-1xpnlz93ow] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1xpnlz93ow] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1xpnlz93ow] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1xpnlz93ow] { color: #ef4444; }
.btn-delete:hover[b-1xpnlz93ow] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1xpnlz93ow] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1xpnlz93ow] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1xpnlz93ow] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1xpnlz93ow] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1xpnlz93ow] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1xpnlz93ow] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1xpnlz93ow] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1xpnlz93ow] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1xpnlz93ow] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1xpnlz93ow] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1xpnlz93ow] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1xpnlz93ow] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1xpnlz93ow] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1xpnlz93ow] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1xpnlz93ow] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1xpnlz93ow] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1xpnlz93ow] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1xpnlz93ow] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1xpnlz93ow] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1xpnlz93ow] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1xpnlz93ow] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1xpnlz93ow] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1xpnlz93ow] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1xpnlz93ow] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1xpnlz93ow] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1xpnlz93ow] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1xpnlz93ow] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1xpnlz93ow] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1xpnlz93ow] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1xpnlz93ow] { display: block; }
.hide-on-cards[b-1xpnlz93ow] { display: none !important; }
.show-on-cards[b-1xpnlz93ow] { display: grid; }
.hide-on-grid[b-1xpnlz93ow] { display: none !important; }

/* Badges */
.badge[b-1xpnlz93ow] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1xpnlz93ow] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1xpnlz93ow] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1xpnlz93ow] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1xpnlz93ow] { text-align: center; }
.text-muted[b-1xpnlz93ow] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1xpnlz93ow], .crud-empty-state[b-1xpnlz93ow] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1xpnlz93ow] { font-size: 2rem; }
.crud-spinner[b-1xpnlz93ow] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1xpnlz93ow 0.6s linear infinite; }
.crud-spinner-sm[b-1xpnlz93ow] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1xpnlz93ow 0.6s linear infinite; }
@keyframes spin-b-1xpnlz93ow { to { transform: rotate(360deg); } }
.spin[b-1xpnlz93ow] { animation: spin-b-1xpnlz93ow 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1xpnlz93ow] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1xpnlz93ow 0.15s ease-out; }
.modal-container[b-1xpnlz93ow] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1xpnlz93ow] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1xpnlz93ow 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1xpnlz93ow] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1xpnlz93ow] { max-width: 420px; }
@keyframes fadeIn-b-1xpnlz93ow { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1xpnlz93ow { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1xpnlz93ow] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1xpnlz93ow] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1xpnlz93ow] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1xpnlz93ow] { color: #dc2626; }
.modal-close[b-1xpnlz93ow] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1xpnlz93ow] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1xpnlz93ow] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1xpnlz93ow] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1xpnlz93ow] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1xpnlz93ow] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1xpnlz93ow] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1xpnlz93ow] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1xpnlz93ow] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1xpnlz93ow] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1xpnlz93ow] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1xpnlz93ow] { flex: 2; }
.form-group label[b-1xpnlz93ow] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1xpnlz93ow], .form-group select[b-1xpnlz93ow], .form-textarea[b-1xpnlz93ow] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1xpnlz93ow], .form-group select:focus[b-1xpnlz93ow], .form-textarea:focus[b-1xpnlz93ow] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1xpnlz93ow] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1xpnlz93ow] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1xpnlz93ow] { flex: 1; display: flex; align-items: center; }
.form-check[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1xpnlz93ow] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1xpnlz93ow] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1xpnlz93ow] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1xpnlz93ow] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1xpnlz93ow] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1xpnlz93ow] { font-size: 3rem; }
.photo-placeholder span[b-1xpnlz93ow] { font-size: 0.78rem; }
.photo-actions[b-1xpnlz93ow] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1xpnlz93ow] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1xpnlz93ow] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1xpnlz93ow] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1xpnlz93ow] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1xpnlz93ow] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1xpnlz93ow] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1xpnlz93ow] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1xpnlz93ow] { filter: brightness(1.15); transform: scale(1.05); }
[b-1xpnlz93ow] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1xpnlz93ow] { padding: 0.75rem; }
    .crud-header[b-1xpnlz93ow] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1xpnlz93ow] { font-size: 1.1rem; }
    .btn-text[b-1xpnlz93ow] { display: none; }
    .form-row[b-1xpnlz93ow] { flex-direction: column; }
    .form-row-4[b-1xpnlz93ow] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1xpnlz93ow] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1xpnlz93ow] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1xpnlz93ow] { padding: 0.75rem; }
    .modal-tabs[b-1xpnlz93ow] { overflow-x: auto; }
    .modal-tab[b-1xpnlz93ow] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1xpnlz93ow] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1xpnlz93ow] { display: grid !important; }
    .crud-cards-wrapper[b-1xpnlz93ow] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1xpnlz93ow] { grid-template-columns: 1fr; }
    .card-details[b-1xpnlz93ow] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1xpnlz93ow] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1xpnlz93ow] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1xpnlz93ow] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1xpnlz93ow] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmsolicitudpr.razor.rz.scp.css */
/* ============================================================
   Solicitud Financiamiento — CRUD completo + Modal con Tabs
   Replica el estándar de Frmclientes.razor.css
   ============================================================ */

.crud-container[b-fwcrx9jk46] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fwcrx9jk46 0.3s ease-out; }
@keyframes slideUp-b-fwcrx9jk46 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fwcrx9jk46] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fwcrx9jk46] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fwcrx9jk46] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fwcrx9jk46] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fwcrx9jk46] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fwcrx9jk46] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fwcrx9jk46] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fwcrx9jk46] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fwcrx9jk46] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fwcrx9jk46] { filter: brightness(1.1); }
.btn-outline[b-fwcrx9jk46] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fwcrx9jk46] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fwcrx9jk46] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fwcrx9jk46] { filter: brightness(1.1); }
.btn-icon[b-fwcrx9jk46] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fwcrx9jk46] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fwcrx9jk46] { background: rgba(79, 70, 229, 0.1); }

/* Alert */
.crud-alert[b-fwcrx9jk46] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fwcrx9jk46] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fwcrx9jk46] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fwcrx9jk46] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fwcrx9jk46] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fwcrx9jk46] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fwcrx9jk46] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fwcrx9jk46] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fwcrx9jk46] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fwcrx9jk46] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fwcrx9jk46] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fwcrx9jk46] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fwcrx9jk46] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fwcrx9jk46] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fwcrx9jk46] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fwcrx9jk46] { width: 80px; text-align: center; white-space: nowrap; }
.col-id[b-fwcrx9jk46] { width: 120px; }

/* Badges */
.font-mono[b-fwcrx9jk46] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }

/* Estado badge */
.sf-estado-badge[b-fwcrx9jk46] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--estado-color);
    padding: 0.2rem 0.55rem;
    border-radius: 100px;
    background: color-mix(in srgb, var(--estado-color) 10%, transparent);
    white-space: nowrap;
}
.sf-estado-badge[b-fwcrx9jk46]::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--estado-color);
}

/* Loading / Empty */
.crud-loading[b-fwcrx9jk46], .crud-empty-state[b-fwcrx9jk46] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fwcrx9jk46] { font-size: 2rem; }
.crud-spinner[b-fwcrx9jk46] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fwcrx9jk46 0.6s linear infinite; }
@keyframes spin-b-fwcrx9jk46 { to { transform: rotate(360deg); } }
.spin[b-fwcrx9jk46] { animation: spin-b-fwcrx9jk46 0.8s linear infinite; }

/* ============================================================
   MODAL — Estándar CRUD
   ============================================================ */

.modal-backdrop[b-fwcrx9jk46] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fwcrx9jk46 0.15s ease-out; }
.modal-container[b-fwcrx9jk46] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fwcrx9jk46] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fwcrx9jk46 0.2s ease-out; }
.modal-lg[b-fwcrx9jk46] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
@keyframes fadeIn-b-fwcrx9jk46 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fwcrx9jk46 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fwcrx9jk46] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fwcrx9jk46] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-close[b-fwcrx9jk46] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fwcrx9jk46] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fwcrx9jk46] { padding: 0; overflow-y: auto; flex: 1; }
.modal-footer[b-fwcrx9jk46] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ============================================================
   TABS dentro del Modal
   ============================================================ */

.sf-tabs-main[b-fwcrx9jk46] {
    display: flex;
    gap: 0;
    overflow-x: auto;
    scrollbar-width: thin;
    border-bottom: 2px solid var(--rg-border, #eef0f4);
}

.sf-tabs-modal[b-fwcrx9jk46] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--rg-bg-card, #ffffff);
    padding: 0 0.5rem;
}

.sf-tab-main[b-fwcrx9jk46] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.7rem 0.85rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    color: var(--rg-text-muted, #64748b);
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.sf-tab-main:hover[b-fwcrx9jk46] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-hover, #f8fafc);
}

.sf-tab-main.active[b-fwcrx9jk46] {
    color: var(--rg-primary, #0B8AD9);
    border-bottom-color: var(--rg-primary, #0B8AD9);
    font-weight: 600;
}

.sf-tab-main i[b-fwcrx9jk46] { font-size: 0.85rem; }

.sf-tab-body[b-fwcrx9jk46] { min-height: 400px; }

.sf-modal-subtitle[b-fwcrx9jk46] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #64748b);
    font-weight: 400;
}

.sf-readonly-badge[b-fwcrx9jk46] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.65rem;
    font-weight: 600;
    color: #f59e0b;
    background: rgba(245, 158, 11, 0.1);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    margin-left: 0.5rem;
    vertical-align: middle;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {
    .crud-container[b-fwcrx9jk46] { padding: 0.75rem; }
    .crud-header[b-fwcrx9jk46] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fwcrx9jk46] { font-size: 1.1rem; }
    .btn-text[b-fwcrx9jk46] { display: none; }
    .modal-dialog[b-fwcrx9jk46] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fwcrx9jk46] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .sf-tab-main[b-fwcrx9jk46] { padding: 0.55rem 0.5rem; font-size: 0.7rem; }
    .sf-tab-text[b-fwcrx9jk46] { display: none; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-fwcrx9jk46] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fwcrx9jk46] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fwcrx9jk46] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fwcrx9jk46] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmtablaamortizacion.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1bfqx9p9pt] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1bfqx9p9pt 0.3s ease-out; }
@keyframes slideUp-b-1bfqx9p9pt { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1bfqx9p9pt] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1bfqx9p9pt] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1bfqx9p9pt] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1bfqx9p9pt] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1bfqx9p9pt] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1bfqx9p9pt] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1bfqx9p9pt] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1bfqx9p9pt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1bfqx9p9pt] { filter: brightness(1.1); }
.btn-outline[b-1bfqx9p9pt] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1bfqx9p9pt] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1bfqx9p9pt] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1bfqx9p9pt] { filter: brightness(1.1); }
.btn-icon[b-1bfqx9p9pt] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1bfqx9p9pt] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1bfqx9p9pt] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1bfqx9p9pt] { color: #ef4444; }
.btn-delete:hover[b-1bfqx9p9pt] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1bfqx9p9pt] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1bfqx9p9pt] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1bfqx9p9pt] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1bfqx9p9pt] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1bfqx9p9pt] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1bfqx9p9pt] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1bfqx9p9pt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1bfqx9p9pt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1bfqx9p9pt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1bfqx9p9pt] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1bfqx9p9pt] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1bfqx9p9pt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1bfqx9p9pt] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1bfqx9p9pt] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1bfqx9p9pt] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1bfqx9p9pt] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1bfqx9p9pt] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1bfqx9p9pt] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1bfqx9p9pt] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1bfqx9p9pt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1bfqx9p9pt] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1bfqx9p9pt] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1bfqx9p9pt] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1bfqx9p9pt] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1bfqx9p9pt] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1bfqx9p9pt] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1bfqx9p9pt] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1bfqx9p9pt] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1bfqx9p9pt] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1bfqx9p9pt] { display: block; }
.hide-on-cards[b-1bfqx9p9pt] { display: none !important; }
.show-on-cards[b-1bfqx9p9pt] { display: grid; }
.hide-on-grid[b-1bfqx9p9pt] { display: none !important; }

/* Badges */
.badge[b-1bfqx9p9pt] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1bfqx9p9pt] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1bfqx9p9pt] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1bfqx9p9pt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1bfqx9p9pt] { text-align: center; }
.text-muted[b-1bfqx9p9pt] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1bfqx9p9pt], .crud-empty-state[b-1bfqx9p9pt] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1bfqx9p9pt] { font-size: 2rem; }
.crud-spinner[b-1bfqx9p9pt] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1bfqx9p9pt 0.6s linear infinite; }
.crud-spinner-sm[b-1bfqx9p9pt] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1bfqx9p9pt 0.6s linear infinite; }
@keyframes spin-b-1bfqx9p9pt { to { transform: rotate(360deg); } }
.spin[b-1bfqx9p9pt] { animation: spin-b-1bfqx9p9pt 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1bfqx9p9pt] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1bfqx9p9pt 0.15s ease-out; }
.modal-container[b-1bfqx9p9pt] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1bfqx9p9pt] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1bfqx9p9pt 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-1bfqx9p9pt] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1bfqx9p9pt] { max-width: 420px; }
@keyframes fadeIn-b-1bfqx9p9pt { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1bfqx9p9pt { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1bfqx9p9pt] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1bfqx9p9pt] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1bfqx9p9pt] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1bfqx9p9pt] { color: #dc2626; }
.modal-close[b-1bfqx9p9pt] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1bfqx9p9pt] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1bfqx9p9pt] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1bfqx9p9pt] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1bfqx9p9pt] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1bfqx9p9pt] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1bfqx9p9pt] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1bfqx9p9pt] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1bfqx9p9pt] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1bfqx9p9pt] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1bfqx9p9pt] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1bfqx9p9pt] { flex: 2; }
.form-group label[b-1bfqx9p9pt] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1bfqx9p9pt], .form-group select[b-1bfqx9p9pt], .form-textarea[b-1bfqx9p9pt] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1bfqx9p9pt], .form-group select:focus[b-1bfqx9p9pt], .form-textarea:focus[b-1bfqx9p9pt] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1bfqx9p9pt] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1bfqx9p9pt] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1bfqx9p9pt] { flex: 1; display: flex; align-items: center; }
.form-check[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1bfqx9p9pt] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1bfqx9p9pt] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1bfqx9p9pt] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1bfqx9p9pt] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1bfqx9p9pt] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1bfqx9p9pt] { font-size: 3rem; }
.photo-placeholder span[b-1bfqx9p9pt] { font-size: 0.78rem; }
.photo-actions[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1bfqx9p9pt] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-1bfqx9p9pt] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1bfqx9p9pt] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1bfqx9p9pt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1bfqx9p9pt] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1bfqx9p9pt] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1bfqx9p9pt] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1bfqx9p9pt] { filter: brightness(1.15); transform: scale(1.05); }
[b-1bfqx9p9pt] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1bfqx9p9pt] { padding: 0.75rem; }
    .crud-header[b-1bfqx9p9pt] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1bfqx9p9pt] { font-size: 1.1rem; }
    .btn-text[b-1bfqx9p9pt] { display: none; }
    .form-row[b-1bfqx9p9pt] { flex-direction: column; }
    .form-row-4[b-1bfqx9p9pt] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1bfqx9p9pt] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1bfqx9p9pt] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1bfqx9p9pt] { padding: 0.75rem; }
    .modal-tabs[b-1bfqx9p9pt] { overflow-x: auto; }
    .modal-tab[b-1bfqx9p9pt] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1bfqx9p9pt] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1bfqx9p9pt] { display: grid !important; }
    .crud-cards-wrapper[b-1bfqx9p9pt] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1bfqx9p9pt] { grid-template-columns: 1fr; }
    .card-details[b-1bfqx9p9pt] { flex-direction: column; gap: 0.35rem; }
}

/* ============================================================
   Cotización Tabla de Amortización — extras
   ============================================================ */

/* Modal de tamaño fijo, sin alto forzado */
.modal-amort[b-1bfqx9p9pt] { max-width: 1100px; width: calc(100% - 2rem); max-height: calc(100vh - 80px); border-radius: 0.5rem; }

/* Fila compacta con todos los parámetros en línea */
.amort-compact-row[b-1bfqx9p9pt] { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: flex-end; margin-bottom: 0.5rem; padding: 0.5rem 0.6rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; }
.amort-compact-row .form-group[b-1bfqx9p9pt] { flex: 1; min-width: 80px; }
.amort-compact-row .form-group label[b-1bfqx9p9pt] { font-size: 0.64rem; }
.amort-compact-row .form-group input[b-1bfqx9p9pt],
.amort-compact-row .form-group select[b-1bfqx9p9pt] { padding: 0.3rem 0.4rem; font-size: 0.75rem; }

.amort-preview[b-1bfqx9p9pt] { margin-top: 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; }
.amort-preview-header[b-1bfqx9p9pt] { background: var(--rg-bg-sidebar, #f8fafc); padding: 0.5rem 0.75rem; display: flex; gap: 1rem; font-size: 0.75rem; color: var(--rg-text-secondary, #475569); border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-wrap: wrap; }
.amort-preview-header strong[b-1bfqx9p9pt] { color: var(--rg-text-primary, #1e293b); margin-left: 0.35rem; font-variant-numeric: tabular-nums; }
.amort-grid-wrapper[b-1bfqx9p9pt] { max-height: 360px; overflow: auto; }
.amort-grid[b-1bfqx9p9pt] { width: 100%; border-collapse: collapse; font-size: 0.76rem; font-variant-numeric: tabular-nums; }
.amort-grid thead[b-1bfqx9p9pt] { position: sticky; top: 0; z-index: 10; }
.amort-grid th[b-1bfqx9p9pt] { background: var(--rg-bg-sidebar, #f8fafc); padding: 0.45rem 0.5rem; text-align: right; font-weight: 600; font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-secondary, #475569); border-bottom: 2px solid var(--rg-border, #e2e8f0); }
.amort-grid th.num-center[b-1bfqx9p9pt] { text-align: center; }
.amort-grid th.num-left[b-1bfqx9p9pt]   { text-align: left;   }
.amort-grid td[b-1bfqx9p9pt] { padding: 0.35rem 0.5rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); text-align: right; color: var(--rg-text-primary, #1e293b); }
.amort-grid td.num-center[b-1bfqx9p9pt] { text-align: center; }
.amort-grid td.num-left[b-1bfqx9p9pt]   { text-align: left;   }
.amort-grid tr.total-row td[b-1bfqx9p9pt] { background: var(--rg-bg-sidebar, #f8fafc); font-weight: 700; border-top: 2px solid var(--rg-border, #e2e8f0); }

.amort-empty[b-1bfqx9p9pt] { padding: 2rem; text-align: center; color: var(--rg-text-muted, #94a3b8); font-size: 0.8rem; }

.cliente-lookup[b-1bfqx9p9pt] { position: relative; }
.cliente-suggestions[b-1bfqx9p9pt] { position: absolute; top: 100%; left: 0; right: 0; background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; max-height: 240px; overflow-y: auto; z-index: 50; box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.cliente-suggestion[b-1bfqx9p9pt] { padding: 0.45rem 0.65rem; cursor: pointer; font-size: 0.78rem; display: flex; gap: 0.5rem; align-items: center; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); }
.cliente-suggestion:hover[b-1bfqx9p9pt] { background: var(--rg-bg-hover, #f1f5f9); }
.cliente-suggestion .cli-id[b-1bfqx9p9pt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); min-width: 90px; }
.cliente-suggestion .cli-name[b-1bfqx9p9pt] { color: var(--rg-text-primary, #1e293b); flex: 1; }

[data-mode="dark"] .crud-alert.success[b-1bfqx9p9pt] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.3); }
[data-mode="dark"] .crud-alert.error[b-1bfqx9p9pt]   { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.3); }
[data-mode="dark"] .badge-yes[b-1bfqx9p9pt] { background: rgba(34,197,94,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-1bfqx9p9pt]  { background: rgba(148,163,184,0.15); color: #cbd5e1; }

/* ── Acordeón de parámetros ── */
.amort-panels[b-1bfqx9p9pt] { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 0.6rem; }
.amort-panel[b-1bfqx9p9pt]  { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; }
.amort-panel-hdr[b-1bfqx9p9pt] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle, #f8fafc); cursor: pointer; font-size: 0.8rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); user-select: none; }
.amort-panel-hdr:hover[b-1bfqx9p9pt] { background: var(--rg-bg-hover, #f1f5f9); }
.amort-panel-hdr i[b-1bfqx9p9pt] { color: var(--rg-accent, #4f46e5); }
.amort-panel-hdr .ms-auto[b-1bfqx9p9pt] { margin-left: auto; font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.amort-panel-body[b-1bfqx9p9pt] { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0.6rem 0.75rem; background: var(--rg-bg-card, #fff); }
.amort-panel-body .form-group[b-1bfqx9p9pt] { flex: 1; min-width: 130px; }

/* ── Tarjeta de resultados ── */
.amort-card[b-1bfqx9p9pt] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: hidden; }

/* ── Fila de totales dentro del <thead> — se alinea automáticamente con las columnas ── */
.amort-stat-row td[b-1bfqx9p9pt] { padding: 0.45rem 0.5rem; text-align: center; vertical-align: middle; border-bottom: 1px solid var(--rg-border, #e2e8f0); border-right: 2px solid var(--rg-bg-card, #fff); }
.amort-stat-row td:last-child[b-1bfqx9p9pt] { border-right: none; }
.stat-label[b-1bfqx9p9pt] { display: block; font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 700; margin-bottom: 0.1rem; }
.stat-value[b-1bfqx9p9pt] { display: block; font-size: 0.88rem; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Fondos SÓLIDOS — crítico para que las filas no se vean al hacer scroll detrás del sticky */
.stat-cuotas[b-1bfqx9p9pt]  { background: #eef2ff; }
.stat-cuotas  .stat-label[b-1bfqx9p9pt]  { color: #4f46e5; }
.stat-cuotas  .stat-value[b-1bfqx9p9pt]  { color: #3730a3; font-size: 1rem; letter-spacing: 0.05em; }

.stat-capital[b-1bfqx9p9pt] { background: #f0fdf4; }
.stat-capital .stat-label[b-1bfqx9p9pt]  { color: #16a34a; }
.stat-capital .stat-value[b-1bfqx9p9pt]  { color: #15803d; }

.stat-interes[b-1bfqx9p9pt] { background: #fff7ed; }
.stat-interes .stat-label[b-1bfqx9p9pt]  { color: #ea580c; }
.stat-interes .stat-value[b-1bfqx9p9pt]  { color: #c2410c; }

.stat-total[b-1bfqx9p9pt]   { background: #faf5ff; }
.stat-total   .stat-label[b-1bfqx9p9pt]  { color: #9333ea; }
.stat-total   .stat-value[b-1bfqx9p9pt]  { color: #7e22ce; }

.stat-blank[b-1bfqx9p9pt]   { background: #f8fafc; }

.stat-comision[b-1bfqx9p9pt]{ background: #f0fdfa; }
.stat-comision .stat-label[b-1bfqx9p9pt] { color: #0d9488; }
.stat-comision .stat-value[b-1bfqx9p9pt] { color: #0f766e; }

.stat-seguro[b-1bfqx9p9pt]  { background: #e0e7ff; }
.stat-seguro  .stat-label[b-1bfqx9p9pt]  { color: #4f46e5; }
.stat-seguro  .stat-value[b-1bfqx9p9pt]  { color: #4338ca; }

/* ── Número de cuota ── */
.cuota-num[b-1bfqx9p9pt] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }

/* ── Utilidades ── */
.w-100[b-1bfqx9p9pt] { width: 100%; }
.ms-auto[b-1bfqx9p9pt] { margin-left: auto; }

/* ── Spinner pequeño para botón Calcular ── */
.crud-spinner-sm[b-1bfqx9p9pt] { display: inline-block; width: 0.85rem; height: 0.85rem; border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%; animation: spin-b-1bfqx9p9pt 0.7s linear infinite; }
@keyframes spin-b-1bfqx9p9pt { to { transform: rotate(360deg); } }

/* ── Nota textarea — ocupa todo el ancho del panel ── */
.form-group-full[b-1bfqx9p9pt] { flex: 0 0 100%; min-width: 100%; }
.amort-panel-body textarea[b-1bfqx9p9pt] { width: 100%; background: var(--rg-bg-input, #fff); color: var(--rg-text-primary, #1e293b); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 6px; padding: 0.4rem 0.6rem; font-size: 0.8rem; resize: vertical; }
.amort-panel-body textarea:focus[b-1bfqx9p9pt] { border-color: var(--rg-primary, #1a3a5c); outline: none; box-shadow: 0 0 0 3px rgba(26,58,92,0.12); }

/* ── Dark mode acordeón y tarjeta ── */
[data-mode="dark"] .amort-panel-hdr[b-1bfqx9p9pt]  { background: var(--rg-bg-subtle, #1e2a38); }
[data-mode="dark"] .amort-panel-body[b-1bfqx9p9pt] { background: var(--rg-bg-card, #16202e); }
[data-mode="dark"] .amort-card[b-1bfqx9p9pt]       { border-color: var(--rg-border, #2d3a4a); }
[data-mode="dark"] .amort-stat-row td[b-1bfqx9p9pt] { border-right-color: #16202e; }
[data-mode="dark"] .stat-cuotas[b-1bfqx9p9pt]   { background: #1e1b4b; }
[data-mode="dark"] .stat-cuotas   .stat-label[b-1bfqx9p9pt] { color: #818cf8; }
[data-mode="dark"] .stat-cuotas   .stat-value[b-1bfqx9p9pt] { color: #a5b4fc; }
[data-mode="dark"] .stat-capital[b-1bfqx9p9pt]  { background: #052e16; }
[data-mode="dark"] .stat-capital  .stat-label[b-1bfqx9p9pt] { color: #4ade80; }
[data-mode="dark"] .stat-capital  .stat-value[b-1bfqx9p9pt] { color: #86efac; }
[data-mode="dark"] .stat-interes[b-1bfqx9p9pt]  { background: #431407; }
[data-mode="dark"] .stat-interes  .stat-label[b-1bfqx9p9pt] { color: #fb923c; }
[data-mode="dark"] .stat-interes  .stat-value[b-1bfqx9p9pt] { color: #fdba74; }
[data-mode="dark"] .stat-total[b-1bfqx9p9pt]    { background: #2e1065; }
[data-mode="dark"] .stat-total    .stat-label[b-1bfqx9p9pt] { color: #c084fc; }
[data-mode="dark"] .stat-total    .stat-value[b-1bfqx9p9pt] { color: #e9d5ff; }
[data-mode="dark"] .stat-blank[b-1bfqx9p9pt]    { background: #1e2a38; }
[data-mode="dark"] .stat-comision[b-1bfqx9p9pt] { background: #042f2e; }
[data-mode="dark"] .stat-comision .stat-label[b-1bfqx9p9pt] { color: #2dd4bf; }
[data-mode="dark"] .stat-comision .stat-value[b-1bfqx9p9pt] { color: #5eead4; }
[data-mode="dark"] .stat-seguro[b-1bfqx9p9pt]   { background: #1e1b4b; }
[data-mode="dark"] .stat-seguro   .stat-label[b-1bfqx9p9pt] { color: #818cf8; }
[data-mode="dark"] .stat-seguro   .stat-value[b-1bfqx9p9pt] { color: #a5b4fc; }
[data-mode="dark"] .amort-panel-body textarea[b-1bfqx9p9pt]  { background: var(--rg-bg-input, #1e2a38); color: var(--rg-text-primary, #e2e8f0); border-color: var(--rg-border, #2d3a4a); }

/* ── Impresión / PDF ── */
@media print {
    body > *[b-1bfqx9p9pt] { display: none !important; }
    .modal-backdrop[b-1bfqx9p9pt] { display: none !important; }
    .modal-container[b-1bfqx9p9pt] { display: block !important; position: static !important; width: 100% !important; overflow: visible !important; }
    .modal-dialog[b-1bfqx9p9pt] { box-shadow: none !important; max-width: 100% !important; max-height: none !important; border-radius: 0 !important; }
    .modal-body[b-1bfqx9p9pt] { overflow: visible !important; flex: 1 !important; }
    .modal-footer[b-1bfqx9p9pt], .modal-close[b-1bfqx9p9pt], .amort-panels[b-1bfqx9p9pt], .crud-alert[b-1bfqx9p9pt] { display: none !important; }
    .amort-grid-wrapper[b-1bfqx9p9pt] { max-height: none !important; overflow: visible !important; }
    .amort-stat-row .stat-cuotas[b-1bfqx9p9pt]  { background: #ede9fe !important; -webkit-print-color-adjust: exact; }
    .amort-stat-row .stat-capital[b-1bfqx9p9pt] { background: #dcfce7 !important; -webkit-print-color-adjust: exact; }
    .amort-stat-row .stat-interes[b-1bfqx9p9pt] { background: #fff7ed !important; -webkit-print-color-adjust: exact; }
    .amort-stat-row .stat-total[b-1bfqx9p9pt]   { background: #faf5ff !important; -webkit-print-color-adjust: exact; }
    .amort-grid tr.total-row td[b-1bfqx9p9pt]   { background: #f1f5f9 !important; -webkit-print-color-adjust: exact; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-1bfqx9p9pt] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1bfqx9p9pt] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1bfqx9p9pt] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1bfqx9p9pt] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/Frmtipo_amortizacion.razor.rz.scp.css */
/* ============================================================
   Tipos de Amortizacion — Estilos CRUD estándar
   Copiado del canónico Frmclientes.razor.css
   ============================================================ */

.crud-container[b-8r3id32r93] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8r3id32r93 0.3s ease-out; }
@keyframes slideUp-b-8r3id32r93 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8r3id32r93] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8r3id32r93] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8r3id32r93] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8r3id32r93] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8r3id32r93] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8r3id32r93] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8r3id32r93] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8r3id32r93] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8r3id32r93] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8r3id32r93] { filter: brightness(1.1); }
.btn-outline[b-8r3id32r93] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8r3id32r93] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8r3id32r93] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8r3id32r93] { filter: brightness(1.1); }
.btn-icon[b-8r3id32r93] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8r3id32r93] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8r3id32r93] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8r3id32r93] { color: #ef4444; }
.btn-delete:hover[b-8r3id32r93] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-8r3id32r93] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8r3id32r93] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8r3id32r93] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8r3id32r93] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8r3id32r93] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8r3id32r93] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8r3id32r93] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8r3id32r93] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8r3id32r93] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8r3id32r93] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8r3id32r93] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8r3id32r93] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8r3id32r93] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8r3id32r93] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8r3id32r93] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8r3id32r93] { width: 80px; text-align: center; white-space: nowrap; }

/* Icono tipo amortizacion (avatar columna) */
.tipo-icon-sm[b-8r3id32r93] {
    width: 32px; height: 32px; border-radius: 6px;
    background: rgba(239, 108, 0, 0.1);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.tipo-icon-sm i[b-8r3id32r93] { color: #ef6c00; font-size: 1rem; }
[data-mode="dark"] .tipo-icon-sm[b-8r3id32r93] { background: rgba(239, 108, 0, 0.18); }
[data-mode="dark"] .tipo-icon-sm i[b-8r3id32r93] { color: #ffb74d; }

/* Badges */
.badge[b-8r3id32r93] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8r3id32r93] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8r3id32r93] { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-8r3id32r93] { background: rgba(34,197,94,0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-8r3id32r93] { background: rgba(100,116,139,0.15); color: #94a3b8; }

/* Utilities */
.font-mono[b-8r3id32r93] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8r3id32r93] { text-align: center; }
.text-muted[b-8r3id32r93] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8r3id32r93], .crud-empty-state[b-8r3id32r93] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8r3id32r93] { font-size: 2.5rem; opacity: 0.4; }
.crud-spinner[b-8r3id32r93] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8r3id32r93 0.6s linear infinite; }
.crud-spinner-sm[b-8r3id32r93] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8r3id32r93 0.6s linear infinite; }
@keyframes spin-b-8r3id32r93 { to { transform: rotate(360deg); } }
.spin[b-8r3id32r93] { animation: spin-b-8r3id32r93 0.8s linear infinite; }

/* Modal */
.modal-backdrop[b-8r3id32r93] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8r3id32r93 0.15s ease-out; }
.modal-container[b-8r3id32r93] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8r3id32r93] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8r3id32r93 0.2s ease-out; }
.modal-sm[b-8r3id32r93] { max-width: 420px; }
@keyframes fadeIn-b-8r3id32r93 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8r3id32r93 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8r3id32r93] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8r3id32r93] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8r3id32r93] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8r3id32r93] { color: #dc2626; }
[data-mode="dark"] .modal-header-danger h2[b-8r3id32r93] { color: #f87171; }
.modal-close[b-8r3id32r93] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8r3id32r93] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8r3id32r93] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8r3id32r93] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Form */
.form-row[b-8r3id32r93] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8r3id32r93] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group label[b-8r3id32r93] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8r3id32r93], .form-group select[b-8r3id32r93] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8r3id32r93], .form-group select:focus[b-8r3id32r93] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8r3id32r93] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8r3id32r93] { padding: 0.75rem; }
    .crud-header[b-8r3id32r93] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8r3id32r93] { font-size: 1.1rem; }
    .btn-text[b-8r3id32r93] { display: none; }
    .form-row[b-8r3id32r93] { flex-direction: column; }
    .modal-dialog[b-8r3id32r93] { width: 98%; max-height: 95vh; }
    .modal-body[b-8r3id32r93] { padding: 0.75rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-8r3id32r93] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8r3id32r93] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8r3id32r93] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8r3id32r93] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Prestamos/_Components/AgingTablePrestamo.razor.rz.scp.css */
/* ============================================================
   AgingTablePrestamo — tinte por bucket, dark mode listo
   ============================================================ */

.agp-wrapper[b-0ue5s8eah1] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.6rem;
    overflow: hidden;
    margin-top: 0.5rem;
}

.agp-table[b-0ue5s8eah1] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}

.agp-table thead th[b-0ue5s8eah1] {
    position: sticky;
    top: 0;
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.55rem 0.6rem;
    border-bottom: 2px solid var(--rg-border);
    text-align: left;
}

.agp-table thead th.agp-num[b-0ue5s8eah1] { text-align: right; }

.agp-table tbody td[b-0ue5s8eah1] {
    padding: 0.45rem 0.6rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: top;
}

.agp-table tbody tr:hover td[b-0ue5s8eah1] { background: var(--rg-bg-hover); }

.agp-num[b-0ue5s8eah1] { text-align: right; font-variant-numeric: tabular-nums; }

.agp-sub[b-0ue5s8eah1] {
    display: block;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-top: 0.1rem;
}

.agp-total[b-0ue5s8eah1] { color: var(--rg-text-primary); font-weight: 700; }

/* ── Tintes de bucket (header) ─────────────────────────────── */
.agp-th-vig[b-0ue5s8eah1]     { color: #166534; }
.agp-th-30[b-0ue5s8eah1]      { color: #854d0e; }
.agp-th-60[b-0ue5s8eah1]      { color: #92400e; }
.agp-th-90[b-0ue5s8eah1]      { color: #9a3412; }
.agp-th-180[b-0ue5s8eah1]     { color: #b91c1c; }
.agp-th-360[b-0ue5s8eah1]     { color: #991b1b; }
.agp-th-castigo[b-0ue5s8eah1] { color: #7f1d1d; }

/* ── Tintes de bucket (celdas con valor) ───────────────────── */
.agp-cell-vig[b-0ue5s8eah1]     { background: rgba(22,163,74,0.06);  color: #166534; }
.agp-cell-30[b-0ue5s8eah1]      { background: rgba(234,179,8,0.07);  color: #854d0e; }
.agp-cell-60[b-0ue5s8eah1]      { background: rgba(245,158,11,0.08); color: #92400e; }
.agp-cell-90[b-0ue5s8eah1]      { background: rgba(249,115,22,0.10); color: #9a3412; }
.agp-cell-180[b-0ue5s8eah1]     { background: rgba(239,68,68,0.10);  color: #b91c1c; }
.agp-cell-360[b-0ue5s8eah1]     { background: rgba(220,38,38,0.13);  color: #991b1b; font-weight: 600; }
.agp-cell-castigo[b-0ue5s8eah1] { background: rgba(127,29,29,0.18);  color: #7f1d1d; font-weight: 700; }

/* ── Footer (totales y %) ──────────────────────────────────── */
.agp-foot td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
    border-top: 2px solid var(--rg-border);
}
.agp-foot-pct td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-size: 0.72rem;
    font-weight: 600;
    border-bottom: none;
}

.agp-empty[b-0ue5s8eah1] {
    text-align: center;
    color: var(--rg-text-muted);
    font-style: italic;
    padding: 2rem;
}

/* ── Agrupación visual por producto (modo prestamo) ─────────── */
.agp-group-header td[b-0ue5s8eah1] {
    background: var(--rg-primary);
    color: #fff;
    font-size: 0.78rem;
    padding: 0.5rem 0.7rem;
    border-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    cursor: pointer;
    user-select: none;
    transition: background 0.12s;
}
.agp-group-header:hover td[b-0ue5s8eah1] { background: #122a44; }
[data-mode="dark"] .agp-group-header:hover td[b-0ue5s8eah1] { background: #1d4ed8; }

.agp-group-header td i[b-0ue5s8eah1] { margin-right: 0.4rem; }
.agp-group-id[b-0ue5s8eah1]        { opacity: 0.7; font-size: 0.7rem; margin-left: 0.4rem; font-family: 'Cascadia Code','Fira Code',monospace; }
.agp-group-count[b-0ue5s8eah1]     { opacity: 0.85; font-size: 0.72rem; margin-left: 0.5rem; font-weight: 400; }
.agp-group-totalhint[b-0ue5s8eah1] { float: right; opacity: 0.95; font-weight: 700; font-size: 0.78rem; font-variant-numeric: tabular-nums; }

.agp-chevron[b-0ue5s8eah1] { transition: transform 0.15s ease; display: inline-block; }

/* ── Modo producto: fila producto clickable ─────────────────── */
.agp-producto-row[b-0ue5s8eah1] {
    cursor: pointer;
    user-select: none;
    transition: background 0.12s;
}
.agp-producto-row:hover td[b-0ue5s8eah1] { background: var(--rg-bg-hover); }
.agp-producto-row.agp-producto-open td[b-0ue5s8eah1] {
    background: rgba(26, 58, 92, 0.08);
    font-weight: 600;
}
[data-mode="dark"] .agp-producto-row.agp-producto-open td[b-0ue5s8eah1] { background: rgba(99, 179, 237, 0.10); }

.agp-detail-row td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    border-top: 1px dashed var(--rg-border);
    font-size: 0.78rem;
}

.agp-detail-subheader td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-weight: 700;
    border-top: 1px solid var(--rg-border);
    border-bottom: 1px solid var(--rg-border);
    padding: 0.35rem 0.6rem;
}

.agp-detail-loading td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    text-align: center;
    color: var(--rg-text-muted);
    font-style: italic;
    padding: 1rem;
}

.agp-group-subtotal td[b-0ue5s8eah1] {
    background: var(--rg-bg-subtle);
    font-weight: 700;
    font-size: 0.78rem;
    border-top: 1px solid var(--rg-border);
    border-bottom: 2px solid var(--rg-border);
}
.agp-group-subtotal td:first-child[b-0ue5s8eah1] {
    color: var(--rg-text-muted);
    font-style: italic;
    font-weight: 600;
}

[data-mode="dark"] .agp-group-header td[b-0ue5s8eah1] { background: var(--rg-accent); }

/* ── Dark mode ─────────────────────────────────────────────── */
[data-mode="dark"] .agp-th-vig[b-0ue5s8eah1]     { color: #86efac; }
[data-mode="dark"] .agp-th-30[b-0ue5s8eah1]      { color: #fde68a; }
[data-mode="dark"] .agp-th-60[b-0ue5s8eah1]      { color: #fcd34d; }
[data-mode="dark"] .agp-th-90[b-0ue5s8eah1]      { color: #fdba74; }
[data-mode="dark"] .agp-th-180[b-0ue5s8eah1]     { color: #fca5a5; }
[data-mode="dark"] .agp-th-360[b-0ue5s8eah1]     { color: #f87171; }
[data-mode="dark"] .agp-th-castigo[b-0ue5s8eah1] { color: #ef4444; }

[data-mode="dark"] .agp-cell-vig[b-0ue5s8eah1]     { color: #86efac; }
[data-mode="dark"] .agp-cell-30[b-0ue5s8eah1]      { color: #fde68a; }
[data-mode="dark"] .agp-cell-60[b-0ue5s8eah1]      { color: #fcd34d; }
[data-mode="dark"] .agp-cell-90[b-0ue5s8eah1]      { color: #fdba74; }
[data-mode="dark"] .agp-cell-180[b-0ue5s8eah1]     { color: #fca5a5; }
[data-mode="dark"] .agp-cell-360[b-0ue5s8eah1]     { color: #f87171; }
[data-mode="dark"] .agp-cell-castigo[b-0ue5s8eah1] { color: #ef4444; }
/* _content/Rgclouds.Web/Components/Pages/Presupuesto/Frmctbpresupuesto.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-4g1yk5gj0z] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-4g1yk5gj0z 0.3s ease-out; }
@keyframes slideUp-b-4g1yk5gj0z { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-4g1yk5gj0z] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-4g1yk5gj0z] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-4g1yk5gj0z] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-4g1yk5gj0z] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-4g1yk5gj0z] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-4g1yk5gj0z] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-4g1yk5gj0z] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-4g1yk5gj0z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-4g1yk5gj0z] { filter: brightness(1.1); }
.btn-outline[b-4g1yk5gj0z] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-4g1yk5gj0z] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-4g1yk5gj0z] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-4g1yk5gj0z] { filter: brightness(1.1); }
.btn-icon[b-4g1yk5gj0z] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-4g1yk5gj0z] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-4g1yk5gj0z] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-4g1yk5gj0z] { color: #ef4444; }
.btn-delete:hover[b-4g1yk5gj0z] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-4g1yk5gj0z] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-4g1yk5gj0z] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-4g1yk5gj0z] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-4g1yk5gj0z] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-4g1yk5gj0z] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-4g1yk5gj0z] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-4g1yk5gj0z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-4g1yk5gj0z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-4g1yk5gj0z] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-4g1yk5gj0z] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-4g1yk5gj0z] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-4g1yk5gj0z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-4g1yk5gj0z] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-4g1yk5gj0z] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-4g1yk5gj0z] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-4g1yk5gj0z] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-4g1yk5gj0z] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-4g1yk5gj0z] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-4g1yk5gj0z] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-4g1yk5gj0z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-4g1yk5gj0z] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-4g1yk5gj0z] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-4g1yk5gj0z] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-4g1yk5gj0z] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-4g1yk5gj0z] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-4g1yk5gj0z] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-4g1yk5gj0z] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-4g1yk5gj0z] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-4g1yk5gj0z] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-4g1yk5gj0z] { display: block; }
.hide-on-cards[b-4g1yk5gj0z] { display: none !important; }
.show-on-cards[b-4g1yk5gj0z] { display: grid; }
.hide-on-grid[b-4g1yk5gj0z] { display: none !important; }

/* Badges */
.badge[b-4g1yk5gj0z] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-4g1yk5gj0z] { background: #ecfdf5; color: #065f46; }
.badge-no[b-4g1yk5gj0z] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-4g1yk5gj0z] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-4g1yk5gj0z] { text-align: center; }
.text-muted[b-4g1yk5gj0z] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-4g1yk5gj0z], .crud-empty-state[b-4g1yk5gj0z] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-4g1yk5gj0z] { font-size: 2rem; }
.crud-spinner[b-4g1yk5gj0z] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-4g1yk5gj0z 0.6s linear infinite; }
.crud-spinner-sm[b-4g1yk5gj0z] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4g1yk5gj0z 0.6s linear infinite; }
@keyframes spin-b-4g1yk5gj0z { to { transform: rotate(360deg); } }
.spin[b-4g1yk5gj0z] { animation: spin-b-4g1yk5gj0z 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-4g1yk5gj0z] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-4g1yk5gj0z 0.15s ease-out; }
.modal-container[b-4g1yk5gj0z] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-4g1yk5gj0z] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-4g1yk5gj0z 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-4g1yk5gj0z] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-4g1yk5gj0z] { max-width: 420px; }
@keyframes fadeIn-b-4g1yk5gj0z { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-4g1yk5gj0z { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-4g1yk5gj0z] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-4g1yk5gj0z] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-4g1yk5gj0z] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-4g1yk5gj0z] { color: #dc2626; }
.modal-close[b-4g1yk5gj0z] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-4g1yk5gj0z] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-4g1yk5gj0z] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-4g1yk5gj0z] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-4g1yk5gj0z] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-4g1yk5gj0z] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-4g1yk5gj0z] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-4g1yk5gj0z] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-4g1yk5gj0z] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-4g1yk5gj0z] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-4g1yk5gj0z] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-4g1yk5gj0z] { flex: 2; }
.form-group label[b-4g1yk5gj0z] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-4g1yk5gj0z], .form-group select[b-4g1yk5gj0z], .form-textarea[b-4g1yk5gj0z] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-4g1yk5gj0z], .form-group select:focus[b-4g1yk5gj0z], .form-textarea:focus[b-4g1yk5gj0z] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-4g1yk5gj0z] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-4g1yk5gj0z] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-4g1yk5gj0z] { flex: 1; display: flex; align-items: center; }
.form-check[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-4g1yk5gj0z] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-4g1yk5gj0z] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-4g1yk5gj0z] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-4g1yk5gj0z] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-4g1yk5gj0z] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-4g1yk5gj0z] { font-size: 3rem; }
.photo-placeholder span[b-4g1yk5gj0z] { font-size: 0.78rem; }
.photo-actions[b-4g1yk5gj0z] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-4g1yk5gj0z] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-4g1yk5gj0z] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-4g1yk5gj0z] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-4g1yk5gj0z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-4g1yk5gj0z] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-4g1yk5gj0z] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-4g1yk5gj0z] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-4g1yk5gj0z] { filter: brightness(1.15); transform: scale(1.05); }
[b-4g1yk5gj0z] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-4g1yk5gj0z] { padding: 0.75rem; }
    .crud-header[b-4g1yk5gj0z] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-4g1yk5gj0z] { font-size: 1.1rem; }
    .btn-text[b-4g1yk5gj0z] { display: none; }
    .form-row[b-4g1yk5gj0z] { flex-direction: column; }
    .form-row-4[b-4g1yk5gj0z] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-4g1yk5gj0z] { width: 98%; max-height: 95vh; }
    .modal-lg[b-4g1yk5gj0z] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-4g1yk5gj0z] { padding: 0.75rem; }
    .modal-tabs[b-4g1yk5gj0z] { overflow-x: auto; }
    .modal-tab[b-4g1yk5gj0z] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-4g1yk5gj0z] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-4g1yk5gj0z] { display: grid !important; }
    .crud-cards-wrapper[b-4g1yk5gj0z] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-4g1yk5gj0z] { grid-template-columns: 1fr; }
    .card-details[b-4g1yk5gj0z] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-4g1yk5gj0z] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-4g1yk5gj0z] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-4g1yk5gj0z] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-4g1yk5gj0z] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmcolores.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-1zjuroa4z0] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1zjuroa4z0 0.3s ease-out; }
@keyframes slideUp-b-1zjuroa4z0 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1zjuroa4z0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1zjuroa4z0] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1zjuroa4z0] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1zjuroa4z0] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1zjuroa4z0] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1zjuroa4z0] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1zjuroa4z0] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-1zjuroa4z0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1zjuroa4z0] { filter: brightness(1.1); }
.btn-outline[b-1zjuroa4z0] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1zjuroa4z0] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-1zjuroa4z0] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-1zjuroa4z0] { filter: brightness(1.1); }
.btn-icon[b-1zjuroa4z0] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-1zjuroa4z0] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-1zjuroa4z0] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-1zjuroa4z0] { color: #ef4444; }
.btn-delete:hover[b-1zjuroa4z0] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-1zjuroa4z0] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1zjuroa4z0] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-1zjuroa4z0] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-1zjuroa4z0] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-1zjuroa4z0] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-1zjuroa4z0] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-1zjuroa4z0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-1zjuroa4z0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-1zjuroa4z0] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-1zjuroa4z0] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-1zjuroa4z0] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-1zjuroa4z0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-1zjuroa4z0] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-1zjuroa4z0] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-1zjuroa4z0] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-1zjuroa4z0] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-1zjuroa4z0] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-1zjuroa4z0] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-1zjuroa4z0] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-1zjuroa4z0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-1zjuroa4z0] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-1zjuroa4z0] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-1zjuroa4z0] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-1zjuroa4z0] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-1zjuroa4z0] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-1zjuroa4z0] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-1zjuroa4z0] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-1zjuroa4z0] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-1zjuroa4z0] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-1zjuroa4z0] { display: block; }
.hide-on-cards[b-1zjuroa4z0] { display: none !important; }
.show-on-cards[b-1zjuroa4z0] { display: grid; }
.hide-on-grid[b-1zjuroa4z0] { display: none !important; }

/* Badges */
.badge[b-1zjuroa4z0] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-1zjuroa4z0] { background: #ecfdf5; color: #065f46; }
.badge-no[b-1zjuroa4z0] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-1zjuroa4z0] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-1zjuroa4z0] { text-align: center; }
.text-muted[b-1zjuroa4z0] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-1zjuroa4z0], .crud-empty-state[b-1zjuroa4z0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-1zjuroa4z0] { font-size: 2rem; }
.crud-spinner[b-1zjuroa4z0] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-1zjuroa4z0 0.6s linear infinite; }
.crud-spinner-sm[b-1zjuroa4z0] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1zjuroa4z0 0.6s linear infinite; }
@keyframes spin-b-1zjuroa4z0 { to { transform: rotate(360deg); } }
.spin[b-1zjuroa4z0] { animation: spin-b-1zjuroa4z0 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-1zjuroa4z0] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-1zjuroa4z0 0.15s ease-out; }
.modal-container[b-1zjuroa4z0] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-1zjuroa4z0] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-1zjuroa4z0 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-1zjuroa4z0] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-1zjuroa4z0] { max-width: 420px; }
@keyframes fadeIn-b-1zjuroa4z0 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-1zjuroa4z0 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-1zjuroa4z0] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-1zjuroa4z0] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-1zjuroa4z0] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-1zjuroa4z0] { color: #dc2626; }
.modal-close[b-1zjuroa4z0] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-1zjuroa4z0] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-1zjuroa4z0] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-1zjuroa4z0] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-1zjuroa4z0] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-1zjuroa4z0] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-1zjuroa4z0] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-1zjuroa4z0] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-1zjuroa4z0] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-1zjuroa4z0] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-1zjuroa4z0] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-1zjuroa4z0] { flex: 2; }
.form-group label[b-1zjuroa4z0] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-1zjuroa4z0], .form-group select[b-1zjuroa4z0], .form-textarea[b-1zjuroa4z0] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-1zjuroa4z0], .form-group select:focus[b-1zjuroa4z0], .form-textarea:focus[b-1zjuroa4z0] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-1zjuroa4z0] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-1zjuroa4z0] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-1zjuroa4z0] { flex: 1; display: flex; align-items: center; }
.form-check[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1zjuroa4z0] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-1zjuroa4z0] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-1zjuroa4z0] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-1zjuroa4z0] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-1zjuroa4z0] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-1zjuroa4z0] { font-size: 3rem; }
.photo-placeholder span[b-1zjuroa4z0] { font-size: 0.78rem; }
.photo-actions[b-1zjuroa4z0] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-1zjuroa4z0] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-1zjuroa4z0] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-1zjuroa4z0] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-1zjuroa4z0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-1zjuroa4z0] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-1zjuroa4z0] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-1zjuroa4z0] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-1zjuroa4z0] { filter: brightness(1.15); transform: scale(1.05); }
[b-1zjuroa4z0] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-1zjuroa4z0] { padding: 0.75rem; }
    .crud-header[b-1zjuroa4z0] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-1zjuroa4z0] { font-size: 1.1rem; }
    .btn-text[b-1zjuroa4z0] { display: none; }
    .form-row[b-1zjuroa4z0] { flex-direction: column; }
    .form-row-4[b-1zjuroa4z0] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-1zjuroa4z0] { width: 98%; max-height: 95vh; }
    .modal-lg[b-1zjuroa4z0] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-1zjuroa4z0] { padding: 0.75rem; }
    .modal-tabs[b-1zjuroa4z0] { overflow-x: auto; }
    .modal-tab[b-1zjuroa4z0] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-1zjuroa4z0] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-1zjuroa4z0] { display: grid !important; }
    .crud-cards-wrapper[b-1zjuroa4z0] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-1zjuroa4z0] { grid-template-columns: 1fr; }
    .card-details[b-1zjuroa4z0] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-1zjuroa4z0] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-1zjuroa4z0] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-1zjuroa4z0] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-1zjuroa4z0] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmfru_maestrafrutas.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-d5kw2e9zg9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-d5kw2e9zg9 0.3s ease-out; }
@keyframes slideUp-b-d5kw2e9zg9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-d5kw2e9zg9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-d5kw2e9zg9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-d5kw2e9zg9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-d5kw2e9zg9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-d5kw2e9zg9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-d5kw2e9zg9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-d5kw2e9zg9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-d5kw2e9zg9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-d5kw2e9zg9] { filter: brightness(1.1); }
.btn-outline[b-d5kw2e9zg9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-d5kw2e9zg9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-d5kw2e9zg9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-d5kw2e9zg9] { filter: brightness(1.1); }
.btn-icon[b-d5kw2e9zg9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-d5kw2e9zg9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-d5kw2e9zg9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-d5kw2e9zg9] { color: #ef4444; }
.btn-delete:hover[b-d5kw2e9zg9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-d5kw2e9zg9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-d5kw2e9zg9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-d5kw2e9zg9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-d5kw2e9zg9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-d5kw2e9zg9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-d5kw2e9zg9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-d5kw2e9zg9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-d5kw2e9zg9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-d5kw2e9zg9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-d5kw2e9zg9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-d5kw2e9zg9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-d5kw2e9zg9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-d5kw2e9zg9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-d5kw2e9zg9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-d5kw2e9zg9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-d5kw2e9zg9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-d5kw2e9zg9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-d5kw2e9zg9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-d5kw2e9zg9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-d5kw2e9zg9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-d5kw2e9zg9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-d5kw2e9zg9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-d5kw2e9zg9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-d5kw2e9zg9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-d5kw2e9zg9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-d5kw2e9zg9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-d5kw2e9zg9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-d5kw2e9zg9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-d5kw2e9zg9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-d5kw2e9zg9] { display: block; }
.hide-on-cards[b-d5kw2e9zg9] { display: none !important; }
.show-on-cards[b-d5kw2e9zg9] { display: grid; }
.hide-on-grid[b-d5kw2e9zg9] { display: none !important; }

/* Badges */
.badge[b-d5kw2e9zg9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-d5kw2e9zg9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-d5kw2e9zg9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-d5kw2e9zg9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-d5kw2e9zg9] { text-align: center; }
.text-muted[b-d5kw2e9zg9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-d5kw2e9zg9], .crud-empty-state[b-d5kw2e9zg9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-d5kw2e9zg9] { font-size: 2rem; }
.crud-spinner[b-d5kw2e9zg9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-d5kw2e9zg9 0.6s linear infinite; }
.crud-spinner-sm[b-d5kw2e9zg9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-d5kw2e9zg9 0.6s linear infinite; }
@keyframes spin-b-d5kw2e9zg9 { to { transform: rotate(360deg); } }
.spin[b-d5kw2e9zg9] { animation: spin-b-d5kw2e9zg9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-d5kw2e9zg9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-d5kw2e9zg9 0.15s ease-out; }
.modal-container[b-d5kw2e9zg9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-d5kw2e9zg9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-d5kw2e9zg9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-d5kw2e9zg9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-d5kw2e9zg9] { max-width: 420px; }
@keyframes fadeIn-b-d5kw2e9zg9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-d5kw2e9zg9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-d5kw2e9zg9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-d5kw2e9zg9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-d5kw2e9zg9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-d5kw2e9zg9] { color: #dc2626; }
.modal-close[b-d5kw2e9zg9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-d5kw2e9zg9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-d5kw2e9zg9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-d5kw2e9zg9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-d5kw2e9zg9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-d5kw2e9zg9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-d5kw2e9zg9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-d5kw2e9zg9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-d5kw2e9zg9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-d5kw2e9zg9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-d5kw2e9zg9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-d5kw2e9zg9] { flex: 2; }
.form-group label[b-d5kw2e9zg9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-d5kw2e9zg9], .form-group select[b-d5kw2e9zg9], .form-textarea[b-d5kw2e9zg9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-d5kw2e9zg9], .form-group select:focus[b-d5kw2e9zg9], .form-textarea:focus[b-d5kw2e9zg9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-d5kw2e9zg9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-d5kw2e9zg9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-d5kw2e9zg9] { flex: 1; display: flex; align-items: center; }
.form-check[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-d5kw2e9zg9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-d5kw2e9zg9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-d5kw2e9zg9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-d5kw2e9zg9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-d5kw2e9zg9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-d5kw2e9zg9] { font-size: 3rem; }
.photo-placeholder span[b-d5kw2e9zg9] { font-size: 0.78rem; }
.photo-actions[b-d5kw2e9zg9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-d5kw2e9zg9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-d5kw2e9zg9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-d5kw2e9zg9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-d5kw2e9zg9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-d5kw2e9zg9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-d5kw2e9zg9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-d5kw2e9zg9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-d5kw2e9zg9] { filter: brightness(1.15); transform: scale(1.05); }
[b-d5kw2e9zg9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-d5kw2e9zg9] { padding: 0.75rem; }
    .crud-header[b-d5kw2e9zg9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-d5kw2e9zg9] { font-size: 1.1rem; }
    .btn-text[b-d5kw2e9zg9] { display: none; }
    .form-row[b-d5kw2e9zg9] { flex-direction: column; }
    .form-row-4[b-d5kw2e9zg9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-d5kw2e9zg9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-d5kw2e9zg9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-d5kw2e9zg9] { padding: 0.75rem; }
    .modal-tabs[b-d5kw2e9zg9] { overflow-x: auto; }
    .modal-tab[b-d5kw2e9zg9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-d5kw2e9zg9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-d5kw2e9zg9] { display: grid !important; }
    .crud-cards-wrapper[b-d5kw2e9zg9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-d5kw2e9zg9] { grid-template-columns: 1fr; }
    .card-details[b-d5kw2e9zg9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-d5kw2e9zg9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-d5kw2e9zg9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-d5kw2e9zg9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-d5kw2e9zg9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmuberingresokilometraje.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-c80mmzfpiy] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-c80mmzfpiy 0.3s ease-out; }
@keyframes slideUp-b-c80mmzfpiy { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-c80mmzfpiy] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-c80mmzfpiy] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-c80mmzfpiy] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-c80mmzfpiy] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-c80mmzfpiy] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-c80mmzfpiy] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-c80mmzfpiy] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-c80mmzfpiy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-c80mmzfpiy] { filter: brightness(1.1); }
.btn-outline[b-c80mmzfpiy] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-c80mmzfpiy] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-c80mmzfpiy] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-c80mmzfpiy] { filter: brightness(1.1); }
.btn-icon[b-c80mmzfpiy] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-c80mmzfpiy] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-c80mmzfpiy] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-c80mmzfpiy] { color: #ef4444; }
.btn-delete:hover[b-c80mmzfpiy] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-c80mmzfpiy] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-c80mmzfpiy] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-c80mmzfpiy] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-c80mmzfpiy] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-c80mmzfpiy] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-c80mmzfpiy] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-c80mmzfpiy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-c80mmzfpiy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-c80mmzfpiy] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-c80mmzfpiy] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-c80mmzfpiy] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-c80mmzfpiy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-c80mmzfpiy] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-c80mmzfpiy] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-c80mmzfpiy] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-c80mmzfpiy] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-c80mmzfpiy] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-c80mmzfpiy] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-c80mmzfpiy] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-c80mmzfpiy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-c80mmzfpiy] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-c80mmzfpiy] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-c80mmzfpiy] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-c80mmzfpiy] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-c80mmzfpiy] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-c80mmzfpiy] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-c80mmzfpiy] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-c80mmzfpiy] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-c80mmzfpiy] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-c80mmzfpiy] { display: block; }
.hide-on-cards[b-c80mmzfpiy] { display: none !important; }
.show-on-cards[b-c80mmzfpiy] { display: grid; }
.hide-on-grid[b-c80mmzfpiy] { display: none !important; }

/* Badges */
.badge[b-c80mmzfpiy] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-c80mmzfpiy] { background: #ecfdf5; color: #065f46; }
.badge-no[b-c80mmzfpiy] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-c80mmzfpiy] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-c80mmzfpiy] { text-align: center; }
.text-muted[b-c80mmzfpiy] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-c80mmzfpiy], .crud-empty-state[b-c80mmzfpiy] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-c80mmzfpiy] { font-size: 2rem; }
.crud-spinner[b-c80mmzfpiy] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-c80mmzfpiy 0.6s linear infinite; }
.crud-spinner-sm[b-c80mmzfpiy] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-c80mmzfpiy 0.6s linear infinite; }
@keyframes spin-b-c80mmzfpiy { to { transform: rotate(360deg); } }
.spin[b-c80mmzfpiy] { animation: spin-b-c80mmzfpiy 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-c80mmzfpiy] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-c80mmzfpiy 0.15s ease-out; }
.modal-container[b-c80mmzfpiy] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-c80mmzfpiy] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-c80mmzfpiy 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-c80mmzfpiy] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-c80mmzfpiy] { max-width: 420px; }
@keyframes fadeIn-b-c80mmzfpiy { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-c80mmzfpiy { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-c80mmzfpiy] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-c80mmzfpiy] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-c80mmzfpiy] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-c80mmzfpiy] { color: #dc2626; }
.modal-close[b-c80mmzfpiy] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-c80mmzfpiy] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-c80mmzfpiy] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-c80mmzfpiy] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-c80mmzfpiy] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-c80mmzfpiy] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-c80mmzfpiy] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-c80mmzfpiy] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-c80mmzfpiy] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-c80mmzfpiy] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-c80mmzfpiy] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-c80mmzfpiy] { flex: 2; }
.form-group label[b-c80mmzfpiy] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-c80mmzfpiy], .form-group select[b-c80mmzfpiy], .form-textarea[b-c80mmzfpiy] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-c80mmzfpiy], .form-group select:focus[b-c80mmzfpiy], .form-textarea:focus[b-c80mmzfpiy] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-c80mmzfpiy] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-c80mmzfpiy] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-c80mmzfpiy] { flex: 1; display: flex; align-items: center; }
.form-check[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-c80mmzfpiy] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-c80mmzfpiy] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-c80mmzfpiy] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-c80mmzfpiy] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-c80mmzfpiy] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-c80mmzfpiy] { font-size: 3rem; }
.photo-placeholder span[b-c80mmzfpiy] { font-size: 0.78rem; }
.photo-actions[b-c80mmzfpiy] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-c80mmzfpiy] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-c80mmzfpiy] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-c80mmzfpiy] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-c80mmzfpiy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-c80mmzfpiy] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-c80mmzfpiy] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-c80mmzfpiy] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-c80mmzfpiy] { filter: brightness(1.15); transform: scale(1.05); }
[b-c80mmzfpiy] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-c80mmzfpiy] { padding: 0.75rem; }
    .crud-header[b-c80mmzfpiy] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-c80mmzfpiy] { font-size: 1.1rem; }
    .btn-text[b-c80mmzfpiy] { display: none; }
    .form-row[b-c80mmzfpiy] { flex-direction: column; }
    .form-row-4[b-c80mmzfpiy] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-c80mmzfpiy] { width: 98%; max-height: 95vh; }
    .modal-lg[b-c80mmzfpiy] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-c80mmzfpiy] { padding: 0.75rem; }
    .modal-tabs[b-c80mmzfpiy] { overflow-x: auto; }
    .modal-tab[b-c80mmzfpiy] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-c80mmzfpiy] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-c80mmzfpiy] { display: grid !important; }
    .crud-cards-wrapper[b-c80mmzfpiy] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-c80mmzfpiy] { grid-template-columns: 1fr; }
    .card-details[b-c80mmzfpiy] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-c80mmzfpiy] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-c80mmzfpiy] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-c80mmzfpiy] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-c80mmzfpiy] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmuberliberacionvehiculos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-egl0svwsrr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-egl0svwsrr 0.3s ease-out; }
@keyframes slideUp-b-egl0svwsrr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-egl0svwsrr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-egl0svwsrr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-egl0svwsrr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-egl0svwsrr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-egl0svwsrr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-egl0svwsrr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-egl0svwsrr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-egl0svwsrr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-egl0svwsrr] { filter: brightness(1.1); }
.btn-outline[b-egl0svwsrr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-egl0svwsrr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-egl0svwsrr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-egl0svwsrr] { filter: brightness(1.1); }
.btn-icon[b-egl0svwsrr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-egl0svwsrr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-egl0svwsrr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-egl0svwsrr] { color: #ef4444; }
.btn-delete:hover[b-egl0svwsrr] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-egl0svwsrr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-egl0svwsrr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-egl0svwsrr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-egl0svwsrr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-egl0svwsrr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-egl0svwsrr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-egl0svwsrr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-egl0svwsrr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-egl0svwsrr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-egl0svwsrr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-egl0svwsrr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-egl0svwsrr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-egl0svwsrr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-egl0svwsrr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-egl0svwsrr] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-egl0svwsrr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-egl0svwsrr] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-egl0svwsrr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-egl0svwsrr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-egl0svwsrr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-egl0svwsrr] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-egl0svwsrr] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-egl0svwsrr] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-egl0svwsrr] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-egl0svwsrr] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-egl0svwsrr] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-egl0svwsrr] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-egl0svwsrr] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-egl0svwsrr] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-egl0svwsrr] { display: block; }
.hide-on-cards[b-egl0svwsrr] { display: none !important; }
.show-on-cards[b-egl0svwsrr] { display: grid; }
.hide-on-grid[b-egl0svwsrr] { display: none !important; }

/* Badges */
.badge[b-egl0svwsrr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-egl0svwsrr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-egl0svwsrr] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-egl0svwsrr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-egl0svwsrr] { text-align: center; }
.text-muted[b-egl0svwsrr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-egl0svwsrr], .crud-empty-state[b-egl0svwsrr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-egl0svwsrr] { font-size: 2rem; }
.crud-spinner[b-egl0svwsrr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-egl0svwsrr 0.6s linear infinite; }
.crud-spinner-sm[b-egl0svwsrr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-egl0svwsrr 0.6s linear infinite; }
@keyframes spin-b-egl0svwsrr { to { transform: rotate(360deg); } }
.spin[b-egl0svwsrr] { animation: spin-b-egl0svwsrr 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-egl0svwsrr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-egl0svwsrr 0.15s ease-out; }
.modal-container[b-egl0svwsrr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-egl0svwsrr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-egl0svwsrr 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-egl0svwsrr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-egl0svwsrr] { max-width: 420px; }
@keyframes fadeIn-b-egl0svwsrr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-egl0svwsrr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-egl0svwsrr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-egl0svwsrr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-egl0svwsrr] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-egl0svwsrr] { color: #dc2626; }
.modal-close[b-egl0svwsrr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-egl0svwsrr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-egl0svwsrr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-egl0svwsrr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-egl0svwsrr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-egl0svwsrr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-egl0svwsrr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-egl0svwsrr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-egl0svwsrr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-egl0svwsrr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-egl0svwsrr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-egl0svwsrr] { flex: 2; }
.form-group label[b-egl0svwsrr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-egl0svwsrr], .form-group select[b-egl0svwsrr], .form-textarea[b-egl0svwsrr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-egl0svwsrr], .form-group select:focus[b-egl0svwsrr], .form-textarea:focus[b-egl0svwsrr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-egl0svwsrr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-egl0svwsrr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-egl0svwsrr] { flex: 1; display: flex; align-items: center; }
.form-check[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-egl0svwsrr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-egl0svwsrr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-egl0svwsrr] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-egl0svwsrr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-egl0svwsrr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-egl0svwsrr] { font-size: 3rem; }
.photo-placeholder span[b-egl0svwsrr] { font-size: 0.78rem; }
.photo-actions[b-egl0svwsrr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-egl0svwsrr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-egl0svwsrr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-egl0svwsrr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-egl0svwsrr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-egl0svwsrr] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-egl0svwsrr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-egl0svwsrr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-egl0svwsrr] { filter: brightness(1.15); transform: scale(1.05); }
[b-egl0svwsrr] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-egl0svwsrr] { padding: 0.75rem; }
    .crud-header[b-egl0svwsrr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-egl0svwsrr] { font-size: 1.1rem; }
    .btn-text[b-egl0svwsrr] { display: none; }
    .form-row[b-egl0svwsrr] { flex-direction: column; }
    .form-row-4[b-egl0svwsrr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-egl0svwsrr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-egl0svwsrr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-egl0svwsrr] { padding: 0.75rem; }
    .modal-tabs[b-egl0svwsrr] { overflow-x: auto; }
    .modal-tab[b-egl0svwsrr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-egl0svwsrr] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-egl0svwsrr] { display: grid !important; }
    .crud-cards-wrapper[b-egl0svwsrr] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-egl0svwsrr] { grid-template-columns: 1fr; }
    .card-details[b-egl0svwsrr] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-egl0svwsrr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-egl0svwsrr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-egl0svwsrr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-egl0svwsrr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmuberliberacionvehiculosempresa.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-yyvfv9de47] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-yyvfv9de47 0.3s ease-out; }
@keyframes slideUp-b-yyvfv9de47 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-yyvfv9de47] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-yyvfv9de47] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-yyvfv9de47] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-yyvfv9de47] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-yyvfv9de47] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-yyvfv9de47] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-yyvfv9de47] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-yyvfv9de47] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-yyvfv9de47] { filter: brightness(1.1); }
.btn-outline[b-yyvfv9de47] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-yyvfv9de47] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-yyvfv9de47] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-yyvfv9de47] { filter: brightness(1.1); }
.btn-icon[b-yyvfv9de47] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-yyvfv9de47] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-yyvfv9de47] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-yyvfv9de47] { color: #ef4444; }
.btn-delete:hover[b-yyvfv9de47] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-yyvfv9de47] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-yyvfv9de47] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-yyvfv9de47] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-yyvfv9de47] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-yyvfv9de47] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-yyvfv9de47] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-yyvfv9de47] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-yyvfv9de47] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-yyvfv9de47] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-yyvfv9de47] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-yyvfv9de47] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-yyvfv9de47] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-yyvfv9de47] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-yyvfv9de47] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-yyvfv9de47] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-yyvfv9de47] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-yyvfv9de47] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-yyvfv9de47] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-yyvfv9de47] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-yyvfv9de47] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-yyvfv9de47] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-yyvfv9de47] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-yyvfv9de47] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-yyvfv9de47] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-yyvfv9de47] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-yyvfv9de47] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-yyvfv9de47] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-yyvfv9de47] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-yyvfv9de47] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-yyvfv9de47] { display: block; }
.hide-on-cards[b-yyvfv9de47] { display: none !important; }
.show-on-cards[b-yyvfv9de47] { display: grid; }
.hide-on-grid[b-yyvfv9de47] { display: none !important; }

/* Badges */
.badge[b-yyvfv9de47] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-yyvfv9de47] { background: #ecfdf5; color: #065f46; }
.badge-no[b-yyvfv9de47] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-yyvfv9de47] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-yyvfv9de47] { text-align: center; }
.text-muted[b-yyvfv9de47] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-yyvfv9de47], .crud-empty-state[b-yyvfv9de47] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-yyvfv9de47] { font-size: 2rem; }
.crud-spinner[b-yyvfv9de47] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-yyvfv9de47 0.6s linear infinite; }
.crud-spinner-sm[b-yyvfv9de47] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-yyvfv9de47 0.6s linear infinite; }
@keyframes spin-b-yyvfv9de47 { to { transform: rotate(360deg); } }
.spin[b-yyvfv9de47] { animation: spin-b-yyvfv9de47 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-yyvfv9de47] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-yyvfv9de47 0.15s ease-out; }
.modal-container[b-yyvfv9de47] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-yyvfv9de47] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-yyvfv9de47 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-yyvfv9de47] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-yyvfv9de47] { max-width: 420px; }
@keyframes fadeIn-b-yyvfv9de47 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-yyvfv9de47 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-yyvfv9de47] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-yyvfv9de47] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-yyvfv9de47] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-yyvfv9de47] { color: #dc2626; }
.modal-close[b-yyvfv9de47] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-yyvfv9de47] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-yyvfv9de47] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-yyvfv9de47] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-yyvfv9de47] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-yyvfv9de47] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-yyvfv9de47] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-yyvfv9de47] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-yyvfv9de47] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-yyvfv9de47] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-yyvfv9de47] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-yyvfv9de47] { flex: 2; }
.form-group label[b-yyvfv9de47] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-yyvfv9de47], .form-group select[b-yyvfv9de47], .form-textarea[b-yyvfv9de47] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-yyvfv9de47], .form-group select:focus[b-yyvfv9de47], .form-textarea:focus[b-yyvfv9de47] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-yyvfv9de47] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-yyvfv9de47] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-yyvfv9de47] { flex: 1; display: flex; align-items: center; }
.form-check[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-yyvfv9de47] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-yyvfv9de47] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-yyvfv9de47] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-yyvfv9de47] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-yyvfv9de47] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-yyvfv9de47] { font-size: 3rem; }
.photo-placeholder span[b-yyvfv9de47] { font-size: 0.78rem; }
.photo-actions[b-yyvfv9de47] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-yyvfv9de47] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-yyvfv9de47] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-yyvfv9de47] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-yyvfv9de47] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-yyvfv9de47] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-yyvfv9de47] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-yyvfv9de47] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-yyvfv9de47] { filter: brightness(1.15); transform: scale(1.05); }
[b-yyvfv9de47] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-yyvfv9de47] { padding: 0.75rem; }
    .crud-header[b-yyvfv9de47] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-yyvfv9de47] { font-size: 1.1rem; }
    .btn-text[b-yyvfv9de47] { display: none; }
    .form-row[b-yyvfv9de47] { flex-direction: column; }
    .form-row-4[b-yyvfv9de47] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-yyvfv9de47] { width: 98%; max-height: 95vh; }
    .modal-lg[b-yyvfv9de47] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-yyvfv9de47] { padding: 0.75rem; }
    .modal-tabs[b-yyvfv9de47] { overflow-x: auto; }
    .modal-tab[b-yyvfv9de47] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-yyvfv9de47] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-yyvfv9de47] { display: grid !important; }
    .crud-cards-wrapper[b-yyvfv9de47] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-yyvfv9de47] { grid-template-columns: 1fr; }
    .card-details[b-yyvfv9de47] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-yyvfv9de47] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-yyvfv9de47] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-yyvfv9de47] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-yyvfv9de47] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmubermarcavehiculosymodelo.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-w3e8j4m20s] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-w3e8j4m20s 0.3s ease-out; }
@keyframes slideUp-b-w3e8j4m20s { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-w3e8j4m20s] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-w3e8j4m20s] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-w3e8j4m20s] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-w3e8j4m20s] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-w3e8j4m20s] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-w3e8j4m20s] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-w3e8j4m20s] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-w3e8j4m20s] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-w3e8j4m20s] { filter: brightness(1.1); }
.btn-outline[b-w3e8j4m20s] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-w3e8j4m20s] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-w3e8j4m20s] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-w3e8j4m20s] { filter: brightness(1.1); }
.btn-icon[b-w3e8j4m20s] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-w3e8j4m20s] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-w3e8j4m20s] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-w3e8j4m20s] { color: #ef4444; }
.btn-delete:hover[b-w3e8j4m20s] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-w3e8j4m20s] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-w3e8j4m20s] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-w3e8j4m20s] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-w3e8j4m20s] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-w3e8j4m20s] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-w3e8j4m20s] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-w3e8j4m20s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-w3e8j4m20s] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-w3e8j4m20s] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-w3e8j4m20s] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-w3e8j4m20s] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-w3e8j4m20s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-w3e8j4m20s] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-w3e8j4m20s] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-w3e8j4m20s] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-w3e8j4m20s] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-w3e8j4m20s] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-w3e8j4m20s] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-w3e8j4m20s] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-w3e8j4m20s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-w3e8j4m20s] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-w3e8j4m20s] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-w3e8j4m20s] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-w3e8j4m20s] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-w3e8j4m20s] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-w3e8j4m20s] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-w3e8j4m20s] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-w3e8j4m20s] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-w3e8j4m20s] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-w3e8j4m20s] { display: block; }
.hide-on-cards[b-w3e8j4m20s] { display: none !important; }
.show-on-cards[b-w3e8j4m20s] { display: grid; }
.hide-on-grid[b-w3e8j4m20s] { display: none !important; }

/* Badges */
.badge[b-w3e8j4m20s] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-w3e8j4m20s] { background: #ecfdf5; color: #065f46; }
.badge-no[b-w3e8j4m20s] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-w3e8j4m20s] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-w3e8j4m20s] { text-align: center; }
.text-muted[b-w3e8j4m20s] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-w3e8j4m20s], .crud-empty-state[b-w3e8j4m20s] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-w3e8j4m20s] { font-size: 2rem; }
.crud-spinner[b-w3e8j4m20s] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-w3e8j4m20s 0.6s linear infinite; }
.crud-spinner-sm[b-w3e8j4m20s] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-w3e8j4m20s 0.6s linear infinite; }
@keyframes spin-b-w3e8j4m20s { to { transform: rotate(360deg); } }
.spin[b-w3e8j4m20s] { animation: spin-b-w3e8j4m20s 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-w3e8j4m20s] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-w3e8j4m20s 0.15s ease-out; }
.modal-container[b-w3e8j4m20s] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-w3e8j4m20s] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-w3e8j4m20s 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-w3e8j4m20s] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-w3e8j4m20s] { max-width: 420px; }
@keyframes fadeIn-b-w3e8j4m20s { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-w3e8j4m20s { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-w3e8j4m20s] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-w3e8j4m20s] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-w3e8j4m20s] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-w3e8j4m20s] { color: #dc2626; }
.modal-close[b-w3e8j4m20s] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-w3e8j4m20s] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-w3e8j4m20s] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-w3e8j4m20s] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-w3e8j4m20s] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-w3e8j4m20s] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-w3e8j4m20s] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-w3e8j4m20s] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-w3e8j4m20s] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-w3e8j4m20s] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-w3e8j4m20s] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-w3e8j4m20s] { flex: 2; }
.form-group label[b-w3e8j4m20s] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-w3e8j4m20s], .form-group select[b-w3e8j4m20s], .form-textarea[b-w3e8j4m20s] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-w3e8j4m20s], .form-group select:focus[b-w3e8j4m20s], .form-textarea:focus[b-w3e8j4m20s] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-w3e8j4m20s] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-w3e8j4m20s] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-w3e8j4m20s] { flex: 1; display: flex; align-items: center; }
.form-check[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-w3e8j4m20s] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-w3e8j4m20s] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-w3e8j4m20s] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-w3e8j4m20s] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-w3e8j4m20s] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-w3e8j4m20s] { font-size: 3rem; }
.photo-placeholder span[b-w3e8j4m20s] { font-size: 0.78rem; }
.photo-actions[b-w3e8j4m20s] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-w3e8j4m20s] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-w3e8j4m20s] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-w3e8j4m20s] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-w3e8j4m20s] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-w3e8j4m20s] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-w3e8j4m20s] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-w3e8j4m20s] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-w3e8j4m20s] { filter: brightness(1.15); transform: scale(1.05); }
[b-w3e8j4m20s] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-w3e8j4m20s] { padding: 0.75rem; }
    .crud-header[b-w3e8j4m20s] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-w3e8j4m20s] { font-size: 1.1rem; }
    .btn-text[b-w3e8j4m20s] { display: none; }
    .form-row[b-w3e8j4m20s] { flex-direction: column; }
    .form-row-4[b-w3e8j4m20s] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-w3e8j4m20s] { width: 98%; max-height: 95vh; }
    .modal-lg[b-w3e8j4m20s] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-w3e8j4m20s] { padding: 0.75rem; }
    .modal-tabs[b-w3e8j4m20s] { overflow-x: auto; }
    .modal-tab[b-w3e8j4m20s] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-w3e8j4m20s] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-w3e8j4m20s] { display: grid !important; }
    .crud-cards-wrapper[b-w3e8j4m20s] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-w3e8j4m20s] { grid-template-columns: 1fr; }
    .card-details[b-w3e8j4m20s] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-w3e8j4m20s] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-w3e8j4m20s] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-w3e8j4m20s] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-w3e8j4m20s] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmubervehiculos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-w1og8fuqg5] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-w1og8fuqg5 0.3s ease-out; }
@keyframes slideUp-b-w1og8fuqg5 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-w1og8fuqg5] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-w1og8fuqg5] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-w1og8fuqg5] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-w1og8fuqg5] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-w1og8fuqg5] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-w1og8fuqg5] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-w1og8fuqg5] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-w1og8fuqg5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-w1og8fuqg5] { filter: brightness(1.1); }
.btn-outline[b-w1og8fuqg5] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-w1og8fuqg5] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-w1og8fuqg5] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-w1og8fuqg5] { filter: brightness(1.1); }
.btn-icon[b-w1og8fuqg5] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-w1og8fuqg5] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-w1og8fuqg5] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-w1og8fuqg5] { color: #ef4444; }
.btn-delete:hover[b-w1og8fuqg5] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-w1og8fuqg5] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-w1og8fuqg5] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-w1og8fuqg5] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-w1og8fuqg5] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-w1og8fuqg5] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-w1og8fuqg5] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-w1og8fuqg5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-w1og8fuqg5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-w1og8fuqg5] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-w1og8fuqg5] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-w1og8fuqg5] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-w1og8fuqg5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-w1og8fuqg5] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-w1og8fuqg5] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-w1og8fuqg5] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-w1og8fuqg5] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-w1og8fuqg5] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-w1og8fuqg5] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-w1og8fuqg5] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-w1og8fuqg5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-w1og8fuqg5] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-w1og8fuqg5] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-w1og8fuqg5] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-w1og8fuqg5] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-w1og8fuqg5] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-w1og8fuqg5] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-w1og8fuqg5] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-w1og8fuqg5] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-w1og8fuqg5] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-w1og8fuqg5] { display: block; }
.hide-on-cards[b-w1og8fuqg5] { display: none !important; }
.show-on-cards[b-w1og8fuqg5] { display: grid; }
.hide-on-grid[b-w1og8fuqg5] { display: none !important; }

/* Badges */
.badge[b-w1og8fuqg5] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-w1og8fuqg5] { background: #ecfdf5; color: #065f46; }
.badge-no[b-w1og8fuqg5] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-w1og8fuqg5] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-w1og8fuqg5] { text-align: center; }
.text-muted[b-w1og8fuqg5] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-w1og8fuqg5], .crud-empty-state[b-w1og8fuqg5] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-w1og8fuqg5] { font-size: 2rem; }
.crud-spinner[b-w1og8fuqg5] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-w1og8fuqg5 0.6s linear infinite; }
.crud-spinner-sm[b-w1og8fuqg5] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-w1og8fuqg5 0.6s linear infinite; }
@keyframes spin-b-w1og8fuqg5 { to { transform: rotate(360deg); } }
.spin[b-w1og8fuqg5] { animation: spin-b-w1og8fuqg5 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-w1og8fuqg5] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-w1og8fuqg5 0.15s ease-out; }
.modal-container[b-w1og8fuqg5] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-w1og8fuqg5] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-w1og8fuqg5 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-w1og8fuqg5] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-w1og8fuqg5] { max-width: 420px; }
@keyframes fadeIn-b-w1og8fuqg5 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-w1og8fuqg5 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-w1og8fuqg5] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-w1og8fuqg5] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-w1og8fuqg5] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-w1og8fuqg5] { color: #dc2626; }
.modal-close[b-w1og8fuqg5] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-w1og8fuqg5] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-w1og8fuqg5] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-w1og8fuqg5] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-w1og8fuqg5] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-w1og8fuqg5] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-w1og8fuqg5] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-w1og8fuqg5] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-w1og8fuqg5] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-w1og8fuqg5] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-w1og8fuqg5] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-w1og8fuqg5] { flex: 2; }
.form-group label[b-w1og8fuqg5] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-w1og8fuqg5], .form-group select[b-w1og8fuqg5], .form-textarea[b-w1og8fuqg5] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-w1og8fuqg5], .form-group select:focus[b-w1og8fuqg5], .form-textarea:focus[b-w1og8fuqg5] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-w1og8fuqg5] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-w1og8fuqg5] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-w1og8fuqg5] { flex: 1; display: flex; align-items: center; }
.form-check[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-w1og8fuqg5] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-w1og8fuqg5] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-w1og8fuqg5] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-w1og8fuqg5] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-w1og8fuqg5] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-w1og8fuqg5] { font-size: 3rem; }
.photo-placeholder span[b-w1og8fuqg5] { font-size: 0.78rem; }
.photo-actions[b-w1og8fuqg5] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-w1og8fuqg5] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-w1og8fuqg5] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-w1og8fuqg5] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-w1og8fuqg5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-w1og8fuqg5] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-w1og8fuqg5] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-w1og8fuqg5] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-w1og8fuqg5] { filter: brightness(1.15); transform: scale(1.05); }
[b-w1og8fuqg5] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-w1og8fuqg5] { padding: 0.75rem; }
    .crud-header[b-w1og8fuqg5] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-w1og8fuqg5] { font-size: 1.1rem; }
    .btn-text[b-w1og8fuqg5] { display: none; }
    .form-row[b-w1og8fuqg5] { flex-direction: column; }
    .form-row-4[b-w1og8fuqg5] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-w1og8fuqg5] { width: 98%; max-height: 95vh; }
    .modal-lg[b-w1og8fuqg5] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-w1og8fuqg5] { padding: 0.75rem; }
    .modal-tabs[b-w1og8fuqg5] { overflow-x: auto; }
    .modal-tab[b-w1og8fuqg5] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-w1og8fuqg5] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-w1og8fuqg5] { display: grid !important; }
    .crud-cards-wrapper[b-w1og8fuqg5] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-w1og8fuqg5] { grid-template-columns: 1fr; }
    .card-details[b-w1og8fuqg5] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-w1og8fuqg5] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-w1og8fuqg5] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-w1og8fuqg5] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-w1og8fuqg5] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmubervehiculosasignados.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-disfwis2jk] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-disfwis2jk 0.3s ease-out; }
@keyframes slideUp-b-disfwis2jk { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-disfwis2jk] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-disfwis2jk] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-disfwis2jk] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-disfwis2jk] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-disfwis2jk] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-disfwis2jk] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-disfwis2jk] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-disfwis2jk] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-disfwis2jk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-disfwis2jk] { filter: brightness(1.1); }
.btn-outline[b-disfwis2jk] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-disfwis2jk] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-disfwis2jk] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-disfwis2jk] { filter: brightness(1.1); }
.btn-icon[b-disfwis2jk] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-disfwis2jk] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-disfwis2jk] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-disfwis2jk] { color: #ef4444; }
.btn-delete:hover[b-disfwis2jk] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-disfwis2jk] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-disfwis2jk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-disfwis2jk] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-disfwis2jk] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-disfwis2jk] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-disfwis2jk] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-disfwis2jk] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-disfwis2jk] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-disfwis2jk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-disfwis2jk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-disfwis2jk] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-disfwis2jk] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-disfwis2jk] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-disfwis2jk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-disfwis2jk] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-disfwis2jk] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-disfwis2jk] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-disfwis2jk] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-disfwis2jk] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-disfwis2jk] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-disfwis2jk] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-disfwis2jk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-disfwis2jk] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-disfwis2jk] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-disfwis2jk] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-disfwis2jk] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-disfwis2jk] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-disfwis2jk] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-disfwis2jk] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-disfwis2jk] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-disfwis2jk] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-disfwis2jk] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-disfwis2jk] { display: block; }
.hide-on-cards[b-disfwis2jk] { display: none !important; }
.show-on-cards[b-disfwis2jk] { display: grid; }
.hide-on-grid[b-disfwis2jk] { display: none !important; }

/* Badges */
.badge[b-disfwis2jk] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-disfwis2jk] { background: #ecfdf5; color: #065f46; }
.badge-no[b-disfwis2jk] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-disfwis2jk] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-disfwis2jk] { text-align: center; }
.text-muted[b-disfwis2jk] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-disfwis2jk], .crud-empty-state[b-disfwis2jk] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-disfwis2jk] { font-size: 2rem; }
.crud-spinner[b-disfwis2jk] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-disfwis2jk 0.6s linear infinite; }
.crud-spinner-sm[b-disfwis2jk] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-disfwis2jk 0.6s linear infinite; }
@keyframes spin-b-disfwis2jk { to { transform: rotate(360deg); } }
.spin[b-disfwis2jk] { animation: spin-b-disfwis2jk 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-disfwis2jk] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-disfwis2jk 0.15s ease-out; }
.modal-container[b-disfwis2jk] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-disfwis2jk] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-disfwis2jk 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-disfwis2jk] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-disfwis2jk] { max-width: 420px; }
@keyframes fadeIn-b-disfwis2jk { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-disfwis2jk { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-disfwis2jk] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-disfwis2jk] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-disfwis2jk] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-disfwis2jk] { color: #dc2626; }
.modal-close[b-disfwis2jk] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-disfwis2jk] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-disfwis2jk] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-disfwis2jk] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-disfwis2jk] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-disfwis2jk] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-disfwis2jk] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-disfwis2jk] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-disfwis2jk] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-disfwis2jk] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-disfwis2jk] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-disfwis2jk] { flex: 2; }
.form-group label[b-disfwis2jk] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-disfwis2jk], .form-group select[b-disfwis2jk], .form-textarea[b-disfwis2jk] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-disfwis2jk], .form-group select:focus[b-disfwis2jk], .form-textarea:focus[b-disfwis2jk] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-disfwis2jk] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-disfwis2jk] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-disfwis2jk] { flex: 1; display: flex; align-items: center; }
.form-check[b-disfwis2jk] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-disfwis2jk] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-disfwis2jk] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-disfwis2jk] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-disfwis2jk] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-disfwis2jk] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-disfwis2jk] { font-size: 3rem; }
.photo-placeholder span[b-disfwis2jk] { font-size: 0.78rem; }
.photo-actions[b-disfwis2jk] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-disfwis2jk] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-disfwis2jk] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-disfwis2jk] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-disfwis2jk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-disfwis2jk] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-disfwis2jk] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-disfwis2jk] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-disfwis2jk] { filter: brightness(1.15); transform: scale(1.05); }
[b-disfwis2jk] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-disfwis2jk] { padding: 0.75rem; }
    .crud-header[b-disfwis2jk] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-disfwis2jk] { font-size: 1.1rem; }
    .btn-text[b-disfwis2jk] { display: none; }
    .form-row[b-disfwis2jk] { flex-direction: column; }
    .form-row-4[b-disfwis2jk] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-disfwis2jk] { width: 98%; max-height: 95vh; }
    .modal-lg[b-disfwis2jk] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-disfwis2jk] { padding: 0.75rem; }
    .modal-tabs[b-disfwis2jk] { overflow-x: auto; }
    .modal-tab[b-disfwis2jk] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-disfwis2jk] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-disfwis2jk] { display: grid !important; }
    .crud-cards-wrapper[b-disfwis2jk] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-disfwis2jk] { grid-template-columns: 1fr; }
    .card-details[b-disfwis2jk] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-disfwis2jk] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-disfwis2jk] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-disfwis2jk] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-disfwis2jk] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Renta-car/Frmubervehiculosmantenimiento.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8jv3yyf62o] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8jv3yyf62o 0.3s ease-out; }
@keyframes slideUp-b-8jv3yyf62o { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8jv3yyf62o] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8jv3yyf62o] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8jv3yyf62o] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8jv3yyf62o] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8jv3yyf62o] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8jv3yyf62o] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8jv3yyf62o] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8jv3yyf62o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8jv3yyf62o] { filter: brightness(1.1); }
.btn-outline[b-8jv3yyf62o] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8jv3yyf62o] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8jv3yyf62o] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8jv3yyf62o] { filter: brightness(1.1); }
.btn-icon[b-8jv3yyf62o] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8jv3yyf62o] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8jv3yyf62o] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8jv3yyf62o] { color: #ef4444; }
.btn-delete:hover[b-8jv3yyf62o] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8jv3yyf62o] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8jv3yyf62o] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8jv3yyf62o] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8jv3yyf62o] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8jv3yyf62o] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8jv3yyf62o] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8jv3yyf62o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8jv3yyf62o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8jv3yyf62o] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8jv3yyf62o] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8jv3yyf62o] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8jv3yyf62o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8jv3yyf62o] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8jv3yyf62o] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8jv3yyf62o] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8jv3yyf62o] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8jv3yyf62o] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8jv3yyf62o] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8jv3yyf62o] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8jv3yyf62o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8jv3yyf62o] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8jv3yyf62o] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8jv3yyf62o] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8jv3yyf62o] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8jv3yyf62o] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8jv3yyf62o] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8jv3yyf62o] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8jv3yyf62o] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8jv3yyf62o] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8jv3yyf62o] { display: block; }
.hide-on-cards[b-8jv3yyf62o] { display: none !important; }
.show-on-cards[b-8jv3yyf62o] { display: grid; }
.hide-on-grid[b-8jv3yyf62o] { display: none !important; }

/* Badges */
.badge[b-8jv3yyf62o] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8jv3yyf62o] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8jv3yyf62o] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8jv3yyf62o] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8jv3yyf62o] { text-align: center; }
.text-muted[b-8jv3yyf62o] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8jv3yyf62o], .crud-empty-state[b-8jv3yyf62o] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8jv3yyf62o] { font-size: 2rem; }
.crud-spinner[b-8jv3yyf62o] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8jv3yyf62o 0.6s linear infinite; }
.crud-spinner-sm[b-8jv3yyf62o] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8jv3yyf62o 0.6s linear infinite; }
@keyframes spin-b-8jv3yyf62o { to { transform: rotate(360deg); } }
.spin[b-8jv3yyf62o] { animation: spin-b-8jv3yyf62o 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8jv3yyf62o] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8jv3yyf62o 0.15s ease-out; }
.modal-container[b-8jv3yyf62o] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8jv3yyf62o] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8jv3yyf62o 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8jv3yyf62o] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8jv3yyf62o] { max-width: 420px; }
@keyframes fadeIn-b-8jv3yyf62o { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8jv3yyf62o { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8jv3yyf62o] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8jv3yyf62o] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8jv3yyf62o] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8jv3yyf62o] { color: #dc2626; }
.modal-close[b-8jv3yyf62o] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8jv3yyf62o] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8jv3yyf62o] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8jv3yyf62o] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8jv3yyf62o] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8jv3yyf62o] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8jv3yyf62o] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8jv3yyf62o] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8jv3yyf62o] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8jv3yyf62o] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8jv3yyf62o] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8jv3yyf62o] { flex: 2; }
.form-group label[b-8jv3yyf62o] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8jv3yyf62o], .form-group select[b-8jv3yyf62o], .form-textarea[b-8jv3yyf62o] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8jv3yyf62o], .form-group select:focus[b-8jv3yyf62o], .form-textarea:focus[b-8jv3yyf62o] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8jv3yyf62o] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8jv3yyf62o] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8jv3yyf62o] { flex: 1; display: flex; align-items: center; }
.form-check[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8jv3yyf62o] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8jv3yyf62o] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8jv3yyf62o] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8jv3yyf62o] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8jv3yyf62o] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8jv3yyf62o] { font-size: 3rem; }
.photo-placeholder span[b-8jv3yyf62o] { font-size: 0.78rem; }
.photo-actions[b-8jv3yyf62o] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8jv3yyf62o] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8jv3yyf62o] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8jv3yyf62o] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8jv3yyf62o] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8jv3yyf62o] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8jv3yyf62o] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8jv3yyf62o] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8jv3yyf62o] { filter: brightness(1.15); transform: scale(1.05); }
[b-8jv3yyf62o] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8jv3yyf62o] { padding: 0.75rem; }
    .crud-header[b-8jv3yyf62o] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8jv3yyf62o] { font-size: 1.1rem; }
    .btn-text[b-8jv3yyf62o] { display: none; }
    .form-row[b-8jv3yyf62o] { flex-direction: column; }
    .form-row-4[b-8jv3yyf62o] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8jv3yyf62o] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8jv3yyf62o] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8jv3yyf62o] { padding: 0.75rem; }
    .modal-tabs[b-8jv3yyf62o] { overflow-x: auto; }
    .modal-tab[b-8jv3yyf62o] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8jv3yyf62o] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8jv3yyf62o] { display: grid !important; }
    .crud-cards-wrapper[b-8jv3yyf62o] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8jv3yyf62o] { grid-template-columns: 1fr; }
    .card-details[b-8jv3yyf62o] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8jv3yyf62o] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8jv3yyf62o] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8jv3yyf62o] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8jv3yyf62o] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Reportes/Frmimpresionreportedinamicov3.razor.rz.scp.css */
/* ============================================================
   📊 Frmimpresionreportedinamicov3.razor.css
   Tokens --rg-* exclusivamente. Dark mode compliant.
   ============================================================ */

/* ── Contenedor principal ── */
.rd-container[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 80px);
    padding: 1rem 1.25rem;
    gap: 0.75rem;
    background: var(--rg-bg-page);
    color: var(--rg-text-primary);
}

/* ── Header ── */
.rd-header[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-shrink: 0;
}

.rd-header-left[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.rd-header-icon[b-txnf7jd4pq] {
    font-size: 1.75rem;
    color: var(--rg-primary);
}

.rd-title[b-txnf7jd4pq] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0;
}

.rd-subtitle[b-txnf7jd4pq] {
    font-size: 0.8rem;
    color: var(--rg-text-muted);
    margin: 0;
}

.rd-header-actions[b-txnf7jd4pq] {
    display: flex;
    gap: 0.5rem;
}

/* ── Layout principal ── */
.rd-layout[b-txnf7jd4pq] {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 0.75rem;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ── Sidebar (lista de reportes) ── */
.rd-sidebar[b-txnf7jd4pq] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.rd-search-box[b-txnf7jd4pq] {
    position: relative;
    padding: 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}

.rd-search-icon[b-txnf7jd4pq] {
    position: absolute;
    left: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rg-text-muted);
    font-size: 0.85rem;
}

.rd-search-input[b-txnf7jd4pq] {
    width: 100%;
    padding: 0.45rem 0.65rem 0.45rem 2rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.85rem;
}

.rd-search-input:focus[b-txnf7jd4pq] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.rd-loading-list[b-txnf7jd4pq],
.rd-empty-list[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
}

.rd-empty-list i[b-txnf7jd4pq] {
    font-size: 2rem;
}

/* ── Grupos de reportes (acordeón) ── */
.rd-group[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--rg-border);
}

.rd-group:last-child[b-txnf7jd4pq] {
    border-bottom: none;
}

.rd-group-title[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    padding: 0.6rem 0.85rem;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--rg-text-primary);
    background: var(--rg-bg-subtle);
    border: none;
    border-bottom: 1px solid var(--rg-border);
    text-align: left;
    cursor: pointer;
    transition: background 0.15s;
    position: sticky;
    top: 0;
    z-index: 1;
}

.rd-group-title:hover[b-txnf7jd4pq] {
    background: var(--rg-bg-hover);
}

.rd-group-collapsed .rd-group-title[b-txnf7jd4pq] {
    border-bottom: none;
}

.rd-group-icon[b-txnf7jd4pq] {
    font-size: 1rem;
    color: var(--rg-primary);
    flex-shrink: 0;
    width: 18px;
    text-align: center;
}

[data-mode="dark"] .rd-group-icon[b-txnf7jd4pq] {
    color: #93b4d4;
}

.rd-group-label[b-txnf7jd4pq] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rd-group-count[b-txnf7jd4pq] {
    font-size: 0.68rem;
    padding: 0.1rem 0.45rem;
    background: rgba(26, 58, 92, 0.12);
    color: var(--rg-primary);
    border-radius: 999px;
    font-weight: 600;
    flex-shrink: 0;
}

[data-mode="dark"] .rd-group-count[b-txnf7jd4pq] {
    background: rgba(147, 180, 212, 0.18);
    color: #93b4d4;
}

.rd-group-chevron[b-txnf7jd4pq] {
    color: var(--rg-text-muted);
    font-size: 0.8rem;
    flex-shrink: 0;
    transition: transform 0.2s;
}

.rd-group-items[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    animation: rd-slide-down-b-txnf7jd4pq 0.18s ease-out;
}

@keyframes rd-slide-down-b-txnf7jd4pq {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

.rd-report-item[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    padding: 0.55rem 0.85rem 0.55rem 2rem;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    text-align: left;
    cursor: pointer;
    transition: background 0.15s;
    font-size: 0.83rem;
}

.rd-report-item:last-child[b-txnf7jd4pq] {
    border-bottom: none;
}

.rd-report-item:hover[b-txnf7jd4pq] {
    background: var(--rg-bg-hover);
}

.rd-report-active[b-txnf7jd4pq] {
    background: rgba(26, 58, 92, 0.1);
    color: var(--rg-primary);
    font-weight: 600;
    box-shadow: inset 3px 0 0 var(--rg-primary);
}

[data-mode="dark"] .rd-report-active[b-txnf7jd4pq] {
    background: rgba(99, 146, 198, 0.15);
    color: #93b4d4;
    box-shadow: inset 3px 0 0 #93b4d4;
}

.rd-report-icon[b-txnf7jd4pq] {
    color: var(--rg-text-muted);
    font-size: 0.9rem;
    flex-shrink: 0;
}

.rd-report-active .rd-report-icon[b-txnf7jd4pq] {
    color: var(--rg-primary);
}

.rd-report-name[b-txnf7jd4pq] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rd-param-badge[b-txnf7jd4pq] {
    font-size: 0.68rem;
    min-width: 22px;
    text-align: center;
    padding: 0.1rem 0.45rem;
    background: rgba(26, 58, 92, 0.08);
    color: var(--rg-text-muted);
    border-radius: 999px;
    flex-shrink: 0;
    font-weight: 600;
}

[data-mode="dark"] .rd-param-badge[b-txnf7jd4pq] {
    background: rgba(255, 255, 255, 0.08);
}

/* ── Panel principal ── */
.rd-main[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    overflow-y: auto;
    min-height: 0;
}

/* ── Welcome state ── */
.rd-welcome[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 0.75rem;
    color: var(--rg-text-muted);
    text-align: center;
    padding: 3rem;
}

.rd-welcome-icon[b-txnf7jd4pq] {
    font-size: 4rem;
    color: var(--rg-border);
}

.rd-welcome h3[b-txnf7jd4pq] {
    color: var(--rg-text-secondary);
    font-size: 1.1rem;
    margin: 0;
}

.rd-welcome p[b-txnf7jd4pq] {
    font-size: 0.85rem;
    margin: 0;
    max-width: 300px;
}

/* ── Tarjeta de parámetros ── */
.rd-params-card[b-txnf7jd4pq] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow: hidden;
}

.rd-params-header[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rg-text-primary);
}

/* Header clicable para acordeón */
.rd-params-header-toggle[b-txnf7jd4pq] {
    cursor: pointer;
    user-select: none;
    transition: background 0.15s;
}
.rd-params-header-toggle:hover[b-txnf7jd4pq] {
    background: var(--rg-bg-hover);
}

/* Botón chevron — empujado al extremo derecho */
.rd-collapse-toggle[b-txnf7jd4pq] {
    margin-left: auto;
    background: none;
    border: none;
    color: var(--rg-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 5px;
    font-size: 0.85rem;
    transition: background 0.15s, color 0.15s, transform 0.25s;
    flex-shrink: 0;
}
.rd-collapse-toggle:hover[b-txnf7jd4pq] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-primary);
}

/* ── Cuerpo acordeón ── */
.rd-params-body[b-txnf7jd4pq] {
    max-height: 800px;       /* valor mayor que el contenido real */
    overflow: hidden;
    transition: max-height 0.32s cubic-bezier(0.4, 0, 0.2, 1),
                opacity     0.25s ease;
    opacity: 1;
}

.rd-params-body.rd-collapsed[b-txnf7jd4pq] {
    max-height: 0;
    opacity: 0;
}

.rd-module-badge[b-txnf7jd4pq] {
    font-size: 0.7rem;
    padding: 0.15rem 0.5rem;
    background: rgba(26, 58, 92, 0.12);
    color: var(--rg-primary);
    border-radius: 999px;
    font-weight: 500;
}

[data-mode="dark"] .rd-module-badge[b-txnf7jd4pq] {
    background: rgba(147, 180, 212, 0.15);
    color: #93b4d4;
}

/* ── Grid fijo 3 columnas ── */
.rd-params-grid[b-txnf7jd4pq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem;
}

.rd-param-field[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.rd-param-label[b-txnf7jd4pq] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
}

/* Input standalone (sin botón lookup) */
.rd-param-input[b-txnf7jd4pq] {
    padding: 0.45rem 0.65rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.85rem;
    width: 100%;
    min-width: 0;
}

.rd-param-input:focus[b-txnf7jd4pq] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

/* ── Input-group: input + botón 🔍 fusionados en un único borde ── */
.rd-param-input-row[b-txnf7jd4pq] {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    overflow: hidden;
    background: var(--rg-bg-input);
    transition: border-color 0.15s, box-shadow 0.15s;
}

.rd-param-input-row:focus-within[b-txnf7jd4pq] {
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

/* El input dentro del grupo cede el borde al contenedor */
.rd-param-input-row .rd-param-input[b-txnf7jd4pq] {
    flex: 1;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
    min-width: 0;
    width: auto;
}

.rd-param-input-row .rd-param-input:focus[b-txnf7jd4pq] {
    outline: none;
    border: none;
    box-shadow: none;
}

/* Separador visual antes del botón (solo cuando hay hit) */
.rd-param-input-row.rd-has-hit .rd-param-input[b-txnf7jd4pq] {
    border-right: 1px solid var(--rg-border);
}

/* Botón 🔍 fusionado — sin borde propio, sin border-radius */
.rd-hit-btn[b-txnf7jd4pq] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    background: var(--rg-primary);
    color: #fff;
    border: none;
    border-radius: 0;
    cursor: pointer;
    font-size: 0.82rem;
    transition: opacity 0.15s;
}

.rd-hit-btn:hover[b-txnf7jd4pq] { opacity: 0.82; }

/* Input de fecha con máscara MM-DD-YYYY */
.rd-param-date[b-txnf7jd4pq] {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.rd-param-date[b-txnf7jd4pq]::placeholder {
    color: var(--rg-text-muted);
    opacity: 0.6;
    font-family: inherit;
}

.rd-no-params[b-txnf7jd4pq] {
    padding: 1rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
    font-style: italic;
}

.rd-params-actions[b-txnf7jd4pq] {
    display: flex;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}

.rd-error-banner[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 1rem 0.75rem;
    padding: 0.6rem 0.85rem;
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.25);
    border-radius: 6px;
    color: var(--rg-danger);
    font-size: 0.83rem;
}

[data-mode="dark"] .rd-error-banner[b-txnf7jd4pq] {
    background: rgba(220, 38, 38, 0.15);
    border-color: rgba(220, 38, 38, 0.3);
    color: #fca5a5;
}

/* ── Tarjeta de resultados ── */
.rd-results-card[b-txnf7jd4pq] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow: hidden;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.rd-results-header[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.6rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}

.rd-results-title[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
}

.rd-results-count[b-txnf7jd4pq] {
    font-size: 0.78rem;
    padding: 0.15rem 0.6rem;
    background: rgba(34, 197, 94, 0.12);
    color: #166534;
    border-radius: 999px;
    font-weight: 600;
}

[data-mode="dark"] .rd-results-count[b-txnf7jd4pq] {
    color: #86efac;
    background: rgba(34, 197, 94, 0.15);
}

.rd-empty-results[b-txnf7jd4pq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1rem;
    color: var(--rg-text-muted);
    font-size: 0.85rem;
}

.rd-empty-results i[b-txnf7jd4pq] {
    font-size: 2rem;
}

/* ── Tabla de resultados ── */
.rd-table[b-txnf7jd4pq] {
    width: 100%;
    font-size: 0.82rem;
}

/* ── Spinner ── */
.rd-spinner[b-txnf7jd4pq] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: rd-spin-b-txnf7jd4pq 0.7s linear infinite;
    vertical-align: middle;
}

@keyframes rd-spin-b-txnf7jd4pq {
    to { transform: rotate(360deg); }
}


/* ── Responsive (iPhone / tabletas) ── */
@media (max-width: 1024px) {
    .rd-layout[b-txnf7jd4pq] {
        grid-template-columns: 300px 1fr;
    }
}

@media (max-width: 768px) {
    .rd-layout[b-txnf7jd4pq] {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
    }

    .rd-sidebar[b-txnf7jd4pq] {
        max-height: 260px;
    }

    .rd-params-grid[b-txnf7jd4pq] {
        grid-template-columns: 1fr 1fr;
    }

    .rd-container[b-txnf7jd4pq] {
        padding: 0.75rem;
        height: auto;
        min-height: calc(100vh - 80px);
    }
}

@media (max-width: 480px) {
    .rd-params-grid[b-txnf7jd4pq] {
        grid-template-columns: 1fr;
    }

    .rd-header[b-txnf7jd4pq] {
        flex-wrap: wrap;
    }
}

/* ── Modal Visor PDF ──────────────────────────────────────── */

.rd-modal-backdrop[b-txnf7jd4pq] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1000;
}

.rd-modal-container[b-txnf7jd4pq] {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.rd-modal-dialog[b-txnf7jd4pq] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 1100px;
    height: 90vh;
    overflow: hidden;
}

.rd-modal-header[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.25rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}

.rd-modal-title-row[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.rd-modal-title-row h2[b-txnf7jd4pq] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    margin: 0;
}

.rd-pdf-icon[b-txnf7jd4pq] {
    font-size: 1.25rem;
    color: #dc2626;
}

[data-mode="dark"] .rd-pdf-icon[b-txnf7jd4pq] {
    color: #f87171;
}

.rd-modal-close[b-txnf7jd4pq] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    color: var(--rg-text-secondary);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.rd-modal-close:hover[b-txnf7jd4pq] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}

.rd-modal-body[b-txnf7jd4pq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    position: relative;
}

.rd-pdf-loading[b-txnf7jd4pq] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    color: var(--rg-text-secondary);
    font-size: 0.9rem;
    background: var(--rg-bg-card);
    z-index: 1;
}

.rd-pdf-loading .rd-spinner[b-txnf7jd4pq] {
    width: 24px;
    height: 24px;
    border-width: 3px;
    border-color: var(--rg-border);
    border-top-color: var(--rg-primary);
}

.rd-pdf-iframe[b-txnf7jd4pq] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: none;
    background: #525659;
}

.rd-iframe-hidden[b-txnf7jd4pq] {
    visibility: hidden;
}

.rd-modal-footer[b-txnf7jd4pq] {
    display: flex;
    justify-content: flex-end;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    flex-shrink: 0;
}
/* _content/Rgclouds.Web/Components/Pages/Reportes/Frmreporteplantillas.razor.rz.scp.css */
/* ============================================================
   Frmreporteplantillas — Estilos CRUD + Editor Monaco + Preview
   ============================================================ */

.crud-container[b-2283ghuadn] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-2283ghuadn 0.3s ease-out; }
@keyframes slideUp-b-2283ghuadn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-2283ghuadn] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-2283ghuadn] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-2283ghuadn] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-2283ghuadn] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-2283ghuadn] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-2283ghuadn] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-2283ghuadn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-2283ghuadn] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.btn-sm[b-2283ghuadn] { padding: 0.3rem 0.65rem; font-size: 0.74rem; }
.btn-primary[b-2283ghuadn] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-2283ghuadn] { filter: brightness(1.1); }
.btn-outline[b-2283ghuadn] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-2283ghuadn] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-2283ghuadn] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-2283ghuadn] { filter: brightness(1.1); }
.btn-icon[b-2283ghuadn] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-2283ghuadn] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-2283ghuadn] { color: #ef4444; }
.btn-delete:hover[b-2283ghuadn] { background: rgba(239, 68, 68, 0.1); }

/* Alert */
.crud-alert[b-2283ghuadn] { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert > span[b-2283ghuadn] { white-space: pre-line; line-height: 1.45; flex: 1; }
.crud-alert.success[b-2283ghuadn] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-2283ghuadn] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-2283ghuadn] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-2283ghuadn] { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.25); }
[data-mode="dark"] .crud-alert.error[b-2283ghuadn] { background: rgba(239,68,68,0.12); color: #fca5a5; border-color: rgba(239,68,68,0.25); }

/* Search */
.crud-search-bar[b-2283ghuadn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-2283ghuadn] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-2283ghuadn] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-2283ghuadn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-2283ghuadn] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-2283ghuadn] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-2283ghuadn] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-2283ghuadn] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-2283ghuadn] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-2283ghuadn] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-2283ghuadn] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-2283ghuadn] { width: 80px; text-align: center; white-space: nowrap; }

/* Template icon */
.tpl-icon[b-2283ghuadn] { width: 32px; height: 32px; border-radius: 6px; background: rgba(79,70,229,0.1); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1rem; }

/* Badges */
.badge[b-2283ghuadn] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-report[b-2283ghuadn] { background: rgba(79,70,229,0.1); color: var(--rg-accent, #4f46e5); }
.badge-version[b-2283ghuadn] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-muted, #64748b); }
[data-mode="dark"] .badge-report[b-2283ghuadn] { background: rgba(129,140,248,0.15); color: #818cf8; }
[data-mode="dark"] .badge-version[b-2283ghuadn] { color: var(--rg-text-muted); }

/* Utilities */
.font-mono[b-2283ghuadn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-2283ghuadn] { text-align: center; }
.text-muted[b-2283ghuadn] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-2283ghuadn], .crud-empty-state[b-2283ghuadn] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-2283ghuadn] { font-size: 2rem; }
.crud-spinner[b-2283ghuadn] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-2283ghuadn 0.6s linear infinite; }
.crud-spinner-sm[b-2283ghuadn] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-2283ghuadn 0.6s linear infinite; }
@keyframes spin-b-2283ghuadn { to { transform: rotate(360deg); } }
.spin[b-2283ghuadn] { animation: spin-b-2283ghuadn 0.8s linear infinite; display: inline-block; }

/* ── Modal base ─────────────────────────────────────────────── */
.modal-backdrop[b-2283ghuadn] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-2283ghuadn 0.15s ease-out; }
.modal-container[b-2283ghuadn] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-2283ghuadn] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-2283ghuadn 0.2s ease-out; }
.modal-sm[b-2283ghuadn] { max-width: 420px; }
@keyframes fadeIn-b-2283ghuadn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-2283ghuadn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-2283ghuadn] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-2283ghuadn] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger h2[b-2283ghuadn] { color: #dc2626; }
.modal-close[b-2283ghuadn] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-2283ghuadn] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-2283ghuadn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-2283ghuadn] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* ── Modal Editor (grande, ocupa casi toda la pantalla) ─────── */
.modal-editor[b-2283ghuadn] {
    max-width: none;
    width: calc(100vw - 2rem);
    height: calc(100vh - 80px);
    max-height: calc(100vh - 80px);
    border-radius: 0.5rem;
    display: flex;
    flex-direction: column;
}

/* ── Tabs del editor ────────────────────────────────────────── */
.editor-tabs[b-2283ghuadn] { display: flex; border-bottom: 2px solid var(--rg-border, #e2e8f0); flex-shrink: 0; background: var(--rg-bg-subtle, #f8fafc); }
.editor-tab[b-2283ghuadn] { background: none; border: none; padding: 0.6rem 1.1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.editor-tab:hover[b-2283ghuadn] { color: var(--rg-text-primary); }
.editor-tab.active[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); background: var(--rg-bg-card); }

/* Editor body (tab contenido) */
.editor-body[b-2283ghuadn] { flex: 1; overflow: hidden; display: flex; flex-direction: column; padding: 0; }

/* ── TAB 0: Propiedades ──────────────────────────────────────── */
.props-panel[b-2283ghuadn] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.form-row[b-2283ghuadn] { display: flex; gap: 0.6rem; margin-bottom: 0.6rem; }
.form-group[b-2283ghuadn] { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; }
.form-group.flex-2[b-2283ghuadn] { flex: 2; }
.form-group label[b-2283ghuadn] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-2283ghuadn], .form-group select[b-2283ghuadn] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-input, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-2283ghuadn], .form-group select:focus[b-2283ghuadn] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

/* Panel de campos disponibles */
.fields-panel[b-2283ghuadn] { margin-top: 1rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; padding: 0.875rem; background: var(--rg-bg-subtle, #f8fafc); }
.fields-title[b-2283ghuadn] { font-size: 0.72rem; font-weight: 700; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.4rem; }
.fields-grid[b-2283ghuadn] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.field-chip[b-2283ghuadn] { display: flex; flex-direction: column; align-items: flex-start; gap: 0.1rem; padding: 0.3rem 0.5rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; background: var(--rg-bg-card); cursor: pointer; transition: all 0.15s; font-size: 0; }
.field-chip:hover[b-2283ghuadn] { border-color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.06); }
.field-chip i[b-2283ghuadn] { font-size: 0.75rem; color: var(--rg-accent, #4f46e5); }
.field-chip span[b-2283ghuadn] { font-size: 0.75rem; font-weight: 600; color: var(--rg-text-primary); font-family: 'Cascadia Code', 'Fira Code', monospace; }
.field-chip small[b-2283ghuadn] { font-size: 0.65rem; color: var(--rg-text-muted); font-family: monospace; }
.field-chip-global[b-2283ghuadn] { border-style: dashed; }
.field-chip-global i[b-2283ghuadn] { color: #059669; }
.fields-hint[b-2283ghuadn] { margin-top: 0.5rem; font-size: 0.7rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.35rem; }
.fields-hint code[b-2283ghuadn] { background: var(--rg-bg-subtle); padding: 0.1rem 0.3rem; border-radius: 0.25rem; }

/* ── TAB 1: JSON Editor ──────────────────────────────────────── */
.editor-split[b-2283ghuadn] { display: flex; flex: 1; overflow: hidden; height: 100%; }
.editor-monaco-wrap[b-2283ghuadn] { flex: 1; display: flex; flex-direction: column; overflow: hidden; }
.editor-toolbar[b-2283ghuadn] { display: flex; gap: 0.4rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle, #f8fafc); border-bottom: 1px solid var(--rg-border); flex-shrink: 0; flex-wrap: wrap; }
.monaco-container[b-2283ghuadn] { flex: 1; min-height: 0; }
.editor-fields-sidebar[b-2283ghuadn] { width: 180px; border-left: 1px solid var(--rg-border); background: var(--rg-bg-subtle); overflow: hidden; display: flex; flex-direction: column; flex-shrink: 0; }
.fields-list-scroll[b-2283ghuadn] { flex: 1; overflow-y: auto; padding: 0.5rem; display: flex; flex-direction: column; gap: 0.25rem; }
.field-chip-sm[b-2283ghuadn] { display: block; text-align: left; background: none; border: 1px solid var(--rg-border); border-radius: 0.25rem; padding: 0.2rem 0.4rem; cursor: pointer; transition: background 0.1s; width: 100%; }
.field-chip-sm:hover[b-2283ghuadn] { background: rgba(79,70,229,0.08); border-color: var(--rg-accent); }
.field-chip-sm code[b-2283ghuadn] { font-size: 0.65rem; color: var(--rg-accent, #4f46e5); word-break: break-all; }
.field-chip-sm-global code[b-2283ghuadn] { color: #059669; }

/* ── TAB 2: Preview ──────────────────────────────────────────── */
.preview-panel[b-2283ghuadn] { display: flex; flex-direction: column; flex: 1; overflow: hidden; }
.preview-toolbar[b-2283ghuadn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); flex-shrink: 0; flex-wrap: wrap; }
.preview-image-wrap[b-2283ghuadn] { flex: 1; overflow: auto; display: flex; align-items: flex-start; justify-content: center; padding: 1rem; background: var(--rg-bg-subtle); }
.preview-img[b-2283ghuadn] { max-width: 100%; box-shadow: 0 4px 20px rgba(0,0,0,0.15); border-radius: 4px; }

/* ── TAB 3: Ayuda ────────────────────────────────────────────── */
.help-panel[b-2283ghuadn] { padding: 1.25rem; overflow-y: auto; flex: 1; }
.help-h3[b-2283ghuadn] { font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 1.25rem; display: flex; align-items: center; gap: 0.5rem; }
.help-step[b-2283ghuadn] { display: flex; gap: 1rem; margin-bottom: 1.25rem; }
.help-step-num[b-2283ghuadn] { width: 28px; height: 28px; border-radius: 50%; background: var(--rg-accent, #4f46e5); color: #fff; font-size: 0.8rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 0.1rem; }
.help-step-body[b-2283ghuadn] { flex: 1; }
.help-step-body strong[b-2283ghuadn] { display: block; font-size: 0.85rem; color: var(--rg-text-primary); margin-bottom: 0.25rem; }
.help-step-body p[b-2283ghuadn] { font-size: 0.78rem; color: var(--rg-text-secondary); margin: 0 0 0.5rem; }
.help-step-body ol[b-2283ghuadn] { font-size: 0.78rem; color: var(--rg-text-secondary); padding-left: 1.25rem; margin: 0; }
.help-step-body ol li[b-2283ghuadn] { margin-bottom: 0.25rem; }
.help-code[b-2283ghuadn] { background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border); border-radius: 0.375rem; padding: 0.65rem 0.85rem; font-size: 0.72rem; color: var(--rg-text-primary); font-family: 'Cascadia Code', 'Fira Code', monospace; white-space: pre-wrap; margin: 0.4rem 0; overflow-x: auto; }
.help-comp-grid[b-2283ghuadn] { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.35rem 0; }
.help-comp[b-2283ghuadn] { background: var(--rg-bg-subtle); border: 1px solid var(--rg-border); border-radius: 0.375rem; padding: 0.3rem 0.6rem; font-size: 0.72rem; color: var(--rg-text-secondary); }
.help-comp code[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); font-family: monospace; margin-right: 0.3rem; }
.help-table[b-2283ghuadn] { width: 100%; border-collapse: collapse; font-size: 0.75rem; margin: 0.4rem 0; }
.help-table th[b-2283ghuadn] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; padding: 0.35rem 0.6rem; border: 1px solid var(--rg-border); text-align: left; }
.help-table td[b-2283ghuadn] { padding: 0.3rem 0.6rem; border: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.help-table td code[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); font-size: 0.72rem; }

/* Dark mode overrides */
[data-mode="dark"] .editor-tabs[b-2283ghuadn] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .editor-tab.active[b-2283ghuadn] { background: var(--rg-bg-card); }
[data-mode="dark"] .fields-panel[b-2283ghuadn] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .help-code[b-2283ghuadn] { background: rgba(255,255,255,0.05); }
[data-mode="dark"] .help-comp[b-2283ghuadn] { background: rgba(255,255,255,0.05); }
[data-mode="dark"] .crud-table th[b-2283ghuadn] { background: var(--rg-bg-subtle); }
[data-mode="dark"] .crud-table tbody tr:hover[b-2283ghuadn] { background: var(--rg-bg-hover); }
[data-mode="dark"] .preview-image-wrap[b-2283ghuadn] { background: var(--rg-bg-subtle); }

/* ── Overrides para el nuevo editor de scripts ─────────────── */

/* Badge variants usadas por el grid */
.badge-yes[b-2283ghuadn] { background: rgba(34,197,94,0.15); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.badge-no[b-2283ghuadn]  { background: rgba(239,68,68,0.15); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .badge-yes[b-2283ghuadn] { color: #86efac; }
[data-mode="dark"] .badge-no[b-2283ghuadn]  { color: #fca5a5; }

.badge-app[b-2283ghuadn]   { display: inline-flex; padding: 0.12rem 0.5rem; border-radius: 0.3rem; background: rgba(79,70,229,0.12); color: var(--rg-accent, #4f46e5); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.03em; }
.badge-count[b-2283ghuadn] { background: var(--rg-bg-subtle, #f1f5f9); color: var(--rg-text-secondary, #475569); font-family: monospace; }
[data-mode="dark"] .badge-app[b-2283ghuadn] { background: rgba(129,140,248,0.18); color: #a5b4fc; }

.subtle-text[b-2283ghuadn] { font-size: 0.76rem; color: var(--rg-text-secondary, #64748b); }

.filter-inactive[b-2283ghuadn] { display: flex; align-items: center; gap: 0.35rem; margin-left: 1rem; font-size: 0.78rem; color: var(--rg-text-secondary); cursor: pointer; }
.filter-inactive input[b-2283ghuadn] { accent-color: var(--rg-accent, #4f46e5); }

.help-hint[b-2283ghuadn] { font-size: 0.78rem; color: var(--rg-text-secondary, #64748b); background: var(--rg-bg-subtle, #f8fafc); border-left: 3px solid var(--rg-accent, #4f46e5); padding: 0.5rem 0.75rem; border-radius: 0 0.375rem 0.375rem 0; margin-bottom: 0.75rem; }
.help-hint code[b-2283ghuadn] { background: var(--rg-bg-card); padding: 0.05rem 0.35rem; border-radius: 0.25rem; font-size: 0.75rem; color: var(--rg-accent, #4f46e5); }
.empty-hint[b-2283ghuadn] { font-size: 0.76rem; color: var(--rg-text-muted); font-style: italic; padding: 0.25rem 0; }

.spinner-inline[b-2283ghuadn] { display: inline-block; width: 12px; height: 12px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin-b-2283ghuadn 0.6s linear infinite; margin-right: 0.25rem; vertical-align: middle; }

/* Params / Hits editable table */
.params-table[b-2283ghuadn] { width: 100%; border-collapse: collapse; font-size: 0.8rem; }
.params-table th[b-2283ghuadn] { background: var(--rg-bg-subtle, #f8fafc); padding: 0.5rem 0.65rem; border: 1px solid var(--rg-border, #e2e8f0); text-align: left; font-size: 0.7rem; text-transform: uppercase; color: var(--rg-text-secondary); letter-spacing: 0.03em; }
.params-table td[b-2283ghuadn] { padding: 0.35rem 0.45rem; border: 1px solid var(--rg-border, #e2e8f0); }
.params-table input[b-2283ghuadn], .params-table select[b-2283ghuadn] { width: 100%; padding: 0.35rem 0.45rem; border: 1px solid transparent; background: transparent; font-size: 0.8rem; color: var(--rg-text-primary); outline: none; border-radius: 0.25rem; }
.params-table input:focus[b-2283ghuadn], .params-table select:focus[b-2283ghuadn] { border-color: var(--rg-accent, #4f46e5); background: var(--rg-bg-input, #fff); }

/* ── Botones Hit — nuevo diseño ── */
.hit-help[b-2283ghuadn] { display: flex; align-items: flex-start; gap: 0.6rem; }
.hit-help i[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); margin-top: 2px; flex-shrink: 0; }
.hit-help div[b-2283ghuadn] { line-height: 1.55; }
.hit-contract[b-2283ghuadn] { background: var(--rg-bg-card); color: var(--rg-accent, #4f46e5); font-family: monospace; font-size: 0.72rem; padding: 0.05rem 0.4rem; border-radius: 4px; border: 1px solid var(--rg-border); margin-left: 0.35rem; }

.hit-param-cell[b-2283ghuadn] { vertical-align: middle; padding: 0.45rem !important; }
.hit-param-badge[b-2283ghuadn] { display: inline-flex; align-items: center; gap: 0.3rem; background: rgba(79,70,229,0.1); color: var(--rg-accent, #4f46e5); border-radius: 5px; padding: 0.2rem 0.5rem; font-size: 0.75rem; font-weight: 600; font-family: monospace; }
.hit-param-empty[b-2283ghuadn] { font-size: 0.72rem; color: var(--rg-text-muted); font-style: italic; }
.hit-row-disabled[b-2283ghuadn] { opacity: 0.45; pointer-events: none; }

.hit-sql-area[b-2283ghuadn] { width: 100%; padding: 0.35rem 0.5rem; font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.75rem; border: 1px solid transparent; background: transparent; color: var(--rg-text-primary); outline: none; resize: none; border-radius: 4px; line-height: 1.4; }
.hit-sql-area:focus[b-2283ghuadn] { border-color: var(--rg-accent, #4f46e5); background: var(--rg-bg-input); }
.hit-sql-area:disabled[b-2283ghuadn] { opacity: 0.4; cursor: not-allowed; }

.btn-hit-test[b-2283ghuadn] { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: none; background: var(--rg-primary); color: #fff; border-radius: 5px; cursor: pointer; font-size: 0.78rem; transition: opacity 0.15s; }
.btn-hit-test:hover[b-2283ghuadn] { opacity: 0.82; }

/* Overrides field-chip: el nuevo panel usa texto directo */
.fields-panel[b-2283ghuadn] { display: flex; flex-direction: column; gap: 0.75rem; padding: 0.75rem; margin: 0; border-radius: 0; border: none; border-right: 1px solid var(--rg-border); background: var(--rg-bg-subtle); width: 220px; min-width: 220px; overflow-y: auto; }
.fields-section[b-2283ghuadn] { display: flex; flex-direction: column; gap: 0.3rem; }
.fields-section h4[b-2283ghuadn] { margin: 0 0 0.15rem 0; font-size: 0.7rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.04em; display: flex; align-items: center; gap: 0.35rem; }
.fields-section h4 i[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); }

/* field-chip en el nuevo editor: simples etiquetas con texto */
.fields-panel .field-chip[b-2283ghuadn],
.fields-panel .field-chip-global[b-2283ghuadn],
.fields-panel .field-chip-sm[b-2283ghuadn] {
    display: inline-block;
    font-size: 0.72rem;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-weight: 600;
    color: var(--rg-accent, #4f46e5);
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    padding: 0.25rem 0.5rem;
    margin: 0 0.25rem 0.25rem 0;
    cursor: pointer;
    transition: all 0.1s;
    text-align: left;
    width: auto;
}
.fields-panel .field-chip-global[b-2283ghuadn] { color: #059669; border-style: dashed; }
.fields-panel .field-chip-sm[b-2283ghuadn] { font-size: 0.7rem; font-family: inherit; font-weight: 500; color: var(--rg-text-secondary); }
.fields-panel .field-chip:hover[b-2283ghuadn] { background: rgba(79,70,229,0.08); border-color: var(--rg-accent); }
.fields-panel .field-chip-global:hover[b-2283ghuadn] { background: rgba(5,150,105,0.08); border-color: #059669; }
.fields-panel .field-chip-sm:hover[b-2283ghuadn] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
[data-mode="dark"] .fields-panel .field-chip-global[b-2283ghuadn] { color: #6ee7b7; }

/* Monaco wrapper ocupa todo el resto */
.editor-split[b-2283ghuadn] { height: calc(100vh - 220px); }

/* ── TAB Test ─────────────────────────────────────────────── */
.test-layout[b-2283ghuadn] { display: flex; gap: 1rem; height: calc(100vh - 220px); min-height: 400px; }
.test-params[b-2283ghuadn] { width: 320px; min-width: 320px; overflow-y: auto; padding-right: 0.5rem; border-right: 1px solid var(--rg-border); display: flex; flex-direction: column; gap: 0.5rem; }
.test-params h4[b-2283ghuadn] { margin: 0 0 0.3rem; font-size: 0.78rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.35rem; }
.test-params h4 i[b-2283ghuadn] { color: var(--rg-accent); }
.test-param-row[b-2283ghuadn] { display: flex; flex-direction: column; gap: 0.2rem; }
.test-param-row label[b-2283ghuadn] { display: flex; justify-content: space-between; align-items: baseline; font-size: 0.7rem; }
.test-param-name[b-2283ghuadn] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-weight: 700; color: var(--rg-accent, #4f46e5); }
.test-param-type[b-2283ghuadn] { font-size: 0.62rem; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }

/* ── Input-group Test tab: input + botón 🔍 fusionados ── */
.test-input-row[b-2283ghuadn] { display: flex; align-items: stretch; border: 1px solid var(--rg-border); border-radius: 6px; overflow: hidden; background: var(--rg-bg-input); transition: border-color 0.15s, box-shadow 0.15s; }
.test-input-row:focus-within[b-2283ghuadn] { border-color: var(--rg-primary); box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15); }
.test-input-row .form-control[b-2283ghuadn] { flex: 1; border: none !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; outline: none !important; min-width: 0; font-size: 0.82rem; padding: 0.38rem 0.55rem; color: var(--rg-text-primary); }
.test-input-row .form-control:focus[b-2283ghuadn] { outline: none !important; box-shadow: none !important; }
.test-input-row.test-has-hit .form-control[b-2283ghuadn] { border-right: 1px solid var(--rg-border) !important; }
.test-hit-btn[b-2283ghuadn] { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 34px; background: var(--rg-primary); color: #fff; border: none; border-radius: 0; cursor: pointer; font-size: 0.8rem; transition: opacity 0.15s; }
.test-hit-btn:hover[b-2283ghuadn] { opacity: 0.82; }

.test-actions[b-2283ghuadn] { margin-top: 0.75rem; }

.test-result[b-2283ghuadn] { flex: 1; overflow: hidden; display: flex; flex-direction: column; }
.test-placeholder[b-2283ghuadn] { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--rg-text-muted); text-align: center; gap: 0.5rem; padding: 2rem; }
.test-placeholder i[b-2283ghuadn] { font-size: 2.5rem; opacity: 0.4; }
.test-placeholder p[b-2283ghuadn] { margin: 0; font-size: 0.85rem; }

.test-error[b-2283ghuadn] { border: 1px solid rgba(239,68,68,0.3); background: rgba(239,68,68,0.06); border-radius: 0.5rem; overflow: hidden; display: flex; flex-direction: column; }
.test-error-header[b-2283ghuadn] { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.85rem; background: rgba(239,68,68,0.12); color: #991b1b; font-weight: 700; font-size: 0.8rem; border-bottom: 1px solid rgba(239,68,68,0.2); }
.test-error-header .test-duration[b-2283ghuadn] { margin-left: auto; font-weight: 500; font-size: 0.7rem; color: var(--rg-text-muted); }
.test-error pre[b-2283ghuadn] { margin: 0; padding: 0.85rem; font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.78rem; color: var(--rg-text-primary); white-space: pre-wrap; word-break: break-word; max-height: 300px; overflow-y: auto; }
[data-mode="dark"] .test-error-header[b-2283ghuadn] { color: #fca5a5; }

.test-success[b-2283ghuadn] { display: flex; flex-direction: column; flex: 1; gap: 0.5rem; min-height: 0; }
.test-summary[b-2283ghuadn] { display: flex; align-items: center; gap: 0.85rem; padding: 0.5rem 0.75rem; background: var(--rg-bg-subtle, #f8fafc); border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-secondary); flex-wrap: wrap; }
.test-summary strong[b-2283ghuadn] { color: var(--rg-text-primary); }
.test-duration[b-2283ghuadn] { color: var(--rg-text-muted); display: inline-flex; align-items: center; gap: 0.25rem; }
.test-clip[b-2283ghuadn] { color: var(--rg-text-muted); font-style: italic; font-size: 0.72rem; }

/* Sub-pestañas por resultset (tbEmpresa, dtdatos, dtdatos1, ...) */
.test-rs-tabs[b-2283ghuadn] { display: flex; gap: 0.25rem; flex-wrap: wrap; border-bottom: 1px solid var(--rg-border); padding-bottom: 0; margin-top: 0.25rem; }
.test-rs-tab[b-2283ghuadn] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.75rem; background: transparent; border: 1px solid transparent; border-bottom: none; border-radius: 0.375rem 0.375rem 0 0; color: var(--rg-text-secondary); font-size: 0.75rem; cursor: pointer; font-weight: 500; transition: background 0.15s, color 0.15s; margin-bottom: -1px; }
.test-rs-tab:hover[b-2283ghuadn] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.test-rs-tab.active[b-2283ghuadn] { background: var(--rg-bg-card); border-color: var(--rg-border); color: var(--rg-primary); border-bottom-color: var(--rg-bg-card); }
.test-rs-name[b-2283ghuadn] { font-family: var(--rg-font-mono, ui-monospace, monospace); }
.test-rs-count[b-2283ghuadn] { background: var(--rg-bg-subtle); color: var(--rg-text-muted); font-size: 0.65rem; padding: 0.1rem 0.4rem; border-radius: 999px; font-weight: 600; }
.test-rs-tab.active .test-rs-count[b-2283ghuadn] { background: var(--rg-primary); color: #fff; }

.test-rs-summary[b-2283ghuadn] { display: flex; align-items: center; gap: 0.75rem; padding: 0.4rem 0.65rem; font-size: 0.72rem; color: var(--rg-text-secondary); background: var(--rg-bg-subtle); border-radius: 0.25rem; flex-wrap: wrap; }
.test-rs-summary strong[b-2283ghuadn] { color: var(--rg-text-primary); font-family: var(--rg-font-mono, ui-monospace, monospace); }

.test-grid-wrap[b-2283ghuadn] { flex: 1; overflow: auto; border: 1px solid var(--rg-border); border-radius: 0.375rem; background: var(--rg-bg-card); min-height: 0; }
.test-grid[b-2283ghuadn] { width: 100%; border-collapse: collapse; font-size: 0.74rem; }
.test-grid thead[b-2283ghuadn] { position: sticky; top: 0; z-index: 1; }
.test-grid th[b-2283ghuadn] { background: var(--rg-bg-subtle, #f8fafc); padding: 0.4rem 0.65rem; border-bottom: 2px solid var(--rg-border); text-align: left; color: var(--rg-text-secondary); font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.03em; white-space: nowrap; }
.test-grid td[b-2283ghuadn] { padding: 0.35rem 0.65rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); white-space: nowrap; max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
.test-grid tbody tr:hover[b-2283ghuadn] { background: var(--rg-bg-hover); }

/* ── Grupo Inactivos (acordeón) ───────────────────────────────── */
.rpt-group[b-2283ghuadn] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    overflow: hidden;
    background: var(--rg-bg-card);
}

.rpt-group-header[b-2283ghuadn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.55rem 0.85rem;
    background: rgba(239, 68, 68, 0.07);
    border: none;
    cursor: pointer;
    color: var(--rg-text-secondary);
    font-size: 0.78rem;
    font-weight: 600;
    transition: background 0.15s;
    text-align: left;
}
.rpt-group-header:hover[b-2283ghuadn] { background: rgba(239, 68, 68, 0.12); }
[data-mode="dark"] .rpt-group-header[b-2283ghuadn] { background: rgba(239, 68, 68, 0.1); }
[data-mode="dark"] .rpt-group-header:hover[b-2283ghuadn] { background: rgba(239, 68, 68, 0.18); }

.rpt-group-header-left[b-2283ghuadn] { display: flex; align-items: center; gap: 0.5rem; }
.rpt-group-icon[b-2283ghuadn] { color: #ef4444; font-size: 0.85rem; }
.rpt-group-title[b-2283ghuadn] { color: #ef4444; }
.rpt-group-count[b-2283ghuadn] {
    background: rgba(239, 68, 68, 0.15);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.25);
    padding: 0.1rem 0.45rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 700;
}
[data-mode="dark"] .rpt-group-count[b-2283ghuadn] { background: rgba(239,68,68,0.2); color: #fca5a5; }

.rpt-group-chevron[b-2283ghuadn] { color: var(--rg-text-muted); transition: transform 0.2s; font-size: 0.75rem; }

.rpt-group-body[b-2283ghuadn] {
    max-height: 600px;
    overflow: hidden;
    opacity: 1;
    transition: max-height 0.3s ease, opacity 0.25s ease;
}
.rpt-group-collapsed[b-2283ghuadn] {
    max-height: 0 !important;
    opacity: 0;
}

/* Filas inactivas con opacidad reducida */
.rpt-row-inactive td[b-2283ghuadn] { opacity: 0.65; }
.rpt-row-inactive:hover td[b-2283ghuadn] { opacity: 1; }
.rpt-table-inactive thead th[b-2283ghuadn] { background: rgba(239, 68, 68, 0.05); }

/* Botón reactivar */
.btn-reactivate[b-2283ghuadn] { color: #16a34a; }
.btn-reactivate:hover[b-2283ghuadn] { background: rgba(22, 163, 74, 0.1); }
[data-mode="dark"] .btn-reactivate[b-2283ghuadn] { color: #86efac; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-2283ghuadn] { padding: 0.75rem; }
    .crud-header[b-2283ghuadn] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-2283ghuadn] { display: none; }
    .modal-editor[b-2283ghuadn] { width: 100vw; height: 100vh; border-radius: 0; }
    .editor-split[b-2283ghuadn] { flex-direction: column; }
    .editor-fields-sidebar[b-2283ghuadn] { width: 100%; height: 120px; border-left: none; border-top: 1px solid var(--rg-border); }
    .fields-list-scroll[b-2283ghuadn] { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }
    .field-chip-sm[b-2283ghuadn] { flex-shrink: 0; }
    .help-step[b-2283ghuadn] { flex-direction: column; gap: 0.5rem; }
    .ai-tab-layout[b-2283ghuadn] { flex-direction: column; }
    .ai-controls-panel[b-2283ghuadn] { width: 100%; border-right: none; border-bottom: 1px solid var(--rg-border); }
}

/* ================================================================
   TAB PLANTILLA IA
   ================================================================ */

/* Tab button especial con degradado */
.editor-tab.ai-tab[b-2283ghuadn] { position: relative; }
.editor-tab.ai-tab.active[b-2283ghuadn],
.editor-tab.ai-tab:hover:not(:disabled)[b-2283ghuadn] {
    background: linear-gradient(135deg, rgba(79,70,229,0.15), rgba(168,85,247,0.15));
    color: var(--rg-accent, #4f46e5);
    border-bottom-color: var(--rg-accent, #4f46e5);
}
.editor-tab.ai-tab .bi-stars[b-2283ghuadn] { color: #a855f7; }
.editor-tab.ai-tab:disabled[b-2283ghuadn] { opacity: 0.45; }

/* Layout horizontal de dos paneles */
.ai-tab-layout[b-2283ghuadn] {
    display: flex;
    height: 100%;
    gap: 0;
    overflow: hidden;
}

/* Panel izquierdo — controles */
.ai-controls-panel[b-2283ghuadn] {
    width: 340px;
    min-width: 280px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.85rem;
    overflow-y: auto;
    border-right: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}

.ai-section[b-2283ghuadn] { display: flex; flex-direction: column; gap: 0.4rem; }
.ai-section h4[b-2283ghuadn] {
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.ai-hint[b-2283ghuadn] {
    font-size: 0.74rem;
    color: var(--rg-text-muted);
    margin: 0;
    line-height: 1.4;
}

/* Chips de columnas */
.ai-cols-list[b-2283ghuadn] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.ai-col-chip[b-2283ghuadn] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    background: rgba(79,70,229,0.12);
    color: var(--rg-accent, #4f46e5);
    border: 1px solid rgba(79,70,229,0.25);
    border-radius: 0.85rem;
    font-size: 0.7rem;
    font-family: monospace;
    cursor: pointer;
    transition: all 0.12s;
    user-select: none;
}
.ai-col-chip:hover[b-2283ghuadn] {
    background: rgba(79,70,229,0.22);
    border-color: var(--rg-accent, #4f46e5);
    transform: scale(1.04);
}

[data-mode="dark"] .ai-col-chip[b-2283ghuadn] {
    background: rgba(129,140,248,0.18);
    color: #a5b4fc;
    border-color: rgba(129,140,248,0.3);
}

/* Textarea del prompt */
.ai-prompt-area[b-2283ghuadn] {
    width: 100%;
    resize: vertical;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.55rem 0.7rem;
    font-size: 0.8rem;
    line-height: 1.5;
    font-family: inherit;
    transition: border-color 0.15s;
}
.ai-prompt-area:focus[b-2283ghuadn] {
    outline: none;
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 3px rgba(79,70,229,0.12);
}

.ai-generate-btn[b-2283ghuadn] { width: 100%; justify-content: center; }

/* Sección iteración */
.ai-iterate-section[b-2283ghuadn] { border-top: 1px solid var(--rg-border); padding-top: 0.75rem; }
.ai-iterate-btn[b-2283ghuadn] { width: 100%; justify-content: center; }

/* Sección guardar */
.ai-save-section[b-2283ghuadn] { display: flex; flex-direction: column; gap: 0.35rem; }
.ai-save-btn[b-2283ghuadn] { width: 100%; justify-content: center; }
.ai-save-hint[b-2283ghuadn] { font-size: 0.7rem; color: var(--rg-text-muted); margin: 0; line-height: 1.4; }

/* Caja de error */
.ai-error-box[b-2283ghuadn] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 0.6rem 0.75rem;
    background: rgba(239,68,68,0.1);
    color: #b91c1c;
    border: 1px solid rgba(239,68,68,0.25);
    border-radius: 0.5rem;
    font-size: 0.76rem;
    line-height: 1.4;
}
[data-mode="dark"] .ai-error-box[b-2283ghuadn] { color: #fca5a5; }

/* Panel derecho — preview */
.ai-preview-panel[b-2283ghuadn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--rg-bg-card);
}

/* Sub-tabs preview / code */
.ai-preview-tabs[b-2283ghuadn] {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    padding: 0 0.75rem;
}
.ai-preview-tab[b-2283ghuadn] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.85rem;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--rg-text-secondary);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: all 0.12s;
    margin-bottom: -1px;
}
.ai-preview-tab:hover[b-2283ghuadn] { color: var(--rg-accent, #4f46e5); }
.ai-preview-tab.active[b-2283ghuadn] {
    color: var(--rg-accent, #4f46e5);
    border-bottom-color: var(--rg-accent, #4f46e5);
    font-weight: 600;
}

/* iframe sandboxed */
.ai-iframe[b-2283ghuadn] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: none;
    background: #fff;
}

/* Editor de HTML */
.ai-html-editor[b-2283ghuadn] {
    flex: 1;
    width: 100%;
    height: 100%;
    resize: none;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.78rem;
    line-height: 1.5;
    padding: 0.75rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: none;
    outline: none;
}

/* Placeholder del preview */
.ai-preview-placeholder[b-2283ghuadn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    color: var(--rg-text-muted);
    padding: 2rem;
    text-align: center;
}
.ai-preview-placeholder .bi-stars[b-2283ghuadn] {
    font-size: 3rem;
    color: #a855f7;
    opacity: 0.5;
}
.ai-preview-placeholder p[b-2283ghuadn] { margin: 0; font-size: 0.85rem; line-height: 1.5; }

/* ── Designer V6 host (pestaña Diseñador) ─────────────────────── */
.rgd-edt-host[b-2283ghuadn] {
    height: calc(100vh - 240px);
    min-height: 500px;
    display: flex;
    flex-direction: column;
}
.rgd-edt-host > *[b-2283ghuadn] {
    flex: 1;
    min-height: 0;
}
/* _content/Rgclouds.Web/Components/Pages/Sac/Sac_boardconfig.razor.rz.scp.css */
/* ============================================================
   ⚙️ Sac_boardconfig — Admin de DataSources (estándar CRUD)
   ============================================================ */

.crud-container[b-7o8128roo8] { padding: 1.25rem; animation: d2SlideUp-b-7o8128roo8 0.3s ease-out; }
@keyframes d2SlideUp-b-7o8128roo8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.crud-header[b-7o8128roo8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-7o8128roo8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-7o8128roo8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-7o8128roo8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-7o8128roo8] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-7o8128roo8] { display: flex; gap: 0.5rem; }

.btn-crud[b-7o8128roo8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-7o8128roo8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-7o8128roo8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-7o8128roo8] { filter: brightness(1.1); }
.btn-outline[b-7o8128roo8] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-7o8128roo8] { background: var(--rg-bg-hover); }
.btn-danger[b-7o8128roo8] { background: #ef4444; color: #fff; }
.btn-icon[b-7o8128roo8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; background: transparent; }
.btn-edit[b-7o8128roo8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-7o8128roo8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-7o8128roo8] { color: #ef4444; }
.btn-delete:hover[b-7o8128roo8] { background: rgba(239, 68, 68, 0.1); }

/* Alerts + search */
.crud-alert[b-7o8128roo8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-7o8128roo8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-7o8128roo8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-7o8128roo8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-7o8128roo8] { background: rgba(34,197,94,0.15); color: #86efac; border-color: rgba(34,197,94,0.3); }
[data-mode="dark"] .crud-alert.error[b-7o8128roo8]   { background: rgba(220,38,38,0.15); color: #fca5a5; border-color: rgba(220,38,38,0.3); }

.crud-search-bar[b-7o8128roo8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card); }
.crud-search-bar i[b-7o8128roo8] { color: var(--rg-text-muted); }
.crud-search-bar input[b-7o8128roo8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary); }
.crud-count[b-7o8128roo8] { font-size: 0.7rem; color: var(--rg-text-muted); white-space: nowrap; }

/* Loading / Empty */
.crud-loading[b-7o8128roo8], .crud-empty-state[b-7o8128roo8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-7o8128roo8] { font-size: 2rem; }
.crud-spinner[b-7o8128roo8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: dsSpin-b-7o8128roo8 0.6s linear infinite; }
.crud-spinner-sm[b-7o8128roo8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: dsSpin-b-7o8128roo8 0.6s linear infinite; }
@keyframes dsSpin-b-7o8128roo8 { to { transform: rotate(360deg); } }
.spin[b-7o8128roo8] { animation: dsSpin-b-7o8128roo8 0.8s linear infinite; }

/* Tabla */
.crud-grid-wrapper[b-7o8128roo8] { border: 1px solid var(--rg-border); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card); max-height: calc(100vh - 280px); }
.crud-table[b-7o8128roo8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-7o8128roo8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-7o8128roo8] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-7o8128roo8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); vertical-align: middle; }
.crud-table tbody tr:hover[b-7o8128roo8] { background: var(--rg-bg-hover); }
.col-actions[b-7o8128roo8] { width: 120px; text-align: center; white-space: nowrap; }

/* Badges */
.badge[b-7o8128roo8] { display: inline-flex; align-items: center; padding: 0.2rem 0.6rem; border-radius: 999px; font-size: 0.7rem; font-weight: 600; }
.badge-yes[b-7o8128roo8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-7o8128roo8]  { background: #f1f5f9; color: #64748b; }
[data-mode="dark"] .badge-yes[b-7o8128roo8] { background: rgba(34, 197, 94, 0.15); color: #86efac; }
[data-mode="dark"] .badge-no[b-7o8128roo8]  { background: rgba(148, 163, 184, 0.2); color: #cbd5e1; }

.font-mono[b-7o8128roo8] { font-family: 'Cascadia Code', 'Fira Code', ui-monospace, monospace; font-size: 0.76rem; }

.fam-count-chip[b-7o8128roo8] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 1.85rem;
    padding: 0.15rem 0.55rem;
    background: rgba(26, 58, 92, 0.08);
    color: var(--rg-primary, #0B8AD9);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}
[data-mode="dark"] .fam-count-chip[b-7o8128roo8] { background: rgba(147, 180, 212, 0.18); color: #93b4d4; }

/* ── Icono de tipo de DataSource en la fila ── */
.ds-icon[b-7o8128roo8] {
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
}
.ds-icon-sql[b-7o8128roo8] { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.ds-icon-service[b-7o8128roo8] { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }

.ds-tipo-badge[b-7o8128roo8] {
    display: inline-flex; align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 4px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.ds-tipo-sql[b-7o8128roo8]     { background: rgba(59, 130, 246, 0.15); color: #1d4ed8; }
.ds-tipo-service[b-7o8128roo8] { background: rgba(139, 92, 246, 0.15); color: #6d28d9; }
[data-mode="dark"] .ds-tipo-sql[b-7o8128roo8]     { color: #93c5fd; }
[data-mode="dark"] .ds-tipo-service[b-7o8128roo8] { color: #c4b5fd; }

/* ── Modal ── */
.modal-backdrop[b-7o8128roo8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-7o8128roo8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-7o8128roo8] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-7o8128roo8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 60px); max-height: calc(100vh - 60px); }
.modal-sm[b-7o8128roo8] { max-width: 480px; }
.modal-header[b-7o8128roo8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-7o8128roo8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger h2[b-7o8128roo8] { color: #dc2626; }
.modal-close[b-7o8128roo8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-7o8128roo8] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-7o8128roo8] { padding: 0; overflow-y: auto; flex: 1; background: var(--rg-bg-page); }
.modal-footer[b-7o8128roo8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-backdrop-nested[b-7o8128roo8] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-7o8128roo8] { z-index: 2001 !important; }
.modal-sm .modal-body[b-7o8128roo8] { padding: 1rem 1.25rem; }
.modal-sm .modal-body p[b-7o8128roo8] { margin: 0.5rem 0; font-size: 0.85rem; color: var(--rg-text-primary); }

/* Form del modal */
.ds-form-grid[b-7o8128roo8] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.ds-full[b-7o8128roo8] { grid-column: 1 / -1; }

.d2-field[b-7o8128roo8] { display: flex; flex-direction: column; gap: 0.3rem; }
.d2-field label[b-7o8128roo8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary); }
.d2-field input[b-7o8128roo8], .d2-field select[b-7o8128roo8], .d2-field textarea[b-7o8128roo8] {
    padding: 0.45rem 0.6rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.82rem;
    font-family: inherit;
}
.d2-field textarea[b-7o8128roo8] { resize: vertical; }

.ds-sql[b-7o8128roo8] { font-family: 'Cascadia Code', 'Fira Code', ui-monospace, monospace !important; font-size: 0.8rem !important; }

.ds-section-title[b-7o8128roo8] {
    font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary);
    margin: 1rem 0 0.5rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid var(--rg-border);
}

.ds-tipo-selector[b-7o8128roo8] { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem; }
.ds-tipo-btn[b-7o8128roo8] {
    display: flex; align-items: flex-start; gap: 0.65rem;
    padding: 0.85rem;
    background: var(--rg-bg-card);
    border: 1.5px solid var(--rg-border);
    border-radius: 6px;
    cursor: pointer; text-align: left;
    transition: all 0.15s;
}
.ds-tipo-btn:hover[b-7o8128roo8] { border-color: var(--rg-accent, #4f46e5); }
.ds-tipo-btn.selected[b-7o8128roo8] { border-color: var(--rg-accent, #4f46e5); background: rgba(79, 70, 229, 0.06); }
.ds-tipo-btn i[b-7o8128roo8] { font-size: 1.4rem; color: var(--rg-accent, #4f46e5); flex-shrink: 0; }
.ds-tipo-btn strong[b-7o8128roo8] { display: block; font-size: 0.82rem; color: var(--rg-text-primary); margin-bottom: 0.2rem; }
.ds-tipo-btn small[b-7o8128roo8] { font-size: 0.72rem; color: var(--rg-text-muted); line-height: 1.4; }

.ds-checkbox[b-7o8128roo8] { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: var(--rg-text-secondary); cursor: pointer; padding-top: 0.4rem; }
.ds-checkbox input[b-7o8128roo8] { accent-color: var(--rg-accent, #4f46e5); }

.ds-hint[b-7o8128roo8] { font-size: 0.72rem; color: var(--rg-text-muted); margin-top: 0.3rem; }
.ds-hint code[b-7o8128roo8] { background: var(--rg-bg-subtle); padding: 0.1rem 0.3rem; border-radius: 3px; font-size: 0.7rem; }

.ds-preview-bar[b-7o8128roo8] {
    display: flex; align-items: center; gap: 0.75rem;
    margin-top: 1rem; padding-top: 0.75rem;
    border-top: 1px dashed var(--rg-border);
}

.ds-preview-result[b-7o8128roo8] {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: var(--rg-bg-subtle);
    border-radius: 6px;
}
.ds-preview-meta[b-7o8128roo8] { font-size: 0.78rem; color: var(--rg-text-secondary); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.35rem; }
.ds-preview-error[b-7o8128roo8] { color: var(--rg-danger, #ef4444); font-size: 0.82rem; display: flex; align-items: center; gap: 0.4rem; padding: 0.5rem; }

/* ── Tabs dentro del modal ── */
.ds-tabs[b-7o8128roo8] {
    display: flex;
    gap: 0;
    background: var(--rg-bg-card);
    border-bottom: 2px solid var(--rg-border);
    padding: 0 1rem;
    overflow-x: auto;
    position: sticky;
    top: 0;
    z-index: 2;
}
.ds-tab[b-7o8128roo8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.7rem 1rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    color: var(--rg-text-muted);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
}
.ds-tab:hover[b-7o8128roo8] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.ds-tab.active[b-7o8128roo8] {
    color: var(--rg-accent, #4f46e5);
    border-bottom-color: var(--rg-accent, #4f46e5);
    font-weight: 600;
}
.ds-tab i[b-7o8128roo8] { font-size: 0.95rem; }
.ds-tab-body[b-7o8128roo8] { padding: 1.25rem; }

/* ── Tabla de columnas detectadas ── */
.ds-detected-table[b-7o8128roo8] { border: 1px solid var(--rg-border); border-radius: 6px; overflow: hidden; }
.ds-detected-table .crud-table[b-7o8128roo8] { margin: 0; }
.ds-detected-table .crud-table th[b-7o8128roo8] { background: var(--rg-bg-subtle); }

.ds-tipo-string[b-7o8128roo8] { background: rgba(59, 130, 246, 0.12); color: #1d4ed8; }
.ds-tipo-number[b-7o8128roo8] { background: rgba(16, 185, 129, 0.12); color: #047857; }
.ds-tipo-date[b-7o8128roo8]   { background: rgba(245, 158, 11, 0.12); color: #b45309; }
.ds-tipo-bool[b-7o8128roo8]   { background: rgba(139, 92, 246, 0.12); color: #6d28d9; }
[data-mode="dark"] .ds-tipo-string[b-7o8128roo8] { color: #93c5fd; }
[data-mode="dark"] .ds-tipo-number[b-7o8128roo8] { color: #6ee7b7; }
[data-mode="dark"] .ds-tipo-date[b-7o8128roo8]   { color: #fcd34d; }
[data-mode="dark"] .ds-tipo-bool[b-7o8128roo8]   { color: #c4b5fd; }

/* ── Preview empty state ── */
.ds-preview-empty[b-7o8128roo8] {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--rg-text-muted);
}
.ds-preview-empty p[b-7o8128roo8] { margin: 0.5rem 0 0; font-size: 0.8rem; }

.ds-preview-title[b-7o8128roo8] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0.75rem 0 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.ds-json-preview[b-7o8128roo8] {
    background: #0f172a;
    color: #e2e8f0;
    padding: 1rem;
    border-radius: 6px;
    font-family: 'Cascadia Code', 'Fira Code', ui-monospace, monospace;
    font-size: 0.78rem;
    line-height: 1.5;
    overflow-x: auto;
    max-height: 280px;
    overflow-y: auto;
    margin: 0;
}

[data-mode="dark"] .ds-json-preview[b-7o8128roo8] {
    background: #020617;
    border: 1px solid var(--rg-border);
}

@media (max-width: 640px) {
    .ds-form-grid[b-7o8128roo8], .ds-tipo-selector[b-7o8128roo8] { grid-template-columns: 1fr; }
    .ds-tab span[b-7o8128roo8] { display: none; }
}

/* ============================================================
   Selector IdOpción — picker inline + modal anidado con tarjetas
   ============================================================ */

.mo-picker[b-7o8128roo8] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.mo-picker-input[b-7o8128roo8] {
    flex: 1;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.45rem 0.65rem;
    cursor: pointer;
}

.mo-picker-input:hover[b-7o8128roo8] {
    border-color: var(--rg-primary);
}

/* Barra de búsqueda dentro del modal */
.mo-search[b-7o8128roo8] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 1rem;
}

.mo-search > i.bi-search[b-7o8128roo8] {
    color: var(--rg-text-muted);
}

.mo-search input[b-7o8128roo8] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    color: var(--rg-text-primary);
    font-size: 0.9rem;
}

.mo-search-clear[b-7o8128roo8] {
    background: transparent;
    border: none;
    color: var(--rg-text-muted);
    cursor: pointer;
    padding: 0 0.3rem;
    font-size: 1rem;
}

.mo-search-clear:hover[b-7o8128roo8] { color: var(--rg-text-primary); }

.mo-count[b-7o8128roo8] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    white-space: nowrap;
}

/* Grid de tarjetas */
.mo-grid[b-7o8128roo8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 0.75rem;
    max-height: calc(100vh - 320px);
    overflow-y: auto;
    padding: 0.25rem;
}

.mo-card[b-7o8128roo8] {
    position: relative;
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    padding: 0.75rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.mo-card:hover[b-7o8128roo8] {
    border-color: var(--rg-primary);
    box-shadow: 0 4px 12px rgba(26, 58, 92, 0.1);
    transform: translateY(-1px);
}

.mo-card.selected[b-7o8128roo8] {
    border-color: var(--rg-primary);
    background: rgba(26, 58, 92, 0.06);
    box-shadow: 0 0 0 2px var(--rg-primary);
}

[data-mode="dark"] .mo-card.selected[b-7o8128roo8] {
    background: rgba(59, 130, 246, 0.12);
}

.mo-card-icon[b-7o8128roo8],
.mo-card-avatar[b-7o8128roo8] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(26, 58, 92, 0.1);
    color: var(--rg-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    overflow: hidden;
    border: 1px solid var(--rg-border);
}

.mo-card-avatar img[b-7o8128roo8] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

[data-mode="dark"] .mo-card-icon[b-7o8128roo8],
[data-mode="dark"] .mo-card-avatar[b-7o8128roo8] {
    background: rgba(59, 130, 246, 0.15);
}

.mo-card-body[b-7o8128roo8] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.mo-card-title[b-7o8128roo8] {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--rg-text-primary);
    line-height: 1.25;
    word-break: break-word;
}

.mo-card-form[b-7o8128roo8] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.72rem;
    color: var(--rg-text-secondary);
    word-break: break-all;
}

.mo-card-app[b-7o8128roo8] {
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--rg-bg-subtle);
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    align-self: flex-start;
    margin-top: 0.2rem;
}

.mo-card-check[b-7o8128roo8] {
    position: absolute;
    top: 0.4rem;
    right: 0.4rem;
    color: var(--rg-primary);
    font-size: 1rem;
}
/* _content/Rgclouds.Web/Components/Pages/Sac/Sac_boardview.razor.rz.scp.css */
/* ============================================================
   📊 Sac_boardview — Dashboard configurable · dark-mode compliant
   ============================================================ */

/* Container + Header (reutiliza estilos crud-* pero con prefijo propio) */
.d2-container[b-ar77hnqz97] { padding: 1.25rem; animation: d2SlideUp-b-ar77hnqz97 0.3s ease-out; }
@keyframes d2SlideUp-b-ar77hnqz97 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

.d2-header[b-ar77hnqz97] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; flex-wrap: wrap; gap: 0.75rem; }
.d2-header-left[b-ar77hnqz97] { display: flex; align-items: center; gap: 0.75rem; }
.d2-header-icon[b-ar77hnqz97] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.d2-title[b-ar77hnqz97] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.d2-subtitle[b-ar77hnqz97] { font-size: 0.75rem; color: var(--rg-text-muted); }
.d2-header-actions[b-ar77hnqz97] { display: flex; gap: 0.5rem; }

/* Botones reutilizados */
.btn-crud[b-ar77hnqz97] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ar77hnqz97] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ar77hnqz97] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ar77hnqz97] { filter: brightness(1.1); }
.btn-outline[b-ar77hnqz97] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-ar77hnqz97] { background: var(--rg-bg-hover); }
.btn-danger[b-ar77hnqz97] { background: #ef4444; color: #fff; }
.btn-icon[b-ar77hnqz97] { display: inline-flex; align-items: center; justify-content: center; width: 1.85rem; height: 1.85rem; border: none; border-radius: 0.375rem; cursor: pointer; background: transparent; transition: background 0.15s; }
.btn-edit[b-ar77hnqz97] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ar77hnqz97] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ar77hnqz97] { color: #ef4444; }
.btn-delete:hover[b-ar77hnqz97] { background: rgba(239, 68, 68, 0.1); }

/* Alerts */
.crud-alert[b-ar77hnqz97] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ar77hnqz97] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ar77hnqz97] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ar77hnqz97] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-ar77hnqz97] { background: rgba(34,197,94,0.15); color: #86efac; border-color: rgba(34,197,94,0.3); }
[data-mode="dark"] .crud-alert.error[b-ar77hnqz97]   { background: rgba(220,38,38,0.15); color: #fca5a5; border-color: rgba(220,38,38,0.3); }

/* Empty / loading */
.crud-loading[b-ar77hnqz97], .crud-empty-state[b-ar77hnqz97] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.5rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-ar77hnqz97] { font-size: 2rem; }
.crud-spinner[b-ar77hnqz97] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: d2Spin-b-ar77hnqz97 0.6s linear infinite; }
.crud-spinner-sm[b-ar77hnqz97] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: d2Spin-b-ar77hnqz97 0.6s linear infinite; }
@keyframes d2Spin-b-ar77hnqz97 { to { transform: rotate(360deg); } }
.spin[b-ar77hnqz97] { animation: d2Spin-b-ar77hnqz97 0.8s linear infinite; }

/* ── Grid 12-col de widgets ── */
.d2-grid[b-ar77hnqz97] { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1rem; }
.size-3x1[b-ar77hnqz97] { grid-column: span 3; }
.size-4x1[b-ar77hnqz97] { grid-column: span 4; }
.size-6x1[b-ar77hnqz97] { grid-column: span 6; }
.size-6x2[b-ar77hnqz97] { grid-column: span 6; grid-row: span 2; }
.size-12x1[b-ar77hnqz97] { grid-column: span 12; }
.size-12x2[b-ar77hnqz97] { grid-column: span 12; grid-row: span 2; }

@media (max-width: 900px) {
    .size-3x1[b-ar77hnqz97], .size-4x1[b-ar77hnqz97], .size-6x1[b-ar77hnqz97] { grid-column: span 6; }
    .size-6x2[b-ar77hnqz97], .size-12x1[b-ar77hnqz97], .size-12x2[b-ar77hnqz97] { grid-column: span 12; }
}
@media (max-width: 640px) {
    .d2-grid[b-ar77hnqz97] { grid-template-columns: 1fr; }
    .size-3x1[b-ar77hnqz97], .size-4x1[b-ar77hnqz97], .size-6x1[b-ar77hnqz97], .size-6x2[b-ar77hnqz97], .size-12x1[b-ar77hnqz97], .size-12x2[b-ar77hnqz97] { grid-column: span 1; grid-row: auto; }
}

/* NOTA: Los estilos de widgets (.d2-card, .d2-kpi-*, .d2-bar-*, .d2-donut-*,
   .d2-line-*, .d2-gauge-*, .d2-mini-table) viven en wwwroot/css/dashboard2-widgets.css
   porque deben ser GLOBALES (no scoped). Los renders usan MarkupContent y el CSS
   scoped de Blazor no alcanza a los elementos inyectados. */

/* Acciones flotantes en card (esto sí puede estar scoped, está en el Razor directamente) */
.d2-card-actions[b-ar77hnqz97] {
    position: absolute;
    top: 0.4rem; right: 0.4rem;
    display: flex;
    gap: 0.15rem;
    opacity: 0;
    transition: opacity 0.15s;
    background: var(--rg-bg-card);
    border-radius: 0.4rem;
    padding: 0.15rem;
}
.d2-card:hover .d2-card-actions[b-ar77hnqz97] { opacity: 1; }

/* ── Modal reutilizado ── */
.modal-backdrop[b-ar77hnqz97] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; }
.modal-container[b-ar77hnqz97] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ar77hnqz97] { pointer-events: auto; background: var(--rg-bg-card); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
.modal-lg[b-ar77hnqz97] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 60px); max-height: calc(100vh - 60px); }
.modal-sm[b-ar77hnqz97] { max-width: 480px; }
.modal-header[b-ar77hnqz97] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-header h2[b-ar77hnqz97] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger h2[b-ar77hnqz97] { color: #dc2626; }
.modal-close[b-ar77hnqz97] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ar77hnqz97] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.modal-body[b-ar77hnqz97] { padding: 0; overflow-y: auto; flex: 1; background: var(--rg-bg-page); }
.modal-footer[b-ar77hnqz97] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border); flex-shrink: 0; }
.modal-backdrop-nested[b-ar77hnqz97] { z-index: 2000 !important; background: rgba(0,0,0,0.5) !important; }
.modal-container-nested[b-ar77hnqz97] { z-index: 2001 !important; }

.modal-sm .modal-body[b-ar77hnqz97] { padding: 1rem 1.25rem; }
.modal-sm .modal-body p[b-ar77hnqz97] { margin: 0.5rem 0; font-size: 0.85rem; color: var(--rg-text-primary); }

.font-mono[b-ar77hnqz97] { font-family: 'Cascadia Code', 'Fira Code', ui-monospace, monospace; }

/* ── Modal config: steps ── */
.d2-step[b-ar77hnqz97] { margin-bottom: 1.25rem; padding: 0.9rem 1rem; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.5rem; }
.d2-step-header[b-ar77hnqz97] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary); margin-bottom: 0.75rem; }
.d2-step-num[b-ar77hnqz97] { display: inline-flex; align-items: center; justify-content: center; width: 1.4rem; height: 1.4rem; background: var(--rg-accent, #4f46e5); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; }

.d2-select[b-ar77hnqz97], .d2-step input[b-ar77hnqz97], .d2-step select[b-ar77hnqz97], .d2-step textarea[b-ar77hnqz97] {
    width: 100%; padding: 0.45rem 0.6rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border); border-radius: 6px;
    font-size: 0.82rem;
}

.d2-type-grid[b-ar77hnqz97] { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 0.5rem; }
.d2-type-btn[b-ar77hnqz97] {
    display: flex; flex-direction: column; align-items: center; gap: 0.35rem;
    padding: 0.75rem 0.5rem;
    background: var(--rg-bg-card);
    border: 1.5px solid var(--rg-border);
    border-radius: 6px; cursor: pointer; transition: all 0.15s;
    color: var(--rg-text-secondary); font-size: 0.72rem; font-weight: 500;
}
.d2-type-btn i[b-ar77hnqz97] { font-size: 1.3rem; }
.d2-type-btn:hover[b-ar77hnqz97] { border-color: var(--rg-accent, #4f46e5); }
.d2-type-btn.selected[b-ar77hnqz97] { border-color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.08); color: var(--rg-accent, #4f46e5); font-weight: 600; }

.d2-field-grid[b-ar77hnqz97] { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.75rem; }
.d2-field[b-ar77hnqz97] { display: flex; flex-direction: column; gap: 0.3rem; }
.d2-field label[b-ar77hnqz97] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-secondary); }

.d2-color-row[b-ar77hnqz97] { display: flex; gap: 0.4rem; }
.d2-color-dot[b-ar77hnqz97] {
    width: 1.75rem; height: 1.75rem;
    border: 2px solid transparent;
    border-radius: 50%;
    cursor: pointer;
}
.d2-color-dot.selected[b-ar77hnqz97] { border-color: var(--rg-text-primary); box-shadow: 0 0 0 2px var(--rg-bg-card); }

.d2-hint[b-ar77hnqz97] { font-size: 0.75rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.35rem; margin-top: 0.5rem; }

/* ============================================================
   WIZARD LAYOUT (modal 2 columnas: config + preview)
   ============================================================ */
.d2-wizard-body[b-ar77hnqz97] { padding: 0 !important; overflow: hidden !important; }

.d2-wizard-layout[b-ar77hnqz97] {
    display: grid;
    grid-template-columns: 50% 50%;
    height: 100%;
    overflow: hidden;
}

.d2-wizard-left[b-ar77hnqz97] {
    overflow-y: auto;
    padding: 1rem;
    border-right: 1px solid var(--rg-border);
    background: var(--rg-bg-page);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.d2-wizard-right[b-ar77hnqz97] {
    overflow-y: auto;
    padding: 1rem;
    background: var(--rg-bg-page);
}

/* ── Paneles de la columna izquierda ── */
.d2-panel[b-ar77hnqz97] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.85rem 1rem;
}

.d2-panel-title[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin-bottom: 0.75rem;
}

.d2-step-num[b-ar77hnqz97] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.3rem; height: 1.3rem;
    background: var(--rg-accent, #4f46e5); color: #fff;
    border-radius: 50%;
    font-size: 0.68rem; font-weight: 700;
}

/* ── DataSources como tarjetas ── */
.d2-ds-cards[b-ar77hnqz97] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.5rem;
}

.d2-ds-card[b-ar77hnqz97] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.65rem;
    background: var(--rg-bg-card);
    border: 1.5px solid var(--rg-border);
    border-radius: 6px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s;
    position: relative;
}

.d2-ds-card:hover[b-ar77hnqz97] {
    border-color: var(--rg-accent, #4f46e5);
    background: rgba(79, 70, 229, 0.04);
}

.d2-ds-card.selected[b-ar77hnqz97] {
    border-color: var(--rg-accent, #4f46e5);
    background: rgba(79, 70, 229, 0.08);
    box-shadow: 0 0 0 1px var(--rg-accent, #4f46e5);
}

.d2-ds-card-icon[b-ar77hnqz97] {
    width: 2rem; height: 2rem;
    border-radius: 0.375rem;
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
}

.d2-ds-card-body[b-ar77hnqz97] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.d2-ds-card-name[b-ar77hnqz97] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.d2-ds-card-desc[b-ar77hnqz97] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.d2-ds-card-fields[b-ar77hnqz97] {
    font-size: 0.65rem;
    color: var(--rg-accent, #4f46e5);
    font-weight: 600;
    margin-top: 0.15rem;
}

.d2-ds-card-check[b-ar77hnqz97] {
    position: absolute;
    top: 0.4rem; right: 0.4rem;
    color: var(--rg-accent, #4f46e5);
    font-size: 0.9rem;
}

/* ── Tipo de visualización — fila horizontal ── */
.d2-type-row[b-ar77hnqz97] {
    display: flex;
    gap: 0.4rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
}

.d2-type-btn[b-ar77hnqz97] {
    display: flex; flex-direction: column; align-items: center; gap: 0.25rem;
    padding: 0.55rem 0.4rem;
    background: var(--rg-bg-card);
    border: 1.5px solid var(--rg-border);
    border-radius: 6px;
    cursor: pointer;
    min-width: 72px;
    flex-shrink: 0;
    transition: all 0.15s;
    color: var(--rg-text-secondary);
    font-size: 0.68rem;
    font-weight: 500;
}

.d2-type-btn i[b-ar77hnqz97] { font-size: 1.15rem; }
.d2-type-btn:hover[b-ar77hnqz97] { border-color: var(--rg-accent, #4f46e5); }
.d2-type-btn.selected[b-ar77hnqz97] {
    border-color: var(--rg-accent, #4f46e5);
    background: rgba(79, 70, 229, 0.08);
    color: var(--rg-accent, #4f46e5);
    font-weight: 600;
}

/* ── Filas label-input (Configuración + Apariencia) ── */
.d2-rows[b-ar77hnqz97] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.d2-row[b-ar77hnqz97] {
    display: grid;
    grid-template-columns: 130px 1fr;
    align-items: center;
    gap: 0.6rem;
}

.d2-row > label[b-ar77hnqz97] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-align: right;
}

.d2-row input[b-ar77hnqz97], .d2-row select[b-ar77hnqz97] {
    width: 100%;
    padding: 0.4rem 0.55rem;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    font-size: 0.8rem;
}

.d2-row input:focus[b-ar77hnqz97], .d2-row select:focus[b-ar77hnqz97] {
    outline: none;
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}

/* Multi-check (selección de series) */
.d2-row-multi[b-ar77hnqz97] {
    align-items: start;
}

.d2-hint[b-ar77hnqz97] {
    font-weight: 400;
    color: var(--rg-text-muted);
    font-size: 0.7rem;
}

.d2-multi-list[b-ar77hnqz97] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    max-height: 140px;
    overflow-y: auto;
    padding: 0.3rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
}

.d2-check-item[b-ar77hnqz97] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    font-size: 0.75rem;
    color: var(--rg-text-primary);
    cursor: pointer;
    user-select: none;
    transition: background 0.15s, border-color 0.15s;
}

.d2-check-item:hover[b-ar77hnqz97] {
    background: var(--rg-bg-hover);
}

.d2-check-item.active[b-ar77hnqz97] {
    background: rgba(79, 70, 229, 0.12);
    border-color: var(--rg-primary, #4f46e5);
}

.d2-check-item input[type="checkbox"][b-ar77hnqz97] {
    margin: 0;
    accent-color: var(--rg-primary, #4f46e5);
}

/* Leyenda multi-serie */
.d2-multi-legend[b-ar77hnqz97] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.85rem;
    padding: 0.3rem 0.5rem;
    font-size: 0.72rem;
    color: var(--rg-text-secondary);
}

.d2-multi-legend-item[b-ar77hnqz97] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.d2-multi-swatch[b-ar77hnqz97] {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    display: inline-block;
}

/* ─────────────────────────────────────
   Multi-Serie Bar (Tarjetas por grupo)
   ───────────────────────────────────── */
.d2-bar-multi-wrap[b-ar77hnqz97] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.5rem 0;
}

.d2-bar-section[b-ar77hnqz97] {
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    background: var(--rg-bg-card);
    padding: 0.75rem;
    overflow: hidden;
}

.d2-bar-section-title[b-ar77hnqz97] {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin-bottom: 0.55rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid var(--rg-border);
}

.d2-bar-card[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.4rem 0.5rem;
    margin: 0.2rem 0;
    background: var(--rg-bg-subtle);
    border-radius: 6px;
    font-size: 0.75rem;
}

.d2-bar-card-name[b-ar77hnqz97] {
    font-weight: 500;
    color: var(--rg-text-primary);
    min-width: 100px;
    white-space: nowrap;
}

.d2-bar-card-content[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex: 1;
}

.d2-bar-card-bar[b-ar77hnqz97] {
    flex: 1;
    min-width: 80px;
    height: 18px;
    background: var(--rg-bg-input);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid var(--rg-border);
    cursor: pointer;
}

.d2-bar-card-track[b-ar77hnqz97] {
    height: 100%;
    width: 100%;
    position: relative;
}

.d2-bar-card-fill[b-ar77hnqz97] {
    height: 100%;
    transition: width 0.3s ease;
}

.d2-bar-card-value[b-ar77hnqz97] {
    font-weight: 600;
    color: var(--rg-text-primary);
    text-align: right;
    min-width: 70px;
}

/* ─────────────────────────────────────
   Multi-Serie Line (Leyenda lateral)
   ───────────────────────────────────── */
.d2-line-multi-wrap[b-ar77hnqz97] {
    display: flex;
    gap: 1rem;
    align-items: stretch;
}

.d2-line-legend-cards[b-ar77hnqz97] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    min-width: 140px;
    max-width: 160px;
}

.d2-legend-card[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.6rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.72rem;
}

.d2-legend-card-color[b-ar77hnqz97] {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    flex-shrink: 0;
}

.d2-legend-card-info[b-ar77hnqz97] {
    flex: 1;
}

.d2-legend-card-name[b-ar77hnqz97] {
    font-weight: 600;
    color: var(--rg-text-primary);
    margin-bottom: 0.15rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.d2-legend-card-value[b-ar77hnqz97] {
    color: var(--rg-text-secondary);
    font-size: 0.65rem;
}

.d2-line-chart-container[b-ar77hnqz97] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 150px;
}

/* ─────────────────────────────────────
   Donut (Tarjetas de leyenda)
   ───────────────────────────────────── */
.d2-donut-legend-cards[b-ar77hnqz97] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.6rem;
    margin-top: 1rem;
}

.d2-donut-card[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.65rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    font-size: 0.72rem;
}

.d2-donut-card-color[b-ar77hnqz97] {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    flex-shrink: 0;
}

.d2-donut-card-info[b-ar77hnqz97] {
    flex: 1;
    min-width: 0;
}

.d2-donut-card-name[b-ar77hnqz97] {
    font-weight: 600;
    color: var(--rg-text-primary);
    margin-bottom: 0.1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.d2-donut-card-stats[b-ar77hnqz97] {
    color: var(--rg-text-secondary);
    font-size: 0.65rem;
}

.d2-donut-card-pct[b-ar77hnqz97] {
    color: var(--rg-text-muted);
}

/* ===== Campo multi-check tipo tarjetas (config panel) ===== */
.d2-field-block[b-ar77hnqz97] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem 0;
}
.d2-field-header[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.d2-field-label[b-ar77hnqz97] {
    font-weight: 600;
    color: var(--rg-text-primary);
    font-size: 0.8rem;
}
.d2-field-hint[b-ar77hnqz97] {
    color: var(--rg-text-muted);
    font-size: 0.7rem;
    font-style: italic;
}
.d2-field-badge[b-ar77hnqz97] {
    margin-left: auto;
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 600;
    border: 1px solid var(--rg-border);
}
.d2-check-grid[b-ar77hnqz97] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
    gap: 0.5rem;
}
.d2-check-card[b-ar77hnqz97] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.7rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
    overflow: hidden;
}
.d2-check-card:hover[b-ar77hnqz97] {
    background: var(--rg-bg-hover);
    border-color: var(--rg-primary);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}
.d2-check-card.active[b-ar77hnqz97] {
    background: var(--rg-bg-subtle);
    font-weight: 500;
}
.d2-check-input[b-ar77hnqz97] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
.d2-check-mark[b-ar77hnqz97] {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    border: 2px solid var(--rg-border);
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--rg-bg-input);
    flex-shrink: 0;
    font-size: 0.75rem;
    transition: all 0.15s;
}
.d2-check-card.active .d2-check-mark[b-ar77hnqz97] {
    background: var(--rg-primary);
    border-color: var(--rg-primary);
    color: #fff;
}
.d2-check-text[b-ar77hnqz97] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.d2-check-alias[b-ar77hnqz97] {
    font-weight: 600;
    color: var(--rg-text-primary);
    font-size: 0.76rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.d2-check-type[b-ar77hnqz97] {
    color: var(--rg-text-muted);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.d2-color-row[b-ar77hnqz97] {
    display: flex;
    gap: 0.4rem;
}

.d2-color-dot[b-ar77hnqz97] {
    width: 1.75rem; height: 1.75rem;
    border: 2px solid transparent;
    border-radius: 50%;
    cursor: pointer;
}
.d2-color-dot.selected[b-ar77hnqz97] { border-color: var(--rg-text-primary); box-shadow: 0 0 0 2px var(--rg-bg-card); }

.d2-hint[b-ar77hnqz97] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0;
}

/* ── Panel de preview (columna derecha) ── */
.d2-preview-panel[b-ar77hnqz97] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.d2-preview-header[b-ar77hnqz97] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}

.d2-preview-content[b-ar77hnqz97] {
    flex: 1;
    padding: 1rem;
    overflow-y: auto;
}

.d2-preview-empty[b-ar77hnqz97] {
    text-align: center;
    color: var(--rg-text-muted);
    padding: 3rem 1rem;
}

.d2-preview-empty p[b-ar77hnqz97] {
    font-size: 0.82rem;
    margin: 0.5rem 0 0;
}

.d2-preview-card[b-ar77hnqz97] {
    width: 100%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.d2-preview-error[b-ar77hnqz97] {
    color: #dc2626;
    font-size: 0.82rem;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .d2-wizard-layout[b-ar77hnqz97] { grid-template-columns: 1fr; }
    .d2-wizard-left[b-ar77hnqz97] { border-right: none; border-bottom: 1px solid var(--rg-border); max-height: 55vh; }
}

@media (max-width: 500px) {
    .d2-row[b-ar77hnqz97] { grid-template-columns: 90px 1fr; }
    .d2-row > label[b-ar77hnqz97] { font-size: 0.7rem; }
}

/* ── Animaciones ── */
@keyframes d2FadeIn-b-ar77hnqz97     { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes d2CountUp-b-ar77hnqz97    { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } }
@keyframes d2FillBar-b-ar77hnqz97    { from { width: 0; } }
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmeditorreporte.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-vo0t3dmh0l] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-vo0t3dmh0l 0.3s ease-out; }
@keyframes slideUp-b-vo0t3dmh0l { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-vo0t3dmh0l] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-vo0t3dmh0l] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-vo0t3dmh0l] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-vo0t3dmh0l] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-vo0t3dmh0l] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-vo0t3dmh0l] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-vo0t3dmh0l] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-vo0t3dmh0l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-vo0t3dmh0l] { filter: brightness(1.1); }
.btn-outline[b-vo0t3dmh0l] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-vo0t3dmh0l] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-vo0t3dmh0l] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-vo0t3dmh0l] { filter: brightness(1.1); }
.btn-icon[b-vo0t3dmh0l] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-vo0t3dmh0l] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-vo0t3dmh0l] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-vo0t3dmh0l] { color: #ef4444; }
.btn-delete:hover[b-vo0t3dmh0l] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-vo0t3dmh0l] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-vo0t3dmh0l] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-vo0t3dmh0l] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-vo0t3dmh0l] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-vo0t3dmh0l] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-vo0t3dmh0l] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-vo0t3dmh0l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-vo0t3dmh0l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-vo0t3dmh0l] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-vo0t3dmh0l] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-vo0t3dmh0l] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-vo0t3dmh0l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-vo0t3dmh0l] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-vo0t3dmh0l] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-vo0t3dmh0l] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-vo0t3dmh0l] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-vo0t3dmh0l] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-vo0t3dmh0l] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-vo0t3dmh0l] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-vo0t3dmh0l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-vo0t3dmh0l] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-vo0t3dmh0l] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-vo0t3dmh0l] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-vo0t3dmh0l] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-vo0t3dmh0l] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-vo0t3dmh0l] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-vo0t3dmh0l] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-vo0t3dmh0l] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-vo0t3dmh0l] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-vo0t3dmh0l] { display: block; }
.hide-on-cards[b-vo0t3dmh0l] { display: none !important; }
.show-on-cards[b-vo0t3dmh0l] { display: grid; }
.hide-on-grid[b-vo0t3dmh0l] { display: none !important; }

/* Badges */
.badge[b-vo0t3dmh0l] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-vo0t3dmh0l] { background: #ecfdf5; color: #065f46; }
.badge-no[b-vo0t3dmh0l] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-vo0t3dmh0l] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-vo0t3dmh0l] { text-align: center; }
.text-muted[b-vo0t3dmh0l] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-vo0t3dmh0l], .crud-empty-state[b-vo0t3dmh0l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-vo0t3dmh0l] { font-size: 2rem; }
.crud-spinner[b-vo0t3dmh0l] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-vo0t3dmh0l 0.6s linear infinite; }
.crud-spinner-sm[b-vo0t3dmh0l] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-vo0t3dmh0l 0.6s linear infinite; }
@keyframes spin-b-vo0t3dmh0l { to { transform: rotate(360deg); } }
.spin[b-vo0t3dmh0l] { animation: spin-b-vo0t3dmh0l 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-vo0t3dmh0l] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-vo0t3dmh0l 0.15s ease-out; }
.modal-container[b-vo0t3dmh0l] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-vo0t3dmh0l] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-vo0t3dmh0l 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-vo0t3dmh0l] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-vo0t3dmh0l] { max-width: 420px; }
@keyframes fadeIn-b-vo0t3dmh0l { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-vo0t3dmh0l { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-vo0t3dmh0l] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-vo0t3dmh0l] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-vo0t3dmh0l] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-vo0t3dmh0l] { color: #dc2626; }
.modal-close[b-vo0t3dmh0l] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-vo0t3dmh0l] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-vo0t3dmh0l] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-vo0t3dmh0l] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-vo0t3dmh0l] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-vo0t3dmh0l] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-vo0t3dmh0l] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-vo0t3dmh0l] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-vo0t3dmh0l] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-vo0t3dmh0l] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-vo0t3dmh0l] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-vo0t3dmh0l] { flex: 2; }
.form-group label[b-vo0t3dmh0l] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-vo0t3dmh0l], .form-group select[b-vo0t3dmh0l], .form-textarea[b-vo0t3dmh0l] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-vo0t3dmh0l], .form-group select:focus[b-vo0t3dmh0l], .form-textarea:focus[b-vo0t3dmh0l] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-vo0t3dmh0l] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-vo0t3dmh0l] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-vo0t3dmh0l] { flex: 1; display: flex; align-items: center; }
.form-check[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-vo0t3dmh0l] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-vo0t3dmh0l] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-vo0t3dmh0l] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-vo0t3dmh0l] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-vo0t3dmh0l] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-vo0t3dmh0l] { font-size: 3rem; }
.photo-placeholder span[b-vo0t3dmh0l] { font-size: 0.78rem; }
.photo-actions[b-vo0t3dmh0l] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-vo0t3dmh0l] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-vo0t3dmh0l] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-vo0t3dmh0l] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-vo0t3dmh0l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-vo0t3dmh0l] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-vo0t3dmh0l] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-vo0t3dmh0l] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-vo0t3dmh0l] { filter: brightness(1.15); transform: scale(1.05); }
[b-vo0t3dmh0l] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-vo0t3dmh0l] { padding: 0.75rem; }
    .crud-header[b-vo0t3dmh0l] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-vo0t3dmh0l] { font-size: 1.1rem; }
    .btn-text[b-vo0t3dmh0l] { display: none; }
    .form-row[b-vo0t3dmh0l] { flex-direction: column; }
    .form-row-4[b-vo0t3dmh0l] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-vo0t3dmh0l] { width: 98%; max-height: 95vh; }
    .modal-lg[b-vo0t3dmh0l] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-vo0t3dmh0l] { padding: 0.75rem; }
    .modal-tabs[b-vo0t3dmh0l] { overflow-x: auto; }
    .modal-tab[b-vo0t3dmh0l] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-vo0t3dmh0l] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-vo0t3dmh0l] { display: grid !important; }
    .crud-cards-wrapper[b-vo0t3dmh0l] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-vo0t3dmh0l] { grid-template-columns: 1fr; }
    .card-details[b-vo0t3dmh0l] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-vo0t3dmh0l] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-vo0t3dmh0l] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-vo0t3dmh0l] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-vo0t3dmh0l] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmingresoformulario.razor.rz.scp.css */
/* ============================================================
   Frmingresoformulario — Ingreso de Opciones de Menú
   Estilos CRUD con soporte tema claro / oscuro
   ============================================================ */

.crud-container[b-k3mzhniya6] {
    padding: 1.25rem;
    max-width: 100%;
    animation: slideUp-b-k3mzhniya6 0.3s ease-out;
}
@keyframes slideUp-b-k3mzhniya6 {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ──────────────────────────────────────────────── */
.crud-header[b-k3mzhniya6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.crud-header-left[b-k3mzhniya6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.crud-header-icon[b-k3mzhniya6] {
    font-size: 1.75rem;
    color: var(--rg-accent);
}
.crud-title[b-k3mzhniya6] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0;
}
.crud-subtitle[b-k3mzhniya6] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-header-actions[b-k3mzhniya6] {
    display: flex;
    gap: 0.5rem;
}

/* ── Botones ─────────────────────────────────────────────── */
.btn-crud[b-k3mzhniya6] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-crud:disabled[b-k3mzhniya6] { opacity: 0.6; cursor: not-allowed; }

.btn-primary[b-k3mzhniya6] { background: var(--rg-primary); color: #fff; }
.btn-primary:hover:not(:disabled)[b-k3mzhniya6] { filter: brightness(1.1); }

.btn-outline[b-k3mzhniya6] {
    background: transparent;
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
}
.btn-outline:hover:not(:disabled)[b-k3mzhniya6] { background: var(--rg-bg-hover); }

.btn-danger[b-k3mzhniya6] { background: var(--rg-danger); color: #fff; }
.btn-danger:hover:not(:disabled)[b-k3mzhniya6] { filter: brightness(1.1); }

.btn-icon[b-k3mzhniya6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s;
    background: transparent;
}
.btn-edit[b-k3mzhniya6]  { color: var(--rg-accent); }
.btn-edit:hover[b-k3mzhniya6]  { background: rgba(79,70,229,0.1); }
.btn-delete[b-k3mzhniya6] { color: var(--rg-danger); }
.btn-delete:hover[b-k3mzhniya6] { background: rgba(239,68,68,0.1); }

/* ── Alerta ──────────────────────────────────────────────── */
.crud-alert[b-k3mzhniya6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
}
.crud-alert.success[b-k3mzhniya6] {
    background: rgba(22,163,74,0.1);
    color: var(--rg-success);
    border: 1px solid rgba(22,163,74,0.3);
}
.crud-alert.error[b-k3mzhniya6] {
    background: rgba(220,38,38,0.1);
    color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,0.3);
}
[data-mode="dark"] .crud-alert.success[b-k3mzhniya6] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-k3mzhniya6]   { color: #fca5a5; }

.crud-alert-close[b-k3mzhniya6] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
}

/* ── Alerta duplicado (dentro del modal) ─────────────────── */
.alert-dup[b-k3mzhniya6] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    border-radius: 0.5rem;
    background: rgba(234,179,8,0.1);
    border: 1px solid rgba(234,179,8,0.3);
    color: var(--rg-warning);
    font-size: 0.78rem;
    margin-bottom: 0.5rem;
}
[data-mode="dark"] .alert-dup[b-k3mzhniya6] { color: #fde047; }
.alert-dup i[b-k3mzhniya6] { flex-shrink: 0; margin-top: 0.1rem; }

/* ── Búsqueda ────────────────────────────────────────────── */
.crud-search-bar[b-k3mzhniya6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.625rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    background: var(--rg-bg-card);
}
.crud-search-btn[b-k3mzhniya6] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
    padding: 0.2rem;
}
.crud-search-bar input[b-k3mzhniya6] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.8rem;
    background: transparent;
    color: var(--rg-text-primary);
}
.crud-search-bar input[b-k3mzhniya6]::placeholder { color: var(--rg-text-muted); }
.crud-search-clear[b-k3mzhniya6] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
}
.crud-count[b-k3mzhniya6] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    white-space: nowrap;
}

/* ── Grid ────────────────────────────────────────────────── */
.crud-grid-wrapper[b-k3mzhniya6] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card);
    max-height: calc(100vh - 290px);
}
.crud-table[b-k3mzhniya6] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}
.crud-table thead[b-k3mzhniya6] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-k3mzhniya6] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.crud-table td[b-k3mzhniya6] {
    padding: 0.45rem 0.75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}
.crud-table tbody tr[b-k3mzhniya6] { transition: background 0.1s; }
.crud-table tbody tr:hover[b-k3mzhniya6] { background: var(--rg-bg-hover); }
.col-actions[b-k3mzhniya6] { width: 80px; text-align: center; white-space: nowrap; }
.font-mono[b-k3mzhniya6] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: 0.76rem; }
.text-center[b-k3mzhniya6] { text-align: center; }
.text-muted[b-k3mzhniya6]  { color: var(--rg-text-muted); }

/* ── Loading / Empty ─────────────────────────────────────── */
.crud-loading[b-k3mzhniya6], .crud-empty-state[b-k3mzhniya6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted);
}
.crud-empty-state i[b-k3mzhniya6] { font-size: 2rem; }
.crud-spinner[b-k3mzhniya6] {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-accent);
    border-radius: 50%;
    animation: spin-b-k3mzhniya6 0.6s linear infinite;
}
.crud-spinner-sm[b-k3mzhniya6] {
    display: inline-block;
    width: 0.9rem;
    height: 0.9rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-k3mzhniya6 0.6s linear infinite;
}
@keyframes spin-b-k3mzhniya6 { to { transform: rotate(360deg); } }
.spin[b-k3mzhniya6] { animation: spin-b-k3mzhniya6 0.8s linear infinite; display: inline-block; }

/* ── Badges ──────────────────────────────────────────────── */
.badge[b-k3mzhniya6] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 600;
    white-space: nowrap;
}
.badge-yes[b-k3mzhniya6] { background: rgba(22,163,74,0.12); color: #166534; border: 1px solid rgba(22,163,74,0.25); }
.badge-no[b-k3mzhniya6]  { background: var(--rg-bg-subtle); color: var(--rg-text-muted); border: 1px solid var(--rg-border); }
[data-mode="dark"] .badge-yes[b-k3mzhniya6] { color: #86efac; }

/* ── Modales ─────────────────────────────────────────────── */
.modal-backdrop[b-k3mzhniya6] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(3px);
    z-index: 1000;
    animation: fadeIn-b-k3mzhniya6 0.15s ease-out;
}
.modal-container[b-k3mzhniya6] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}
.modal-dialog[b-k3mzhniya6] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 560px;
    max-height: 88vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    animation: scaleIn-b-k3mzhniya6 0.2s ease-out;
    display: flex;
    flex-direction: column;
}
.modal-sm[b-k3mzhniya6] { max-width: 400px; }

@keyframes fadeIn-b-k3mzhniya6 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-k3mzhniya6 {
    from { opacity: 0; transform: scale(0.95); }
    to   { opacity: 1; transform: scale(1); }
}

.modal-header[b-k3mzhniya6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.modal-header h2[b-k3mzhniya6] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-header-danger[b-k3mzhniya6] { border-bottom-color: rgba(220,38,38,0.3); }
.modal-header-danger h2[b-k3mzhniya6] { color: var(--rg-danger); }
.modal-close[b-k3mzhniya6] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 0.95rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
    line-height: 1;
}
.modal-close:hover[b-k3mzhniya6] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }

.modal-body[b-k3mzhniya6]   { padding: 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-k3mzhniya6] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
}

/* ── Formulario ──────────────────────────────────────────── */
.form-row[b-k3mzhniya6] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.form-group[b-k3mzhniya6] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.form-group.flex-2[b-k3mzhniya6] { flex: 2; }
.form-group label[b-k3mzhniya6] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.form-group input[b-k3mzhniya6],
.form-group select[b-k3mzhniya6] {
    padding: 0.475rem 0.625rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    transition: border-color 0.15s;
}
.form-group input:focus[b-k3mzhniya6],
.form-group select:focus[b-k3mzhniya6] {
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.15);
}
.form-group input:disabled[b-k3mzhniya6],
.form-group select:disabled[b-k3mzhniya6] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    cursor: not-allowed;
}

/* ── Radio tipo menú ─────────────────────────────────────── */
.radio-group[b-k3mzhniya6] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}
.radio-option[b-k3mzhniya6] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--rg-text-primary);
    padding: 0.35rem 0.75rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    transition: all 0.15s;
    background: var(--rg-bg-card);
    user-select: none;
}
.radio-option:hover[b-k3mzhniya6] { border-color: var(--rg-primary); background: var(--rg-bg-hover); }
.radio-option.selected[b-k3mzhniya6] {
    border-color: var(--rg-primary);
    background: rgba(26,58,92,0.08);
    color: var(--rg-primary);
    font-weight: 600;
}
[data-mode="dark"] .radio-option.selected[b-k3mzhniya6] { background: rgba(26,58,92,0.3); }
.radio-option input[type="radio"][b-k3mzhniya6] { accent-color: var(--rg-primary); }

/* ── Checkbox inactivo ───────────────────────────────────── */
.check-group[b-k3mzhniya6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary);
    cursor: pointer;
    padding: 0.35rem 0;
}
.check-group input[type="checkbox"][b-k3mzhniya6] { accent-color: var(--rg-primary); width: 1rem; height: 1rem; }

/* ── Modal Deploy (ancho extra para la tabla) ────────────── */
.deploy-dialog[b-k3mzhniya6] {
    max-width: 700px;
}

/* ── Resumen estadísticas ────────────────────────────────── */
.deploy-summary[b-k3mzhniya6] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.deploy-stat[b-k3mzhniya6] {
    flex: 1;
    min-width: 80px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    gap: 0.15rem;
}
.deploy-stat-num[b-k3mzhniya6] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    font-family: 'Cascadia Code','Fira Code',monospace;
}
.deploy-stat-lbl[b-k3mzhniya6] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.stat-total[b-k3mzhniya6] { }
.stat-ok[b-k3mzhniya6]    { background: rgba(22,163,74,0.08);  border-color: rgba(22,163,74,0.25); }
.stat-ok    .deploy-stat-num[b-k3mzhniya6] { color: #166534; }
.stat-skip[b-k3mzhniya6]  { background: rgba(37,99,235,0.08);  border-color: rgba(37,99,235,0.25); }
.stat-skip  .deploy-stat-num[b-k3mzhniya6] { color: var(--rg-accent); }
.stat-nosp[b-k3mzhniya6]  { background: rgba(234,179,8,0.08);  border-color: rgba(234,179,8,0.25); }
.stat-nosp  .deploy-stat-num[b-k3mzhniya6] { color: var(--rg-warning); }
.stat-err[b-k3mzhniya6]   { background: rgba(220,38,38,0.08);  border-color: rgba(220,38,38,0.25); }
.stat-err   .deploy-stat-num[b-k3mzhniya6] { color: var(--rg-danger); }

[data-mode="dark"] .stat-ok   .deploy-stat-num[b-k3mzhniya6] { color: #86efac; }
[data-mode="dark"] .stat-skip .deploy-stat-num[b-k3mzhniya6] { color: #93c5fd; }
[data-mode="dark"] .stat-nosp .deploy-stat-num[b-k3mzhniya6] { color: #fde047; }
[data-mode="dark"] .stat-err  .deploy-stat-num[b-k3mzhniya6] { color: #fca5a5; }

/* ── Tabla detalle por BD ────────────────────────────────── */
.deploy-table-wrap[b-k3mzhniya6] {
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: auto;
    max-height: 380px;
}

/* ── Badges de estado deploy ─────────────────────────────── */
.badge-inserted[b-k3mzhniya6] {
    background: rgba(22,163,74,0.12);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.25);
}
.badge-skip[b-k3mzhniya6] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent);
    border: 1px solid rgba(37,99,235,0.2);
}
.badge-nosp[b-k3mzhniya6] {
    background: rgba(234,179,8,0.1);
    color: var(--rg-warning);
    border: 1px solid rgba(234,179,8,0.3);
}
.badge-err[b-k3mzhniya6] {
    background: rgba(220,38,38,0.1);
    color: var(--rg-danger);
    border: 1px solid rgba(220,38,38,0.3);
}
[data-mode="dark"] .badge-inserted[b-k3mzhniya6] { color: #86efac; }
[data-mode="dark"] .badge-skip[b-k3mzhniya6]     { color: #93c5fd; }
[data-mode="dark"] .badge-nosp[b-k3mzhniya6]     { color: #fde047; }
[data-mode="dark"] .badge-err[b-k3mzhniya6]      { color: #fca5a5; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-k3mzhniya6] { padding: 0.75rem; }
    .crud-header[b-k3mzhniya6] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-k3mzhniya6]  { font-size: 1.1rem; }
    .btn-text[b-k3mzhniya6]    { display: none; }
    .form-row[b-k3mzhniya6]    { flex-direction: column; }
    .modal-dialog[b-k3mzhniya6] { width: 98%; }
    .modal-body[b-k3mzhniya6]   { padding: 1rem; }
    .radio-group[b-k3mzhniya6]  { gap: 0.5rem; }
    .deploy-summary[b-k3mzhniya6] { gap: 0.5rem; }
    .deploy-stat[b-k3mzhniya6] { min-width: 60px; padding: 0.5rem 0.25rem; }
    .deploy-stat-num[b-k3mzhniya6] { font-size: 1.15rem; }
}
/* _content/Rgclouds.Web/Components/Pages/Seguridad/FrmNotificacionConfig.razor.rz.scp.css */
/* ============================================================
   FrmNotificacionConfig — Configuración Email + WhatsApp
   Auto-contenido (CSS isolation Blazor) · Dark mode ready
   ============================================================ */

.crud-container[b-1hahlzsalc] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-1hahlzsalc 0.3s ease-out; }
@keyframes slideUp-b-1hahlzsalc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-1hahlzsalc] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-1hahlzsalc] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-1hahlzsalc] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-1hahlzsalc] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-1hahlzsalc] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-1hahlzsalc] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-1hahlzsalc] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-1hahlzsalc] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.btn-sm[b-1hahlzsalc] { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-primary[b-1hahlzsalc] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-1hahlzsalc] { filter: brightness(1.1); }
.btn-outline[b-1hahlzsalc] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-1hahlzsalc] { background: var(--rg-bg-hover, #f1f5f9); }

/* Alert */
.crud-alert[b-1hahlzsalc] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-1hahlzsalc] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-1hahlzsalc]   { background: rgba(239,68,68,0.1);  color: #991b1b; border: 1px solid rgba(239,68,68,0.25); }
.crud-alert-close[b-1hahlzsalc] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

[data-mode="dark"] .crud-alert.success[b-1hahlzsalc] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-1hahlzsalc]   { color: #fca5a5; }

/* Spinners */
.crud-spinner-sm[b-1hahlzsalc] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-1hahlzsalc 0.6s linear infinite; }
@keyframes spin-b-1hahlzsalc { to { transform: rotate(360deg); } }
.spin[b-1hahlzsalc] { animation: spin-b-1hahlzsalc 0.8s linear infinite; }

/* ── Tabs ────────────────────────────────────────────────── */
.notif-tabs[b-1hahlzsalc] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    margin-bottom: 1.25rem;
}

.notif-tab[b-1hahlzsalc] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: none;
    border: none;
    padding: 0.65rem 1.25rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.15s;
}

.notif-tab:hover[b-1hahlzsalc] { color: var(--rg-text-primary, #1e293b); }
.notif-tab.active[b-1hahlzsalc] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

.tab-badge[b-1hahlzsalc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    margin-left: 0.2rem;
}
.tab-badge.badge-ok[b-1hahlzsalc]   { color: #16a34a; }
.tab-badge.badge-warn[b-1hahlzsalc] { color: #d97706; }

/* ── Card principal ──────────────────────────────────────── */
.notif-card[b-1hahlzsalc] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 10px;
    overflow: hidden;
}

.notif-card-header[b-1hahlzsalc] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
}

.notif-card-header > .bi[b-1hahlzsalc] {
    font-size: 1.75rem;
    color: var(--rg-accent, #4f46e5);
    flex-shrink: 0;
}

.notif-card-header > div[b-1hahlzsalc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.notif-card-title[b-1hahlzsalc] {
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--rg-text-primary, #1e293b);
}

.notif-card-sub[b-1hahlzsalc] {
    font-size: 0.72rem;
    color: var(--rg-text-muted, #94a3b8);
}

/* ── Status badges ───────────────────────────────────────── */
.status-badge[b-1hahlzsalc] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
}

.status-ok[b-1hahlzsalc]   { background: rgba(34,197,94,0.12);  color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.status-warn[b-1hahlzsalc] { background: rgba(234,179,8,0.15);  color: #854d0e; border: 1px solid rgba(234,179,8,0.3); }
.status-err[b-1hahlzsalc]  { background: rgba(239,68,68,0.1);   color: #991b1b; border: 1px solid rgba(239,68,68,0.25); }

[data-mode="dark"] .status-ok[b-1hahlzsalc]   { color: #86efac; }
[data-mode="dark"] .status-warn[b-1hahlzsalc] { color: #fde68a; }
[data-mode="dark"] .status-err[b-1hahlzsalc]  { color: #fca5a5; }

/* ── Form ────────────────────────────────────────────────── */
.notif-form[b-1hahlzsalc] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.form-row[b-1hahlzsalc] { display: flex; gap: 0.6rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.form-group[b-1hahlzsalc] { flex: 1; display: flex; flex-direction: column; gap: 0.2rem; min-width: 140px; }
.form-group.flex-2[b-1hahlzsalc] { flex: 2; }
.form-group label[b-1hahlzsalc] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }

.form-group input[b-1hahlzsalc], .form-group select[b-1hahlzsalc] {
    padding: 0.42rem 0.6rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-input, #fff);
    outline: none;
    transition: border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.form-group input:focus[b-1hahlzsalc], .form-group select:focus[b-1hahlzsalc] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79,70,229,0.12);
}

.form-check-group[b-1hahlzsalc] { flex: 1; display: flex; align-items: flex-end; padding-bottom: 0.4rem; }
.form-check[b-1hahlzsalc] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-1hahlzsalc] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Input con ícono toggle */
.input-with-icon[b-1hahlzsalc] {
    position: relative;
    display: flex;
    align-items: center;
}

.input-with-icon input[b-1hahlzsalc] { padding-right: 2.2rem; }

.input-toggle[b-1hahlzsalc] {
    position: absolute;
    right: 0.4rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.9rem;
    padding: 0;
    line-height: 1;
}

.input-toggle:hover[b-1hahlzsalc] { color: var(--rg-text-primary, #1e293b); }

/* Hint informativo */
.notif-hint[b-1hahlzsalc] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    background: rgba(79,70,229,0.07);
    border: 1px solid rgba(79,70,229,0.15);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-size: 0.72rem;
    color: var(--rg-text-secondary, #475569);
    margin-bottom: 0.75rem;
}

.notif-hint .bi[b-1hahlzsalc] { color: var(--rg-accent, #4f46e5); flex-shrink: 0; margin-top: 0.05rem; }

/* Sección de prueba */
.test-section[b-1hahlzsalc] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-radius: 8px;
    border: 1px solid var(--rg-border, #e2e8f0);
}

/* Card footer */
.notif-card-footer[b-1hahlzsalc] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
}

/* ── WhatsApp específico ──────────────────────────────────── */
.wa-status-row[b-1hahlzsalc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.75rem;
}

.wa-ok[b-1hahlzsalc]  { background: rgba(34,197,94,0.1);  color: #166534; }
.wa-err[b-1hahlzsalc] { background: rgba(239,68,68,0.08); color: #991b1b; }

[data-mode="dark"] .wa-ok[b-1hahlzsalc]  { color: #86efac; }
[data-mode="dark"] .wa-err[b-1hahlzsalc] { color: #fca5a5; }

.wa-qr-section[b-1hahlzsalc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 8px;
    margin-bottom: 0.75rem;
}

.wa-qr-img[b-1hahlzsalc] {
    width: 220px;
    height: 220px;
    border: 4px solid var(--rg-border, #e2e8f0);
    border-radius: 8px;
    background: #fff;
}

.text-muted[b-1hahlzsalc] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 700px) {
    .notif-tab[b-1hahlzsalc] { padding: 0.5rem 0.75rem; font-size: 0.75rem; }
    .notif-card-header[b-1hahlzsalc] { flex-wrap: wrap; }
    .test-section[b-1hahlzsalc] { flex-direction: column; align-items: stretch; }
    .wa-status-row[b-1hahlzsalc] { flex-wrap: wrap; }
}
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmregistraaplicaciones.razor.rz.scp.css */
/* ============================================================
   Registro de Aplicaciones — Estilos CRUD + Cards + Responsive
   ============================================================ */

.crud-container[b-gxxjrqcdqv] {
    padding: 1.25rem;
    max-width: 100%;
    animation: slideUp-b-gxxjrqcdqv 0.3s ease-out;
}

@keyframes slideUp-b-gxxjrqcdqv {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Header */
.crud-header[b-gxxjrqcdqv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.crud-header-left[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.crud-header-icon[b-gxxjrqcdqv] {
    font-size: 1.75rem;
    color: var(--rg-accent, #4f46e5);
}
.crud-title[b-gxxjrqcdqv] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0;
}
.crud-subtitle[b-gxxjrqcdqv] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}
.crud-header-actions[b-gxxjrqcdqv] {
    display: flex;
    gap: 0.5rem;
}

/* Buttons */
.btn-crud[b-gxxjrqcdqv] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-crud:disabled[b-gxxjrqcdqv] { opacity: 0.6; cursor: not-allowed; }

.btn-primary[b-gxxjrqcdqv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-gxxjrqcdqv] { filter: brightness(1.1); }

.btn-outline[b-gxxjrqcdqv] {
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}
.btn-outline:hover:not(:disabled)[b-gxxjrqcdqv] { background: var(--rg-bg-hover, #f1f5f9); }

.btn-danger[b-gxxjrqcdqv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-gxxjrqcdqv] { filter: brightness(1.1); }

.btn-icon[b-gxxjrqcdqv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s;
    background: transparent;
}
.btn-edit[b-gxxjrqcdqv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-gxxjrqcdqv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-gxxjrqcdqv] { color: #ef4444; }
.btn-delete:hover[b-gxxjrqcdqv] { background: rgba(239, 68, 68, 0.1); }

.view-toggle[b-gxxjrqcdqv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
}
.crud-alert.success[b-gxxjrqcdqv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-gxxjrqcdqv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-gxxjrqcdqv] {
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
}

/* Search */
.crud-search-bar[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    background: var(--rg-bg-card, #fff);
}
.crud-search-bar i[b-gxxjrqcdqv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-gxxjrqcdqv] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.8rem;
    background: transparent;
    color: var(--rg-text-primary, #1e293b);
}
.crud-search-clear[b-gxxjrqcdqv] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
}
.crud-count[b-gxxjrqcdqv] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    white-space: nowrap;
}

/* ---- Grid (tabla) ---- */
.crud-grid-wrapper[b-gxxjrqcdqv] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    overflow: auto;
    background: var(--rg-bg-card, #fff);
    max-height: calc(100vh - 320px);
}

.crud-table[b-gxxjrqcdqv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}
.crud-table thead[b-gxxjrqcdqv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-gxxjrqcdqv] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600;
    text-align: left;
    padding: 0.625rem 0.75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    white-space: nowrap;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.crud-table td[b-gxxjrqcdqv] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
    vertical-align: middle;
}
.crud-table tbody tr[b-gxxjrqcdqv] { cursor: pointer; transition: background 0.1s; }
.crud-table tbody tr:hover[b-gxxjrqcdqv] { background: var(--rg-bg-hover, #f8fafc); }

.row-selected[b-gxxjrqcdqv] {
    background: rgba(79, 70, 229, 0.06) !important;
    border-left: 3px solid var(--rg-accent, #4f46e5);
}

.col-id[b-gxxjrqcdqv] { width: 50px; text-align: center; }
.col-appid[b-gxxjrqcdqv] { width: 120px; }
.col-desc[b-gxxjrqcdqv] { min-width: 200px; }
.col-aux[b-gxxjrqcdqv] { width: 80px; text-align: center; }
.col-exe[b-gxxjrqcdqv] { min-width: 150px; }
.col-img[b-gxxjrqcdqv] { width: 120px; text-align: center; }
.col-actions[b-gxxjrqcdqv] { width: 80px; text-align: center; white-space: nowrap; }

/* ---- Cards (tarjetas) ---- */
.crud-cards-wrapper[b-gxxjrqcdqv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 0.75rem;
    max-height: calc(100vh - 320px);
    overflow-y: auto;
    padding: 0.25rem;
}

.crud-card[b-gxxjrqcdqv] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.875rem;
    transition: all 0.15s;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    cursor: pointer;
}
.crud-card:hover[b-gxxjrqcdqv] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.card-selected[b-gxxjrqcdqv] {
    border-color: var(--rg-accent, #4f46e5);
    background: rgba(79, 70, 229, 0.04);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.12);
}

.card-header-row[b-gxxjrqcdqv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}
.card-app-info[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}
.card-app-icon[b-gxxjrqcdqv] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.card-app-placeholder[b-gxxjrqcdqv] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--rg-bg-sidebar, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--rg-text-muted, #94a3b8);
    flex-shrink: 0;
}
.card-id[b-gxxjrqcdqv] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--rg-accent, #4f46e5);
    display: block;
}
.card-title[b-gxxjrqcdqv] {
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-details[b-gxxjrqcdqv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    padding-top: 0.25rem;
}
.card-detail[b-gxxjrqcdqv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.card-label[b-gxxjrqcdqv] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.card-value[b-gxxjrqcdqv] {
    font-size: 0.78rem;
    color: var(--rg-text-primary, #1e293b);
}
.card-actions[b-gxxjrqcdqv] {
    display: flex;
    justify-content: flex-end;
    gap: 0.25rem;
    margin-top: auto;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rg-border-light, #f1f5f9);
}

/* View toggle: show/hide */
.show-on-grid[b-gxxjrqcdqv] { display: block; }
.hide-on-cards[b-gxxjrqcdqv] { display: none !important; }
.show-on-cards[b-gxxjrqcdqv] { display: grid; }
.hide-on-grid[b-gxxjrqcdqv] { display: none !important; }

/* Badges */
.badge[b-gxxjrqcdqv] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    font-size: 0.68rem;
    font-weight: 600;
    white-space: nowrap;
}
.badge-yes[b-gxxjrqcdqv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-gxxjrqcdqv] { background: #f1f5f9; color: #64748b; }

/* Detail panel */
.detail-panel[b-gxxjrqcdqv] {
    margin-top: 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    background: var(--rg-bg-card, #fff);
    overflow: hidden;
}
.detail-header[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: var(--rg-bg-sidebar, #f8fafc);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    font-size: 0.8rem;
    color: var(--rg-text-secondary, #475569);
}
.detail-grid[b-gxxjrqcdqv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.75rem;
    padding: 1rem;
}
.detail-field[b-gxxjrqcdqv] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.detail-label[b-gxxjrqcdqv] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.detail-value[b-gxxjrqcdqv] {
    font-size: 0.82rem;
    color: var(--rg-text-primary, #1e293b);
}

/* Avatar images */
[b-gxxjrqcdqv] .img-avatar {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    object-fit: cover;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f1f5f9);
}
[b-gxxjrqcdqv] .img-avatar-lg {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f1f5f9);
    margin-top: 0.25rem;
}

/* Utilities */
.font-mono[b-gxxjrqcdqv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.fw-bold[b-gxxjrqcdqv] { font-weight: 600; }
.text-center[b-gxxjrqcdqv] { text-align: center; }
.text-muted[b-gxxjrqcdqv] { color: var(--rg-text-muted, #94a3b8); }
.text-sm[b-gxxjrqcdqv] { font-size: 0.72rem; }

/* Loading / Empty */
.crud-loading[b-gxxjrqcdqv], .crud-empty-state[b-gxxjrqcdqv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    gap: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}
.crud-empty-state i[b-gxxjrqcdqv] { font-size: 2rem; }

.crud-spinner[b-gxxjrqcdqv] {
    width: 2rem;
    height: 2rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: var(--rg-accent, #4f46e5);
    border-radius: 50%;
    animation: spin-b-gxxjrqcdqv 0.6s linear infinite;
}
.crud-spinner-sm[b-gxxjrqcdqv] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-gxxjrqcdqv 0.6s linear infinite;
}
@keyframes spin-b-gxxjrqcdqv { to { transform: rotate(360deg); } }
.spin[b-gxxjrqcdqv] { animation: spin-b-gxxjrqcdqv 0.8s linear infinite; }

/* ---- Modal (sibling backdrop/container — no event bubbling) ---- */
.modal-backdrop[b-gxxjrqcdqv] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: fadeIn-b-gxxjrqcdqv 0.15s ease-out;
}

.modal-container[b-gxxjrqcdqv] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}

.modal-dialog[b-gxxjrqcdqv] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 600px;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    animation: scaleIn-b-gxxjrqcdqv 0.2s ease-out;
}
.modal-sm[b-gxxjrqcdqv] { max-width: 420px; }

@keyframes fadeIn-b-gxxjrqcdqv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-gxxjrqcdqv {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.modal-header[b-gxxjrqcdqv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.modal-header h2[b-gxxjrqcdqv] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.modal-header-danger[b-gxxjrqcdqv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-gxxjrqcdqv] { color: #dc2626; }

.modal-close[b-gxxjrqcdqv] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
}
.modal-close:hover[b-gxxjrqcdqv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }

.modal-body[b-gxxjrqcdqv] { padding: 1.25rem; }

.modal-footer[b-gxxjrqcdqv] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

/* Form */
.form-row[b-gxxjrqcdqv] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}
.form-group[b-gxxjrqcdqv] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.form-group.flex-2[b-gxxjrqcdqv] { flex: 2; }
.form-group label[b-gxxjrqcdqv] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.form-group input[b-gxxjrqcdqv],
.form-group select[b-gxxjrqcdqv] {
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color 0.15s;
}
.form-group input:focus[b-gxxjrqcdqv],
.form-group select:focus[b-gxxjrqcdqv] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}
.form-group input.readonly[b-gxxjrqcdqv] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-muted, #94a3b8);
}

/* ---- File Input Hidden ---- */
[b-gxxjrqcdqv] .file-input-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ---- Image Upload ---- */
.image-upload-box[b-gxxjrqcdqv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem;
    border: 1px dashed var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    background: var(--rg-bg-sidebar, #f8fafc);
    min-height: 64px;
}

.image-preview[b-gxxjrqcdqv] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-card, #fff);
    flex-shrink: 0;
}

.image-placeholder[b-gxxjrqcdqv] {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--rg-text-muted, #94a3b8);
    flex-shrink: 0;
}
.image-placeholder i[b-gxxjrqcdqv] { font-size: 1.1rem; }
.image-placeholder span[b-gxxjrqcdqv] { font-size: 0.55rem; text-transform: uppercase; }

.image-upload-actions[b-gxxjrqcdqv] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

label.btn-upload[b-gxxjrqcdqv] {
    margin: 0;
}

.btn-upload[b-gxxjrqcdqv] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.6rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-card, #fff);
    color: var(--rg-accent, #4f46e5);
    font-size: 0.7rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    user-select: none;
}
.btn-upload:hover[b-gxxjrqcdqv] {
    background: var(--rg-accent, #4f46e5);
    color: #fff;
    border-color: var(--rg-accent, #4f46e5);
}

.btn-upload-remove[b-gxxjrqcdqv] {
    color: #ef4444;
    border-color: transparent;
    background: transparent;
    padding: 0.2rem 0.4rem;
}
.btn-upload-remove:hover[b-gxxjrqcdqv] {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    border-color: transparent;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .crud-container[b-gxxjrqcdqv] { padding: 0.75rem; }
    .crud-header[b-gxxjrqcdqv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-gxxjrqcdqv] { font-size: 1.1rem; }
    .btn-text[b-gxxjrqcdqv] { display: none; }
    .form-row[b-gxxjrqcdqv] { flex-direction: column; }
    .detail-grid[b-gxxjrqcdqv] { grid-template-columns: 1fr 1fr; }
    .modal-dialog[b-gxxjrqcdqv] { width: 98%; max-height: 90vh; }
    .modal-body[b-gxxjrqcdqv] { padding: 1rem; }

    /* En movil: ocultar grid, mostrar cards por defecto */
    .crud-grid-wrapper.show-on-grid[b-gxxjrqcdqv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-gxxjrqcdqv] { display: grid !important; }

    .crud-cards-wrapper[b-gxxjrqcdqv] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-gxxjrqcdqv] {
        grid-template-columns: 1fr;
    }
    .card-details[b-gxxjrqcdqv] {
        flex-direction: column;
        gap: 0.35rem;
    }
}
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmregistraempresa.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-q564kv1zpv] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-q564kv1zpv 0.3s ease-out; }
@keyframes slideUp-b-q564kv1zpv { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-q564kv1zpv] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-q564kv1zpv] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-q564kv1zpv] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-q564kv1zpv] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-q564kv1zpv] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-q564kv1zpv] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-q564kv1zpv] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-q564kv1zpv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-q564kv1zpv] { filter: brightness(1.1); }
.btn-outline[b-q564kv1zpv] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-q564kv1zpv] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-q564kv1zpv] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-q564kv1zpv] { filter: brightness(1.1); }
.btn-icon[b-q564kv1zpv] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-q564kv1zpv] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-q564kv1zpv] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-q564kv1zpv] { color: #ef4444; }
.btn-delete:hover[b-q564kv1zpv] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-q564kv1zpv] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-q564kv1zpv] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-q564kv1zpv] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-q564kv1zpv] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-q564kv1zpv] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-q564kv1zpv] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-q564kv1zpv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-q564kv1zpv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-q564kv1zpv] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-q564kv1zpv] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-q564kv1zpv] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-q564kv1zpv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-q564kv1zpv] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-q564kv1zpv] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-q564kv1zpv] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-q564kv1zpv] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-q564kv1zpv] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-q564kv1zpv] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-q564kv1zpv] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-q564kv1zpv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-q564kv1zpv] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-q564kv1zpv] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-q564kv1zpv] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-q564kv1zpv] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-q564kv1zpv] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-q564kv1zpv] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-q564kv1zpv] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-q564kv1zpv] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-q564kv1zpv] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-q564kv1zpv] { display: block; }
.hide-on-cards[b-q564kv1zpv] { display: none !important; }
.show-on-cards[b-q564kv1zpv] { display: grid; }
.hide-on-grid[b-q564kv1zpv] { display: none !important; }

/* Badges */
.badge[b-q564kv1zpv] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-q564kv1zpv] { background: #ecfdf5; color: #065f46; }
.badge-no[b-q564kv1zpv] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-q564kv1zpv] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-q564kv1zpv] { text-align: center; }
.text-muted[b-q564kv1zpv] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-q564kv1zpv], .crud-empty-state[b-q564kv1zpv] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-q564kv1zpv] { font-size: 2rem; }
.crud-spinner[b-q564kv1zpv] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-q564kv1zpv 0.6s linear infinite; }
.crud-spinner-sm[b-q564kv1zpv] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-q564kv1zpv 0.6s linear infinite; }
@keyframes spin-b-q564kv1zpv { to { transform: rotate(360deg); } }
.spin[b-q564kv1zpv] { animation: spin-b-q564kv1zpv 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-q564kv1zpv] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-q564kv1zpv 0.15s ease-out; }
.modal-container[b-q564kv1zpv] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-q564kv1zpv] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-q564kv1zpv 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-q564kv1zpv] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-q564kv1zpv] { max-width: 420px; }
@keyframes fadeIn-b-q564kv1zpv { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-q564kv1zpv { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-q564kv1zpv] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-q564kv1zpv] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-q564kv1zpv] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-q564kv1zpv] { color: #dc2626; }
.modal-close[b-q564kv1zpv] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-q564kv1zpv] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-q564kv1zpv] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-q564kv1zpv] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-q564kv1zpv] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-q564kv1zpv] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-q564kv1zpv] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-q564kv1zpv] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-q564kv1zpv] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-q564kv1zpv] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-q564kv1zpv] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-q564kv1zpv] { flex: 2; }
.form-group label[b-q564kv1zpv] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-q564kv1zpv], .form-group select[b-q564kv1zpv], .form-textarea[b-q564kv1zpv] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-q564kv1zpv], .form-group select:focus[b-q564kv1zpv], .form-textarea:focus[b-q564kv1zpv] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-q564kv1zpv] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-q564kv1zpv] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-q564kv1zpv] { flex: 1; display: flex; align-items: center; }
.form-check[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-q564kv1zpv] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-q564kv1zpv] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-q564kv1zpv] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-q564kv1zpv] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-q564kv1zpv] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-q564kv1zpv] { font-size: 3rem; }
.photo-placeholder span[b-q564kv1zpv] { font-size: 0.78rem; }
.photo-actions[b-q564kv1zpv] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-q564kv1zpv] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-q564kv1zpv] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-q564kv1zpv] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-q564kv1zpv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-q564kv1zpv] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-q564kv1zpv] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-q564kv1zpv] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-q564kv1zpv] { filter: brightness(1.15); transform: scale(1.05); }
[b-q564kv1zpv] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-q564kv1zpv] { padding: 0.75rem; }
    .crud-header[b-q564kv1zpv] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-q564kv1zpv] { font-size: 1.1rem; }
    .btn-text[b-q564kv1zpv] { display: none; }
    .form-row[b-q564kv1zpv] { flex-direction: column; }
    .form-row-4[b-q564kv1zpv] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-q564kv1zpv] { width: 98%; max-height: 95vh; }
    .modal-lg[b-q564kv1zpv] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-q564kv1zpv] { padding: 0.75rem; }
    .modal-tabs[b-q564kv1zpv] { overflow-x: auto; }
    .modal-tab[b-q564kv1zpv] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-q564kv1zpv] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-q564kv1zpv] { display: grid !important; }
    .crud-cards-wrapper[b-q564kv1zpv] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-q564kv1zpv] { grid-template-columns: 1fr; }
    .card-details[b-q564kv1zpv] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-q564kv1zpv] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-q564kv1zpv] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-q564kv1zpv] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-q564kv1zpv] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmsacalertadeuda.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-pfv6ruw6j8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-pfv6ruw6j8 0.3s ease-out; }
@keyframes slideUp-b-pfv6ruw6j8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-pfv6ruw6j8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-pfv6ruw6j8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-pfv6ruw6j8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-pfv6ruw6j8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-pfv6ruw6j8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-pfv6ruw6j8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-pfv6ruw6j8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-pfv6ruw6j8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-pfv6ruw6j8] { filter: brightness(1.1); }
.btn-outline[b-pfv6ruw6j8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-pfv6ruw6j8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-pfv6ruw6j8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-pfv6ruw6j8] { filter: brightness(1.1); }
.btn-icon[b-pfv6ruw6j8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-pfv6ruw6j8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-pfv6ruw6j8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-pfv6ruw6j8] { color: #ef4444; }
.btn-delete:hover[b-pfv6ruw6j8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-pfv6ruw6j8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-pfv6ruw6j8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-pfv6ruw6j8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-pfv6ruw6j8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-pfv6ruw6j8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-pfv6ruw6j8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-pfv6ruw6j8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-pfv6ruw6j8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-pfv6ruw6j8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-pfv6ruw6j8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-pfv6ruw6j8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-pfv6ruw6j8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-pfv6ruw6j8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-pfv6ruw6j8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-pfv6ruw6j8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-pfv6ruw6j8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-pfv6ruw6j8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-pfv6ruw6j8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-pfv6ruw6j8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-pfv6ruw6j8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-pfv6ruw6j8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-pfv6ruw6j8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-pfv6ruw6j8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-pfv6ruw6j8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-pfv6ruw6j8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-pfv6ruw6j8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-pfv6ruw6j8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-pfv6ruw6j8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-pfv6ruw6j8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-pfv6ruw6j8] { display: block; }
.hide-on-cards[b-pfv6ruw6j8] { display: none !important; }
.show-on-cards[b-pfv6ruw6j8] { display: grid; }
.hide-on-grid[b-pfv6ruw6j8] { display: none !important; }

/* Badges */
.badge[b-pfv6ruw6j8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-pfv6ruw6j8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-pfv6ruw6j8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-pfv6ruw6j8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-pfv6ruw6j8] { text-align: center; }
.text-muted[b-pfv6ruw6j8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-pfv6ruw6j8], .crud-empty-state[b-pfv6ruw6j8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-pfv6ruw6j8] { font-size: 2rem; }
.crud-spinner[b-pfv6ruw6j8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-pfv6ruw6j8 0.6s linear infinite; }
.crud-spinner-sm[b-pfv6ruw6j8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-pfv6ruw6j8 0.6s linear infinite; }
@keyframes spin-b-pfv6ruw6j8 { to { transform: rotate(360deg); } }
.spin[b-pfv6ruw6j8] { animation: spin-b-pfv6ruw6j8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-pfv6ruw6j8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-pfv6ruw6j8 0.15s ease-out; }
.modal-container[b-pfv6ruw6j8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-pfv6ruw6j8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-pfv6ruw6j8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-pfv6ruw6j8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-pfv6ruw6j8] { max-width: 420px; }
@keyframes fadeIn-b-pfv6ruw6j8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-pfv6ruw6j8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-pfv6ruw6j8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-pfv6ruw6j8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-pfv6ruw6j8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-pfv6ruw6j8] { color: #dc2626; }
.modal-close[b-pfv6ruw6j8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-pfv6ruw6j8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-pfv6ruw6j8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-pfv6ruw6j8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-pfv6ruw6j8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-pfv6ruw6j8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-pfv6ruw6j8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-pfv6ruw6j8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-pfv6ruw6j8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-pfv6ruw6j8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-pfv6ruw6j8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-pfv6ruw6j8] { flex: 2; }
.form-group label[b-pfv6ruw6j8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-pfv6ruw6j8], .form-group select[b-pfv6ruw6j8], .form-textarea[b-pfv6ruw6j8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-pfv6ruw6j8], .form-group select:focus[b-pfv6ruw6j8], .form-textarea:focus[b-pfv6ruw6j8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-pfv6ruw6j8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-pfv6ruw6j8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-pfv6ruw6j8] { flex: 1; display: flex; align-items: center; }
.form-check[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-pfv6ruw6j8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-pfv6ruw6j8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-pfv6ruw6j8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-pfv6ruw6j8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-pfv6ruw6j8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-pfv6ruw6j8] { font-size: 3rem; }
.photo-placeholder span[b-pfv6ruw6j8] { font-size: 0.78rem; }
.photo-actions[b-pfv6ruw6j8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-pfv6ruw6j8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-pfv6ruw6j8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-pfv6ruw6j8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-pfv6ruw6j8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-pfv6ruw6j8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-pfv6ruw6j8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-pfv6ruw6j8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-pfv6ruw6j8] { filter: brightness(1.15); transform: scale(1.05); }
[b-pfv6ruw6j8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-pfv6ruw6j8] { padding: 0.75rem; }
    .crud-header[b-pfv6ruw6j8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-pfv6ruw6j8] { font-size: 1.1rem; }
    .btn-text[b-pfv6ruw6j8] { display: none; }
    .form-row[b-pfv6ruw6j8] { flex-direction: column; }
    .form-row-4[b-pfv6ruw6j8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-pfv6ruw6j8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-pfv6ruw6j8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-pfv6ruw6j8] { padding: 0.75rem; }
    .modal-tabs[b-pfv6ruw6j8] { overflow-x: auto; }
    .modal-tab[b-pfv6ruw6j8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-pfv6ruw6j8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-pfv6ruw6j8] { display: grid !important; }
    .crud-cards-wrapper[b-pfv6ruw6j8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-pfv6ruw6j8] { grid-template-columns: 1fr; }
    .card-details[b-pfv6ruw6j8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-pfv6ruw6j8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-pfv6ruw6j8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-pfv6ruw6j8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-pfv6ruw6j8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Seguridad/Frmsacingresolotencf.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9vbfqrccd1] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9vbfqrccd1 0.3s ease-out; }
@keyframes slideUp-b-9vbfqrccd1 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9vbfqrccd1] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9vbfqrccd1] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9vbfqrccd1] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9vbfqrccd1] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9vbfqrccd1] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9vbfqrccd1] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9vbfqrccd1] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9vbfqrccd1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9vbfqrccd1] { filter: brightness(1.1); }
.btn-outline[b-9vbfqrccd1] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9vbfqrccd1] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9vbfqrccd1] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9vbfqrccd1] { filter: brightness(1.1); }
.btn-icon[b-9vbfqrccd1] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9vbfqrccd1] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9vbfqrccd1] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9vbfqrccd1] { color: #ef4444; }
.btn-delete:hover[b-9vbfqrccd1] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9vbfqrccd1] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9vbfqrccd1] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9vbfqrccd1] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9vbfqrccd1] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9vbfqrccd1] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9vbfqrccd1] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9vbfqrccd1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9vbfqrccd1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9vbfqrccd1] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9vbfqrccd1] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9vbfqrccd1] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9vbfqrccd1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9vbfqrccd1] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9vbfqrccd1] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9vbfqrccd1] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9vbfqrccd1] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9vbfqrccd1] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9vbfqrccd1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9vbfqrccd1] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9vbfqrccd1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9vbfqrccd1] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9vbfqrccd1] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9vbfqrccd1] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9vbfqrccd1] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9vbfqrccd1] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9vbfqrccd1] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9vbfqrccd1] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9vbfqrccd1] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9vbfqrccd1] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9vbfqrccd1] { display: block; }
.hide-on-cards[b-9vbfqrccd1] { display: none !important; }
.show-on-cards[b-9vbfqrccd1] { display: grid; }
.hide-on-grid[b-9vbfqrccd1] { display: none !important; }

/* Badges */
.badge[b-9vbfqrccd1] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9vbfqrccd1] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9vbfqrccd1] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9vbfqrccd1] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9vbfqrccd1] { text-align: center; }
.text-muted[b-9vbfqrccd1] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9vbfqrccd1], .crud-empty-state[b-9vbfqrccd1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9vbfqrccd1] { font-size: 2rem; }
.crud-spinner[b-9vbfqrccd1] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9vbfqrccd1 0.6s linear infinite; }
.crud-spinner-sm[b-9vbfqrccd1] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9vbfqrccd1 0.6s linear infinite; }
@keyframes spin-b-9vbfqrccd1 { to { transform: rotate(360deg); } }
.spin[b-9vbfqrccd1] { animation: spin-b-9vbfqrccd1 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9vbfqrccd1] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9vbfqrccd1 0.15s ease-out; }
.modal-container[b-9vbfqrccd1] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9vbfqrccd1] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9vbfqrccd1 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9vbfqrccd1] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9vbfqrccd1] { max-width: 420px; }
@keyframes fadeIn-b-9vbfqrccd1 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9vbfqrccd1 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9vbfqrccd1] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9vbfqrccd1] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9vbfqrccd1] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9vbfqrccd1] { color: #dc2626; }
.modal-close[b-9vbfqrccd1] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9vbfqrccd1] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9vbfqrccd1] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9vbfqrccd1] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9vbfqrccd1] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9vbfqrccd1] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9vbfqrccd1] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9vbfqrccd1] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9vbfqrccd1] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9vbfqrccd1] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9vbfqrccd1] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9vbfqrccd1] { flex: 2; }
.form-group label[b-9vbfqrccd1] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9vbfqrccd1], .form-group select[b-9vbfqrccd1], .form-textarea[b-9vbfqrccd1] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9vbfqrccd1], .form-group select:focus[b-9vbfqrccd1], .form-textarea:focus[b-9vbfqrccd1] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9vbfqrccd1] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9vbfqrccd1] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9vbfqrccd1] { flex: 1; display: flex; align-items: center; }
.form-check[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9vbfqrccd1] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9vbfqrccd1] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9vbfqrccd1] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9vbfqrccd1] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9vbfqrccd1] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9vbfqrccd1] { font-size: 3rem; }
.photo-placeholder span[b-9vbfqrccd1] { font-size: 0.78rem; }
.photo-actions[b-9vbfqrccd1] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9vbfqrccd1] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9vbfqrccd1] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9vbfqrccd1] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9vbfqrccd1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9vbfqrccd1] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9vbfqrccd1] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9vbfqrccd1] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9vbfqrccd1] { filter: brightness(1.15); transform: scale(1.05); }
[b-9vbfqrccd1] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9vbfqrccd1] { padding: 0.75rem; }
    .crud-header[b-9vbfqrccd1] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9vbfqrccd1] { font-size: 1.1rem; }
    .btn-text[b-9vbfqrccd1] { display: none; }
    .form-row[b-9vbfqrccd1] { flex-direction: column; }
    .form-row-4[b-9vbfqrccd1] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9vbfqrccd1] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9vbfqrccd1] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9vbfqrccd1] { padding: 0.75rem; }
    .modal-tabs[b-9vbfqrccd1] { overflow-x: auto; }
    .modal-tab[b-9vbfqrccd1] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9vbfqrccd1] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9vbfqrccd1] { display: grid !important; }
    .crud-cards-wrapper[b-9vbfqrccd1] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9vbfqrccd1] { grid-template-columns: 1fr; }
    .card-details[b-9vbfqrccd1] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9vbfqrccd1] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9vbfqrccd1] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9vbfqrccd1] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9vbfqrccd1] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Seguridad/TestEncf.razor.rz.scp.css */
/* ============================================================
   TestEncf — Consola de diagnóstico y prueba e-CF
   Requiere los tokens --rg-* del design system (app.css).
   ============================================================ */

/* ── Animación slideUp (igual que Frmclientes) ─────────────── */
.crud-container[b-3wm4wy9taz] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-3wm4wy9taz 0.3s ease-out; }
@keyframes slideUp-b-3wm4wy9taz { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* ── Header ─────────────────────────────────────────────────── */
.crud-header[b-3wm4wy9taz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-3wm4wy9taz] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-3wm4wy9taz] { font-size: 1.75rem; color: var(--rg-accent); }
.crud-title[b-3wm4wy9taz] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary); margin: 0; }
.crud-subtitle[b-3wm4wy9taz] { font-size: 0.75rem; color: var(--rg-text-muted); }
.crud-header-actions[b-3wm4wy9taz] { display: flex; gap: 0.5rem; }

/* ── Botones ─────────────────────────────────────────────────── */
.btn-crud[b-3wm4wy9taz] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-3wm4wy9taz] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-3wm4wy9taz] { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-3wm4wy9taz] { filter: brightness(1.1); }
.btn-outline[b-3wm4wy9taz] { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-3wm4wy9taz] { background: var(--rg-bg-hover); }

/* ── Alert ───────────────────────────────────────────────────── */
.crud-alert[b-3wm4wy9taz] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-3wm4wy9taz] { background: rgba(34,197,94,0.12); color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.crud-alert.error[b-3wm4wy9taz]   { background: rgba(239,68,68,0.12);  color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
.crud-alert-close[b-3wm4wy9taz] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
[data-mode="dark"] .crud-alert.success[b-3wm4wy9taz] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-3wm4wy9taz]   { color: #fca5a5; }

/* ── Spinner ─────────────────────────────────────────────────── */
.crud-spinner-sm[b-3wm4wy9taz] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-3wm4wy9taz 0.6s linear infinite; }
.te-spinner-dark[b-3wm4wy9taz] { border: 2px solid var(--rg-border); border-top-color: var(--rg-accent); }
@keyframes spin-b-3wm4wy9taz { to { transform: rotate(360deg); } }
.spin[b-3wm4wy9taz] { animation: spin-b-3wm4wy9taz 0.8s linear infinite; }

/* ── Paneles ─────────────────────────────────────────────────── */
.te-panel[b-3wm4wy9taz] { background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.625rem; margin-bottom: 1rem; overflow: hidden; }

.te-panel-header[b-3wm4wy9taz] { display: flex; align-items: center; gap: 0.6rem; padding: 0.625rem 1rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); font-size: 0.82rem; font-weight: 700; color: var(--rg-text-primary); }
.te-panel-header i[b-3wm4wy9taz] { color: var(--rg-accent); font-size: 1rem; }

.ms-2[b-3wm4wy9taz] { margin-left: 0.5rem; }

/* BD chip en el header del panel de configuración */
.te-header-bd[b-3wm4wy9taz] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-left: 0.75rem;
    padding: 0.15rem 0.55rem;
    background: rgba(99,102,241,0.12);
    color: var(--rg-accent);
    border: 1px solid rgba(99,102,241,0.25);
    border-radius: 0.9rem;
    font-size: 0.7rem;
    font-weight: 600;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    letter-spacing: 0.01em;
}
[data-mode="dark"] .te-header-bd[b-3wm4wy9taz] {
    color: #a5b4fc;
    background: rgba(99,102,241,0.18);
}

/* ── Info grid (tenant) ──────────────────────────────────────── */
.te-info-grid[b-3wm4wy9taz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0.75rem; padding: 1rem; }

.te-endpoint-grid[b-3wm4wy9taz] { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.75rem; padding: 1rem; border-top: 1px solid var(--rg-border); }

.te-info-item[b-3wm4wy9taz] { display: flex; flex-direction: column; gap: 0.2rem; }
.te-info-wide[b-3wm4wy9taz] { grid-column: 1 / -1; }

.te-label[b-3wm4wy9taz] { font-size: 0.65rem; font-weight: 700; color: var(--rg-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.te-value[b-3wm4wy9taz] { font-size: 0.8rem; color: var(--rg-text-primary); word-break: break-all; }

/* ── Sin endpoint ────────────────────────────────────────────── */
.te-no-endpoint[b-3wm4wy9taz] { display: flex; align-items: flex-start; gap: 0.75rem; padding: 1rem; color: var(--rg-text-secondary); font-size: 0.82rem; }
.te-no-endpoint i[b-3wm4wy9taz] { font-size: 1.25rem; color: var(--rg-warning, #f59e0b); flex-shrink: 0; margin-top: 0.1rem; }
.te-no-endpoint code[b-3wm4wy9taz] { background: var(--rg-bg-subtle); padding: 0.1rem 0.35rem; border-radius: 0.25rem; font-size: 0.75rem; color: var(--rg-text-primary); }

/* ── Estado empty ────────────────────────────────────────────── */
.crud-empty-state[b-3wm4wy9taz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem; gap: 0.75rem; color: var(--rg-text-muted); }
.crud-empty-state i[b-3wm4wy9taz] { font-size: 2rem; }

/* ── Form (dentro del panel) ─────────────────────────────────── */
.form-row[b-3wm4wy9taz] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; padding: 1rem 1rem 0; }
.form-group[b-3wm4wy9taz] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-3wm4wy9taz] { flex: 2; }
.form-group label[b-3wm4wy9taz] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-3wm4wy9taz] { padding: 0.4rem 0.6rem; border: 1px solid var(--rg-border); border-radius: 0.375rem; font-size: 0.82rem; color: var(--rg-text-primary); background: var(--rg-bg-input); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-3wm4wy9taz] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79,70,229,0.15); }

.te-hint[b-3wm4wy9taz] { padding: 0 1rem 0.75rem; font-size: 0.78rem; color: var(--rg-text-muted); display: flex; align-items: center; gap: 0.4rem; margin: 0; }

/* ── Resultado ───────────────────────────────────────────────── */
.te-result[b-3wm4wy9taz] { margin: 0.75rem 1rem 1rem; padding: 0.875rem 1rem; border-radius: 0.5rem; border-left: 4px solid; }
.te-result-success[b-3wm4wy9taz] { background: rgba(34,197,94,0.08);  border-color: #22c55e; }
.te-result-error[b-3wm4wy9taz]   { background: rgba(239,68,68,0.08);  border-color: #ef4444; }
.te-result-warn[b-3wm4wy9taz]    { background: rgba(245,158,11,0.08); border-color: #f59e0b; }
.te-result-info[b-3wm4wy9taz]    { background: rgba(99,102,241,0.08); border-color: #6366f1; }

.te-result-header[b-3wm4wy9taz] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; margin-bottom: 0.5rem; color: var(--rg-text-primary); }
.te-result-success .te-result-header i[b-3wm4wy9taz] { color: #22c55e; }
.te-result-error   .te-result-header i[b-3wm4wy9taz] { color: #ef4444; }
.te-result-warn    .te-result-header i[b-3wm4wy9taz] { color: #f59e0b; }
.te-result-info    .te-result-header i[b-3wm4wy9taz] { color: #6366f1; }

.te-result-msg[b-3wm4wy9taz] { margin: 0.25rem 0 0.5rem; font-size: 0.8rem; color: var(--rg-text-secondary); }

.te-result-field[b-3wm4wy9taz] { display: flex; flex-direction: column; gap: 0.2rem; margin-top: 0.5rem; }

.te-http-code[b-3wm4wy9taz] { margin-left: auto; font-size: 0.7rem; font-weight: 600; color: var(--rg-text-muted); background: var(--rg-bg-subtle); padding: 0.1rem 0.4rem; border-radius: 0.25rem; }

.te-link[b-3wm4wy9taz] { font-size: 0.78rem; color: var(--rg-accent); word-break: break-all; }
.te-link:hover[b-3wm4wy9taz] { text-decoration: underline; }

/* ── XML preview ─────────────────────────────────────────────── */
.te-xml-preview[b-3wm4wy9taz] { width: 100%; font-size: 0.72rem; font-family: 'Cascadia Code', 'Fira Code', monospace; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 0.375rem; padding: 0.5rem; resize: vertical; margin-top: 0.35rem; }
.te-xml-hint[b-3wm4wy9taz] { font-size: 0.75rem; color: var(--rg-text-muted); }

.te-toggle-xml[b-3wm4wy9taz] { background: none; border: none; cursor: pointer; font-size: 0.7rem; color: var(--rg-accent); margin-left: 0.5rem; padding: 0; text-decoration: underline; }

/* ── Badges ──────────────────────────────────────────────────── */
.font-mono[b-3wm4wy9taz] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.badge[b-3wm4wy9taz] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-3wm4wy9taz]   { background: rgba(34,197,94,0.15);  color: #166534; border: 1px solid rgba(34,197,94,0.3); }
.badge-no[b-3wm4wy9taz]    { background: rgba(100,116,139,0.1); color: #475569; border: 1px solid rgba(100,116,139,0.2); }
.badge-wil[b-3wm4wy9taz]   { background: rgba(99,102,241,0.15); color: #4338ca; border: 1px solid rgba(99,102,241,0.3); }
.badge-br[b-3wm4wy9taz]    { background: rgba(245,158,11,0.15); color: #92400e; border: 1px solid rgba(245,158,11,0.3); }
.badge-token[b-3wm4wy9taz] { background: rgba(16,185,129,0.15); color: #065f46; border: 1px solid rgba(16,185,129,0.3); }
.badge-apikey[b-3wm4wy9taz]{ background: rgba(139,92,246,0.15); color: #5b21b6; border: 1px solid rgba(139,92,246,0.3); }

[data-mode="dark"] .badge-yes[b-3wm4wy9taz]    { color: #86efac; }
[data-mode="dark"] .badge-no[b-3wm4wy9taz]     { color: #94a3b8; }
[data-mode="dark"] .badge-wil[b-3wm4wy9taz]    { color: #a5b4fc; }
[data-mode="dark"] .badge-br[b-3wm4wy9taz]     { color: #fcd34d; }
[data-mode="dark"] .badge-token[b-3wm4wy9taz]  { color: #6ee7b7; }
[data-mode="dark"] .badge-apikey[b-3wm4wy9taz] { color: #c4b5fd; }

/* ── Consola de log ──────────────────────────────────────────── */
.te-log-count[b-3wm4wy9taz] {
    margin-left: 0.6rem;
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.8rem;
    padding: 0.05rem 0.45rem;
}

.te-log-console[b-3wm4wy9taz] {
    min-height: 120px;
    max-height: 340px;
    overflow-y: auto;
    padding: 0.6rem 0.75rem;
    background: #0d1117;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.73rem;
    line-height: 1.7;
    scroll-behavior: smooth;
}

[data-mode="light"] .te-log-console[b-3wm4wy9taz] {
    background: #1e2030;
}

.te-log-empty[b-3wm4wy9taz] {
    color: #4b5563;
    font-style: italic;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.te-log-line[b-3wm4wy9taz] {
    display: flex;
    align-items: baseline;
    gap: 0.55rem;
    padding: 0.08rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    word-break: break-all;
}

.te-log-ts[b-3wm4wy9taz] {
    flex-shrink: 0;
    color: #6b7280;
    font-size: 0.68rem;
    min-width: 7rem;
    user-select: none;
}

.te-log-badge[b-3wm4wy9taz] {
    flex-shrink: 0;
    font-size: 0.6rem;
    font-weight: 700;
    padding: 0.05rem 0.35rem;
    border-radius: 0.25rem;
    letter-spacing: 0.04em;
    min-width: 3.4rem;
    text-align: center;
    user-select: none;
}

/* nivel info */
.te-log-info    .te-log-msg[b-3wm4wy9taz]    { color: #d1d5db; }
.te-log-badge-info[b-3wm4wy9taz]             { background: rgba(99,102,241,0.2);  color: #a5b4fc; border: 1px solid rgba(99,102,241,0.3); }

/* nivel ok */
.te-log-ok      .te-log-msg[b-3wm4wy9taz]    { color: #86efac; }
.te-log-badge-ok[b-3wm4wy9taz]               { background: rgba(34,197,94,0.2);   color: #86efac;  border: 1px solid rgba(34,197,94,0.3); }

/* nivel warn */
.te-log-warn    .te-log-msg[b-3wm4wy9taz]    { color: #fcd34d; }
.te-log-badge-warn[b-3wm4wy9taz]             { background: rgba(245,158,11,0.2);  color: #fcd34d;  border: 1px solid rgba(245,158,11,0.3); }

/* nivel error */
.te-log-error   .te-log-msg[b-3wm4wy9taz]    { color: #fca5a5; }
.te-log-badge-error[b-3wm4wy9taz]            { background: rgba(239,68,68,0.2);   color: #fca5a5;  border: 1px solid rgba(239,68,68,0.3); }

/* ── Panel de ejemplos de código ────────────────────────────── */
.ms-auto[b-3wm4wy9taz] { margin-left: auto; }

.te-sample-tabs[b-3wm4wy9taz] {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--rg-border);
    padding: 0 1rem;
    overflow-x: auto;
    background: var(--rg-bg-subtle);
}

.te-sample-tab[b-3wm4wy9taz] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.9rem;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--rg-text-secondary);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
}

.te-sample-tab:hover[b-3wm4wy9taz] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

.te-sample-tab.active[b-3wm4wy9taz] {
    color: var(--rg-accent);
    border-bottom-color: var(--rg-accent);
    font-weight: 600;
}

.te-sample-body[b-3wm4wy9taz] {
    padding: 1rem;
}

.te-sample-desc[b-3wm4wy9taz] {
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
    margin: 0 0 0.75rem;
    line-height: 1.5;
}

.te-code[b-3wm4wy9taz] {
    display: block;
    white-space: pre;
    overflow-x: auto;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.75rem;
    line-height: 1.6;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin: 0;
    tab-size: 4;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
    .crud-container[b-3wm4wy9taz] { padding: 0.75rem; }
    .crud-header[b-3wm4wy9taz] { flex-direction: column; align-items: flex-start; }
    .btn-text[b-3wm4wy9taz] { display: none; }
    .form-row[b-3wm4wy9taz] { flex-direction: column; }
    .te-info-grid[b-3wm4wy9taz], .te-endpoint-grid[b-3wm4wy9taz] { grid-template-columns: 1fr 1fr; }
    .te-info-wide[b-3wm4wy9taz] { grid-column: 1 / -1; }
}

@media (max-width: 480px) {
    .te-info-grid[b-3wm4wy9taz], .te-endpoint-grid[b-3wm4wy9taz] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Pages/Sistema/FrmAyudaEditor.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════════════
   FrmAyudaEditor.razor.css  —  Editor de archivos de ayuda Markdown
   Tokens: var(--rg-*)  |  Soporte claro + oscuro
   ══════════════════════════════════════════════════════════════════ */

/* ── Contenedor principal ───────────────────────────────────────── */
.ae-container[b-uutun1tlhf] { padding: 1.5rem; display: flex; flex-direction: column; height: calc(100vh - 4rem); }

/* ── Header estándar (hereda de app.css crud-*) ─────────────────── */
.crud-container[b-uutun1tlhf]   { padding: 0; }
.crud-header[b-uutun1tlhf]      { display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-shrink:0; }
.crud-header-left[b-uutun1tlhf] { display:flex;align-items:center;gap:.75rem; }
.crud-header-icon[b-uutun1tlhf] { font-size:1.6rem;color:var(--rg-primary); }
.crud-title[b-uutun1tlhf]       { font-size:1.25rem;font-weight:700;color:var(--rg-text-primary);margin:0; }
.crud-subtitle[b-uutun1tlhf]    { font-size:.8rem;color:var(--rg-text-secondary); }
.crud-header-actions[b-uutun1tlhf] { display:flex;gap:.5rem; }
.crud-alert[b-uutun1tlhf]       { display:flex;align-items:center;gap:.5rem;padding:.65rem 1rem;border-radius:.5rem;margin-bottom:.75rem;font-size:.85rem;flex-shrink:0; }
.crud-alert.success[b-uutun1tlhf] { background:rgba(22,163,74,.1);color:#166534;border:1px solid rgba(22,163,74,.25); }
.crud-alert.error[b-uutun1tlhf]   { background:rgba(220,38,38,.1);color:#991b1b;border:1px solid rgba(220,38,38,.25); }
.crud-alert-close[b-uutun1tlhf] { margin-left:auto;background:none;border:none;cursor:pointer;color:inherit; }
[data-mode="dark"] .crud-alert.success[b-uutun1tlhf] { color:#86efac; }
[data-mode="dark"] .crud-alert.error[b-uutun1tlhf]   { color:#fca5a5; }

/* ── Layout 2 paneles ───────────────────────────────────────────── */
.ae-layout[b-uutun1tlhf] {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 0;
    flex: 1;
    min-height: 0;
    border: 1px solid var(--rg-border);
    border-radius: .75rem;
    overflow: hidden;
    background: var(--rg-bg-card);
}

/* ── Sidebar árbol ──────────────────────────────────────────────── */
.ae-sidebar[b-uutun1tlhf] {
    border-right: 1px solid var(--rg-border);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--rg-bg-subtle);
}
.ae-sidebar-header[b-uutun1tlhf] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem .9rem;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--rg-text-muted);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.ae-tree[b-uutun1tlhf] { overflow-y: auto; flex: 1; padding: .35rem 0; }

/* Nodos del árbol */
.ae-node[b-uutun1tlhf] {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .3rem .75rem;
    cursor: pointer;
    font-size: .82rem;
    color: var(--rg-text-secondary);
    transition: background .12s;
    user-select: none;
}
.ae-node:hover[b-uutun1tlhf] { background: var(--rg-bg-hover); }
.ae-dir[b-uutun1tlhf]  { font-weight: 600; color: var(--rg-text-primary); }
.ae-file[b-uutun1tlhf] { font-weight: 400; }
.ae-file-name[b-uutun1tlhf] { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ae-selected[b-uutun1tlhf] { background: rgba(37,99,235,.12) !important; color: var(--rg-primary) !important; font-weight: 600; }
[data-mode="dark"] .ae-selected[b-uutun1tlhf] { background: rgba(37,99,235,.2) !important; color: #93c5fd !important; }

/* Indentación por nivel */
.ae-level-0[b-uutun1tlhf] { padding-left: .75rem; }
.ae-level-1[b-uutun1tlhf] { padding-left: 1.25rem; }
.ae-level-2[b-uutun1tlhf] { padding-left: 2rem; }
.ae-level-3[b-uutun1tlhf] { padding-left: 2.75rem; }
.ae-level-4[b-uutun1tlhf] { padding-left: 3.5rem; }

.ae-chevron[b-uutun1tlhf]   { font-size: .65rem; color: var(--rg-text-muted); flex-shrink: 0; }
.ae-node-icon[b-uutun1tlhf] { font-size: .9rem; flex-shrink: 0; }
.ae-file-icon[b-uutun1tlhf] { color: var(--rg-text-muted); }
.ae-dirty[b-uutun1tlhf]     { color: var(--rg-warning, #f59e0b); font-size: .75rem; margin-left: auto; }

/* ── Área de edición ────────────────────────────────────────────── */
.ae-editor-area[b-uutun1tlhf] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

/* Estado vacío */
.ae-empty-state[b-uutun1tlhf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    color: var(--rg-text-muted);
    font-size: .9rem;
}
.ae-empty-state i[b-uutun1tlhf]  { font-size: 3rem; opacity: .4; }
.ae-empty-state strong[b-uutun1tlhf] { font-size: 1rem; color: var(--rg-text-secondary); }
.ae-empty-state span[b-uutun1tlhf] { font-size: .82rem; }
.ae-hint[b-uutun1tlhf] { font-size: .78rem; color: var(--rg-text-muted); margin-top: .25rem; }
.ae-hint strong[b-uutun1tlhf] { color: var(--rg-primary); }

/* Barra de archivo */
.ae-file-bar[b-uutun1tlhf] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem 1rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.ae-bar-icon[b-uutun1tlhf]  { color: var(--rg-text-muted); font-size: .9rem; }
.ae-bar-path[b-uutun1tlhf]  { font-size: .82rem; font-family: 'Cascadia Code','Fira Code',monospace; color: var(--rg-text-secondary); flex: 1; }
.ae-dirty-badge[b-uutun1tlhf] {
    background: rgba(245,158,11,.15);
    color: #92400e;
    border: 1px solid rgba(245,158,11,.35);
    border-radius: 1rem;
    font-size: .68rem;
    font-weight: 700;
    padding: .1rem .5rem;
}
[data-mode="dark"] .ae-dirty-badge[b-uutun1tlhf] { color: #fcd34d; }
.ae-bar-actions[b-uutun1tlhf] { display: flex; gap: .3rem; margin-left: auto; }
.ae-bar-btn[b-uutun1tlhf] {
    background: none; border: 1px solid var(--rg-border); border-radius: .35rem;
    padding: .25rem .4rem; cursor: pointer; font-size: .8rem;
    color: var(--rg-text-muted); transition: all .12s;
}
.ae-bar-btn:hover[b-uutun1tlhf] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.ae-bar-btn:disabled[b-uutun1tlhf] { opacity: .4; cursor: not-allowed; }
.ae-bar-btn-danger:hover[b-uutun1tlhf] { background: rgba(220,38,38,.1); color: var(--rg-danger,#dc2626); border-color: rgba(220,38,38,.4); }

/* Toggle de vista */
.ae-view-toggle[b-uutun1tlhf] {
    display: flex;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.ae-vt[b-uutun1tlhf] {
    flex: 1;
    padding: .45rem;
    background: none;
    border: none;
    cursor: pointer;
    font-size: .78rem;
    color: var(--rg-text-muted);
    display: flex; align-items: center; justify-content: center; gap: .3rem;
    border-bottom: 2px solid transparent;
    transition: all .15s;
}
.ae-vt:hover[b-uutun1tlhf] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }
.ae-vt.active[b-uutun1tlhf] { color: var(--rg-primary); border-bottom-color: var(--rg-primary); font-weight: 600; }

/* Paneles editor / preview */
.ae-panes[b-uutun1tlhf] {
    flex: 1;
    display: grid;
    min-height: 0;
    overflow: hidden;
}
.ae-panes-edit[b-uutun1tlhf]    { grid-template-columns: 1fr; }
.ae-panes-split[b-uutun1tlhf]   { grid-template-columns: 1fr 1fr; }
.ae-panes-preview[b-uutun1tlhf] { grid-template-columns: 1fr; }

/* Panel editor */
.ae-editor-pane[b-uutun1tlhf] {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--rg-border);
    min-height: 0;
}
.ae-panes-edit .ae-editor-pane[b-uutun1tlhf] { border-right: none; }

/* Toolbar Markdown */
.ae-md-toolbar[b-uutun1tlhf] {
    display: flex;
    gap: .25rem;
    padding: .35rem .6rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    flex-shrink: 0;
    flex-wrap: wrap;
}
.ae-md-btn[b-uutun1tlhf] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: .3rem;
    padding: .2rem .45rem;
    font-size: .75rem;
    cursor: pointer;
    color: var(--rg-text-secondary);
    transition: all .12s;
    font-family: inherit;
}
.ae-md-btn:hover[b-uutun1tlhf] { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }

/* Textarea */
.ae-textarea[b-uutun1tlhf] {
    flex: 1;
    width: 100%;
    padding: 1rem;
    border: none;
    outline: none;
    resize: none;
    background: var(--rg-bg-card);
    color: var(--rg-text-primary);
    font-family: 'Cascadia Code','Fira Code','Courier New',monospace;
    font-size: .83rem;
    line-height: 1.65;
    tab-size: 2;
}
.ae-char-count[b-uutun1tlhf] {
    padding: .3rem .75rem;
    font-size: .7rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
    text-align: right;
}

/* Panel preview */
.ae-preview-pane[b-uutun1tlhf] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 0;
}
.ae-preview-label[b-uutun1tlhf] {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .85rem;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--rg-text-muted);
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.ae-preview-content[b-uutun1tlhf] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem;
}

/* ── Modales ────────────────────────────────────────────────────── */
.modal-backdrop[b-uutun1tlhf]  { position:fixed;inset:0;background:rgba(0,0,0,0.4);backdrop-filter:blur(4px);z-index:1000; }
.modal-container[b-uutun1tlhf] { position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:1001;pointer-events:none; }
.modal-dialog[b-uutun1tlhf]    { pointer-events:auto;background:var(--rg-bg-card,#fff);border-radius:.75rem;width:95%;max-width:480px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2); }
.modal-sm[b-uutun1tlhf]        { max-width:440px; }
.modal-header[b-uutun1tlhf]    { display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem;border-bottom:1px solid var(--rg-border,#e2e8f0);flex-shrink:0; }
.modal-header h2[b-uutun1tlhf] { margin:0;font-size:1rem;font-weight:700;color:var(--rg-text-primary);display:flex;align-items:center;gap:.5rem; }
.modal-close[b-uutun1tlhf]     { background:none;border:none;cursor:pointer;color:var(--rg-text-muted);font-size:1rem;padding:.25rem;border-radius:.25rem; }
.modal-close:hover[b-uutun1tlhf] { color:var(--rg-text-primary);background:var(--rg-bg-hover); }
.modal-body[b-uutun1tlhf]      { overflow-y:auto;flex:1; }
.modal-footer[b-uutun1tlhf]    { display:flex;justify-content:flex-end;gap:.5rem;padding:.625rem 1.25rem;border-top:1px solid var(--rg-border);flex-shrink:0; }

/* Formulario dentro del modal */
.form-group[b-uutun1tlhf]       { display:flex;flex-direction:column;gap:.3rem; }
.form-group label[b-uutun1tlhf] { font-size:.72rem;font-weight:700;letter-spacing:.05em;color:var(--rg-text-muted);text-transform:uppercase; }
.form-group input[b-uutun1tlhf], .form-group select[b-uutun1tlhf] {
    background:var(--rg-bg-input,#f8fafc);
    color:var(--rg-text-primary);
    border:1px solid var(--rg-border);
    border-radius:.4rem;
    padding:.45rem .7rem;
    font-size:.875rem;
    width:100%;
}
.form-group input:focus[b-uutun1tlhf], .form-group select:focus[b-uutun1tlhf] { outline:none;border-color:var(--rg-primary);box-shadow:0 0 0 3px rgba(26,58,92,.15); }

/* Botones estándar */
.btn-crud[b-uutun1tlhf]        { display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:.45rem;font-size:.82rem;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .15s; }
.btn-primary[b-uutun1tlhf]     { background:var(--rg-primary,#1a3a5c);color:#fff;border-color:var(--rg-primary); }
.btn-primary:hover[b-uutun1tlhf] { opacity:.9; }
.btn-primary:disabled[b-uutun1tlhf] { opacity:.5;cursor:not-allowed; }
.btn-outline[b-uutun1tlhf]     { background:transparent;color:var(--rg-text-secondary);border-color:var(--rg-border); }
.btn-outline:hover[b-uutun1tlhf] { background:var(--rg-bg-hover); }
.btn-outline:disabled[b-uutun1tlhf] { opacity:.5;cursor:not-allowed; }
.btn-danger[b-uutun1tlhf]      { background:var(--rg-danger,#dc2626);color:#fff;border-color:var(--rg-danger); }
.btn-danger:hover[b-uutun1tlhf] { opacity:.9; }
.btn-text[b-uutun1tlhf]        { display:none; }
@media (min-width: 768px) { .btn-text[b-uutun1tlhf] { display:inline; } }

.crud-spinner-sm[b-uutun1tlhf] { width:1rem;height:1rem;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:hm-spin-b-uutun1tlhf .8s linear infinite;display:inline-block; }
@keyframes hm-spin-b-uutun1tlhf { to { transform: rotate(360deg); } }
.spin[b-uutun1tlhf] { animation: hm-spin-b-uutun1tlhf .8s linear infinite; }

/* hm-* classes (preview usa estilos de HelpModal) */
.hm-content[b-uutun1tlhf]    { font-size:.875rem; }
.hm-h2[b-uutun1tlhf]         { font-size:1rem;font-weight:700;color:var(--rg-primary,#1a3a5c);margin:1rem 0 .35rem;padding-bottom:.35rem;border-bottom:2px solid var(--rg-border); }
.hm-h2:first-child[b-uutun1tlhf] { margin-top:0; }
.hm-h3[b-uutun1tlhf]         { font-size:.9rem;font-weight:700;color:var(--rg-text-primary);margin:.75rem 0 .25rem; }
.hm-h4[b-uutun1tlhf]         { font-size:.82rem;font-weight:700;color:var(--rg-text-secondary);margin:.6rem 0 .2rem;text-transform:uppercase;letter-spacing:.04em; }
.hm-p[b-uutun1tlhf]          { font-size:.875rem;color:var(--rg-text-secondary);line-height:1.6;margin:.15rem 0; }
.hm-ul[b-uutun1tlhf],.hm-ol[b-uutun1tlhf]  { padding-left:1.35rem;margin:.15rem 0; }
.hm-ul li[b-uutun1tlhf],.hm-ol li[b-uutun1tlhf] { font-size:.875rem;color:var(--rg-text-secondary);line-height:1.6;margin-bottom:.15rem; }
.hm-tip[b-uutun1tlhf]        { display:flex;align-items:flex-start;gap:.5rem;background:rgba(37,99,235,.07);border-left:4px solid var(--rg-primary,#1a3a5c);border-radius:0 .4rem .4rem 0;padding:.65rem .9rem;font-size:.86rem;color:var(--rg-text-secondary);margin:.35rem 0;line-height:1.55; }
.hm-tip .bi-lightbulb-fill[b-uutun1tlhf] { color:var(--rg-primary,#1a3a5c);flex-shrink:0;margin-top:.1rem; }
.hm-code[b-uutun1tlhf]       { background:var(--rg-bg-subtle,#f1f5f9);border:1px solid var(--rg-border);border-radius:3px;padding:.1em .35em;font-family:'Cascadia Code',monospace;font-size:.8em;color:var(--rg-primary); }
.hm-hr[b-uutun1tlhf]         { border:none;border-top:1px solid var(--rg-border);margin:.75rem 0; }
[data-mode="dark"] .hm-h2[b-uutun1tlhf]  { color:#93c5fd; }
[data-mode="dark"] .hm-tip[b-uutun1tlhf] { background:rgba(37,99,235,.14);border-left-color:#93c5fd; }
[data-mode="dark"] .hm-tip .bi-lightbulb-fill[b-uutun1tlhf] { color:#93c5fd; }
[data-mode="dark"] .hm-code[b-uutun1tlhf] { background:rgba(255,255,255,.06);color:#93c5fd; }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmparametrossultidora.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-9vny12rqy9] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-9vny12rqy9 0.3s ease-out; }
@keyframes slideUp-b-9vny12rqy9 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-9vny12rqy9] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-9vny12rqy9] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-9vny12rqy9] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-9vny12rqy9] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-9vny12rqy9] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-9vny12rqy9] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-9vny12rqy9] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-9vny12rqy9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-9vny12rqy9] { filter: brightness(1.1); }
.btn-outline[b-9vny12rqy9] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-9vny12rqy9] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-9vny12rqy9] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-9vny12rqy9] { filter: brightness(1.1); }
.btn-icon[b-9vny12rqy9] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-9vny12rqy9] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-9vny12rqy9] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-9vny12rqy9] { color: #ef4444; }
.btn-delete:hover[b-9vny12rqy9] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-9vny12rqy9] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-9vny12rqy9] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-9vny12rqy9] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-9vny12rqy9] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-9vny12rqy9] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-9vny12rqy9] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-9vny12rqy9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-9vny12rqy9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-9vny12rqy9] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-9vny12rqy9] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-9vny12rqy9] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-9vny12rqy9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-9vny12rqy9] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-9vny12rqy9] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-9vny12rqy9] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-9vny12rqy9] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-9vny12rqy9] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-9vny12rqy9] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-9vny12rqy9] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-9vny12rqy9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-9vny12rqy9] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-9vny12rqy9] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-9vny12rqy9] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-9vny12rqy9] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-9vny12rqy9] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-9vny12rqy9] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-9vny12rqy9] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-9vny12rqy9] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-9vny12rqy9] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-9vny12rqy9] { display: block; }
.hide-on-cards[b-9vny12rqy9] { display: none !important; }
.show-on-cards[b-9vny12rqy9] { display: grid; }
.hide-on-grid[b-9vny12rqy9] { display: none !important; }

/* Badges */
.badge[b-9vny12rqy9] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-9vny12rqy9] { background: #ecfdf5; color: #065f46; }
.badge-no[b-9vny12rqy9] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-9vny12rqy9] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-9vny12rqy9] { text-align: center; }
.text-muted[b-9vny12rqy9] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-9vny12rqy9], .crud-empty-state[b-9vny12rqy9] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-9vny12rqy9] { font-size: 2rem; }
.crud-spinner[b-9vny12rqy9] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-9vny12rqy9 0.6s linear infinite; }
.crud-spinner-sm[b-9vny12rqy9] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-9vny12rqy9 0.6s linear infinite; }
@keyframes spin-b-9vny12rqy9 { to { transform: rotate(360deg); } }
.spin[b-9vny12rqy9] { animation: spin-b-9vny12rqy9 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-9vny12rqy9] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-9vny12rqy9 0.15s ease-out; }
.modal-container[b-9vny12rqy9] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-9vny12rqy9] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-9vny12rqy9 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-9vny12rqy9] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-9vny12rqy9] { max-width: 420px; }
@keyframes fadeIn-b-9vny12rqy9 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-9vny12rqy9 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-9vny12rqy9] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-9vny12rqy9] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-9vny12rqy9] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-9vny12rqy9] { color: #dc2626; }
.modal-close[b-9vny12rqy9] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-9vny12rqy9] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-9vny12rqy9] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-9vny12rqy9] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-9vny12rqy9] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-9vny12rqy9] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-9vny12rqy9] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-9vny12rqy9] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-9vny12rqy9] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-9vny12rqy9] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-9vny12rqy9] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-9vny12rqy9] { flex: 2; }
.form-group label[b-9vny12rqy9] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-9vny12rqy9], .form-group select[b-9vny12rqy9], .form-textarea[b-9vny12rqy9] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-9vny12rqy9], .form-group select:focus[b-9vny12rqy9], .form-textarea:focus[b-9vny12rqy9] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-9vny12rqy9] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-9vny12rqy9] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-9vny12rqy9] { flex: 1; display: flex; align-items: center; }
.form-check[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-9vny12rqy9] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-9vny12rqy9] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-9vny12rqy9] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-9vny12rqy9] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-9vny12rqy9] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-9vny12rqy9] { font-size: 3rem; }
.photo-placeholder span[b-9vny12rqy9] { font-size: 0.78rem; }
.photo-actions[b-9vny12rqy9] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-9vny12rqy9] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-9vny12rqy9] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-9vny12rqy9] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-9vny12rqy9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-9vny12rqy9] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-9vny12rqy9] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-9vny12rqy9] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-9vny12rqy9] { filter: brightness(1.15); transform: scale(1.05); }
[b-9vny12rqy9] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-9vny12rqy9] { padding: 0.75rem; }
    .crud-header[b-9vny12rqy9] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-9vny12rqy9] { font-size: 1.1rem; }
    .btn-text[b-9vny12rqy9] { display: none; }
    .form-row[b-9vny12rqy9] { flex-direction: column; }
    .form-row-4[b-9vny12rqy9] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-9vny12rqy9] { width: 98%; max-height: 95vh; }
    .modal-lg[b-9vny12rqy9] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-9vny12rqy9] { padding: 0.75rem; }
    .modal-tabs[b-9vny12rqy9] { overflow-x: auto; }
    .modal-tab[b-9vny12rqy9] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-9vny12rqy9] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-9vny12rqy9] { display: grid !important; }
    .crud-cards-wrapper[b-9vny12rqy9] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-9vny12rqy9] { grid-template-columns: 1fr; }
    .card-details[b-9vny12rqy9] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-9vny12rqy9] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-9vny12rqy9] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-9vny12rqy9] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-9vny12rqy9] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpcontratosodinpro.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-85zn6h9y77] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-85zn6h9y77 0.3s ease-out; }
@keyframes slideUp-b-85zn6h9y77 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-85zn6h9y77] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-85zn6h9y77] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-85zn6h9y77] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-85zn6h9y77] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-85zn6h9y77] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-85zn6h9y77] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-85zn6h9y77] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-85zn6h9y77] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-85zn6h9y77] { filter: brightness(1.1); }
.btn-outline[b-85zn6h9y77] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-85zn6h9y77] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-85zn6h9y77] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-85zn6h9y77] { filter: brightness(1.1); }
.btn-icon[b-85zn6h9y77] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-85zn6h9y77] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-85zn6h9y77] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-85zn6h9y77] { color: #ef4444; }
.btn-delete:hover[b-85zn6h9y77] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-85zn6h9y77] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-85zn6h9y77] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-85zn6h9y77] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-85zn6h9y77] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-85zn6h9y77] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-85zn6h9y77] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-85zn6h9y77] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-85zn6h9y77] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-85zn6h9y77] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-85zn6h9y77] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-85zn6h9y77] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-85zn6h9y77] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-85zn6h9y77] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-85zn6h9y77] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-85zn6h9y77] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-85zn6h9y77] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-85zn6h9y77] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-85zn6h9y77] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-85zn6h9y77] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-85zn6h9y77] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-85zn6h9y77] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-85zn6h9y77] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-85zn6h9y77] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-85zn6h9y77] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-85zn6h9y77] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-85zn6h9y77] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-85zn6h9y77] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-85zn6h9y77] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-85zn6h9y77] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-85zn6h9y77] { display: block; }
.hide-on-cards[b-85zn6h9y77] { display: none !important; }
.show-on-cards[b-85zn6h9y77] { display: grid; }
.hide-on-grid[b-85zn6h9y77] { display: none !important; }

/* Badges */
.badge[b-85zn6h9y77] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-85zn6h9y77] { background: #ecfdf5; color: #065f46; }
.badge-no[b-85zn6h9y77] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-85zn6h9y77] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-85zn6h9y77] { text-align: center; }
.text-muted[b-85zn6h9y77] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-85zn6h9y77], .crud-empty-state[b-85zn6h9y77] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-85zn6h9y77] { font-size: 2rem; }
.crud-spinner[b-85zn6h9y77] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-85zn6h9y77 0.6s linear infinite; }
.crud-spinner-sm[b-85zn6h9y77] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-85zn6h9y77 0.6s linear infinite; }
@keyframes spin-b-85zn6h9y77 { to { transform: rotate(360deg); } }
.spin[b-85zn6h9y77] { animation: spin-b-85zn6h9y77 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-85zn6h9y77] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-85zn6h9y77 0.15s ease-out; }
.modal-container[b-85zn6h9y77] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-85zn6h9y77] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-85zn6h9y77 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-85zn6h9y77] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-85zn6h9y77] { max-width: 420px; }
@keyframes fadeIn-b-85zn6h9y77 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-85zn6h9y77 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-85zn6h9y77] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-85zn6h9y77] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-85zn6h9y77] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-85zn6h9y77] { color: #dc2626; }
.modal-close[b-85zn6h9y77] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-85zn6h9y77] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-85zn6h9y77] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-85zn6h9y77] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-85zn6h9y77] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-85zn6h9y77] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-85zn6h9y77] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-85zn6h9y77] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-85zn6h9y77] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-85zn6h9y77] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-85zn6h9y77] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-85zn6h9y77] { flex: 2; }
.form-group label[b-85zn6h9y77] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-85zn6h9y77], .form-group select[b-85zn6h9y77], .form-textarea[b-85zn6h9y77] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-85zn6h9y77], .form-group select:focus[b-85zn6h9y77], .form-textarea:focus[b-85zn6h9y77] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-85zn6h9y77] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-85zn6h9y77] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-85zn6h9y77] { flex: 1; display: flex; align-items: center; }
.form-check[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-85zn6h9y77] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-85zn6h9y77] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-85zn6h9y77] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-85zn6h9y77] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-85zn6h9y77] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-85zn6h9y77] { font-size: 3rem; }
.photo-placeholder span[b-85zn6h9y77] { font-size: 0.78rem; }
.photo-actions[b-85zn6h9y77] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-85zn6h9y77] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-85zn6h9y77] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-85zn6h9y77] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-85zn6h9y77] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-85zn6h9y77] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-85zn6h9y77] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-85zn6h9y77] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-85zn6h9y77] { filter: brightness(1.15); transform: scale(1.05); }
[b-85zn6h9y77] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-85zn6h9y77] { padding: 0.75rem; }
    .crud-header[b-85zn6h9y77] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-85zn6h9y77] { font-size: 1.1rem; }
    .btn-text[b-85zn6h9y77] { display: none; }
    .form-row[b-85zn6h9y77] { flex-direction: column; }
    .form-row-4[b-85zn6h9y77] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-85zn6h9y77] { width: 98%; max-height: 95vh; }
    .modal-lg[b-85zn6h9y77] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-85zn6h9y77] { padding: 0.75rem; }
    .modal-tabs[b-85zn6h9y77] { overflow-x: auto; }
    .modal-tab[b-85zn6h9y77] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-85zn6h9y77] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-85zn6h9y77] { display: grid !important; }
    .crud-cards-wrapper[b-85zn6h9y77] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-85zn6h9y77] { grid-template-columns: 1fr; }
    .card-details[b-85zn6h9y77] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-85zn6h9y77] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-85zn6h9y77] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-85zn6h9y77] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-85zn6h9y77] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpcontratosodinprorenovacion.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-8kwfc0ysmj] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-8kwfc0ysmj 0.3s ease-out; }
@keyframes slideUp-b-8kwfc0ysmj { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-8kwfc0ysmj] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-8kwfc0ysmj] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-8kwfc0ysmj] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-8kwfc0ysmj] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-8kwfc0ysmj] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-8kwfc0ysmj] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-8kwfc0ysmj] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-8kwfc0ysmj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-8kwfc0ysmj] { filter: brightness(1.1); }
.btn-outline[b-8kwfc0ysmj] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-8kwfc0ysmj] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-8kwfc0ysmj] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-8kwfc0ysmj] { filter: brightness(1.1); }
.btn-icon[b-8kwfc0ysmj] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-8kwfc0ysmj] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-8kwfc0ysmj] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-8kwfc0ysmj] { color: #ef4444; }
.btn-delete:hover[b-8kwfc0ysmj] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-8kwfc0ysmj] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-8kwfc0ysmj] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-8kwfc0ysmj] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-8kwfc0ysmj] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-8kwfc0ysmj] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-8kwfc0ysmj] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-8kwfc0ysmj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-8kwfc0ysmj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-8kwfc0ysmj] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-8kwfc0ysmj] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-8kwfc0ysmj] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-8kwfc0ysmj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-8kwfc0ysmj] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-8kwfc0ysmj] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-8kwfc0ysmj] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-8kwfc0ysmj] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-8kwfc0ysmj] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-8kwfc0ysmj] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-8kwfc0ysmj] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-8kwfc0ysmj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-8kwfc0ysmj] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-8kwfc0ysmj] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-8kwfc0ysmj] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-8kwfc0ysmj] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-8kwfc0ysmj] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-8kwfc0ysmj] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-8kwfc0ysmj] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-8kwfc0ysmj] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-8kwfc0ysmj] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-8kwfc0ysmj] { display: block; }
.hide-on-cards[b-8kwfc0ysmj] { display: none !important; }
.show-on-cards[b-8kwfc0ysmj] { display: grid; }
.hide-on-grid[b-8kwfc0ysmj] { display: none !important; }

/* Badges */
.badge[b-8kwfc0ysmj] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-8kwfc0ysmj] { background: #ecfdf5; color: #065f46; }
.badge-no[b-8kwfc0ysmj] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-8kwfc0ysmj] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-8kwfc0ysmj] { text-align: center; }
.text-muted[b-8kwfc0ysmj] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-8kwfc0ysmj], .crud-empty-state[b-8kwfc0ysmj] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-8kwfc0ysmj] { font-size: 2rem; }
.crud-spinner[b-8kwfc0ysmj] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-8kwfc0ysmj 0.6s linear infinite; }
.crud-spinner-sm[b-8kwfc0ysmj] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-8kwfc0ysmj 0.6s linear infinite; }
@keyframes spin-b-8kwfc0ysmj { to { transform: rotate(360deg); } }
.spin[b-8kwfc0ysmj] { animation: spin-b-8kwfc0ysmj 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-8kwfc0ysmj] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-8kwfc0ysmj 0.15s ease-out; }
.modal-container[b-8kwfc0ysmj] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-8kwfc0ysmj] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-8kwfc0ysmj 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-8kwfc0ysmj] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-8kwfc0ysmj] { max-width: 420px; }
@keyframes fadeIn-b-8kwfc0ysmj { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-8kwfc0ysmj { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-8kwfc0ysmj] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-8kwfc0ysmj] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-8kwfc0ysmj] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-8kwfc0ysmj] { color: #dc2626; }
.modal-close[b-8kwfc0ysmj] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-8kwfc0ysmj] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-8kwfc0ysmj] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-8kwfc0ysmj] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-8kwfc0ysmj] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-8kwfc0ysmj] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-8kwfc0ysmj] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-8kwfc0ysmj] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-8kwfc0ysmj] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-8kwfc0ysmj] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-8kwfc0ysmj] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-8kwfc0ysmj] { flex: 2; }
.form-group label[b-8kwfc0ysmj] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-8kwfc0ysmj], .form-group select[b-8kwfc0ysmj], .form-textarea[b-8kwfc0ysmj] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-8kwfc0ysmj], .form-group select:focus[b-8kwfc0ysmj], .form-textarea:focus[b-8kwfc0ysmj] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-8kwfc0ysmj] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-8kwfc0ysmj] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-8kwfc0ysmj] { flex: 1; display: flex; align-items: center; }
.form-check[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-8kwfc0ysmj] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-8kwfc0ysmj] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-8kwfc0ysmj] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-8kwfc0ysmj] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-8kwfc0ysmj] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-8kwfc0ysmj] { font-size: 3rem; }
.photo-placeholder span[b-8kwfc0ysmj] { font-size: 0.78rem; }
.photo-actions[b-8kwfc0ysmj] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-8kwfc0ysmj] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-8kwfc0ysmj] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-8kwfc0ysmj] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-8kwfc0ysmj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-8kwfc0ysmj] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-8kwfc0ysmj] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-8kwfc0ysmj] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-8kwfc0ysmj] { filter: brightness(1.15); transform: scale(1.05); }
[b-8kwfc0ysmj] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-8kwfc0ysmj] { padding: 0.75rem; }
    .crud-header[b-8kwfc0ysmj] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-8kwfc0ysmj] { font-size: 1.1rem; }
    .btn-text[b-8kwfc0ysmj] { display: none; }
    .form-row[b-8kwfc0ysmj] { flex-direction: column; }
    .form-row-4[b-8kwfc0ysmj] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-8kwfc0ysmj] { width: 98%; max-height: 95vh; }
    .modal-lg[b-8kwfc0ysmj] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-8kwfc0ysmj] { padding: 0.75rem; }
    .modal-tabs[b-8kwfc0ysmj] { overflow-x: auto; }
    .modal-tab[b-8kwfc0ysmj] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-8kwfc0ysmj] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-8kwfc0ysmj] { display: grid !important; }
    .crud-cards-wrapper[b-8kwfc0ysmj] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-8kwfc0ysmj] { grid-template-columns: 1fr; }
    .card-details[b-8kwfc0ysmj] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-8kwfc0ysmj] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-8kwfc0ysmj] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-8kwfc0ysmj] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-8kwfc0ysmj] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpemisionfactura.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-h6f1rph2h8] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-h6f1rph2h8 0.3s ease-out; }
@keyframes slideUp-b-h6f1rph2h8 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-h6f1rph2h8] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-h6f1rph2h8] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-h6f1rph2h8] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-h6f1rph2h8] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-h6f1rph2h8] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-h6f1rph2h8] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-h6f1rph2h8] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-h6f1rph2h8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-h6f1rph2h8] { filter: brightness(1.1); }
.btn-outline[b-h6f1rph2h8] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-h6f1rph2h8] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-h6f1rph2h8] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-h6f1rph2h8] { filter: brightness(1.1); }
.btn-icon[b-h6f1rph2h8] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-h6f1rph2h8] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-h6f1rph2h8] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-h6f1rph2h8] { color: #ef4444; }
.btn-delete:hover[b-h6f1rph2h8] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-h6f1rph2h8] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-h6f1rph2h8] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-h6f1rph2h8] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-h6f1rph2h8] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-h6f1rph2h8] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-h6f1rph2h8] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-h6f1rph2h8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-h6f1rph2h8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-h6f1rph2h8] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-h6f1rph2h8] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-h6f1rph2h8] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-h6f1rph2h8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-h6f1rph2h8] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-h6f1rph2h8] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-h6f1rph2h8] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-h6f1rph2h8] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-h6f1rph2h8] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-h6f1rph2h8] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-h6f1rph2h8] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-h6f1rph2h8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-h6f1rph2h8] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-h6f1rph2h8] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-h6f1rph2h8] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-h6f1rph2h8] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-h6f1rph2h8] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-h6f1rph2h8] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-h6f1rph2h8] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-h6f1rph2h8] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-h6f1rph2h8] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-h6f1rph2h8] { display: block; }
.hide-on-cards[b-h6f1rph2h8] { display: none !important; }
.show-on-cards[b-h6f1rph2h8] { display: grid; }
.hide-on-grid[b-h6f1rph2h8] { display: none !important; }

/* Badges */
.badge[b-h6f1rph2h8] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-h6f1rph2h8] { background: #ecfdf5; color: #065f46; }
.badge-no[b-h6f1rph2h8] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-h6f1rph2h8] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-h6f1rph2h8] { text-align: center; }
.text-muted[b-h6f1rph2h8] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-h6f1rph2h8], .crud-empty-state[b-h6f1rph2h8] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-h6f1rph2h8] { font-size: 2rem; }
.crud-spinner[b-h6f1rph2h8] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-h6f1rph2h8 0.6s linear infinite; }
.crud-spinner-sm[b-h6f1rph2h8] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-h6f1rph2h8 0.6s linear infinite; }
@keyframes spin-b-h6f1rph2h8 { to { transform: rotate(360deg); } }
.spin[b-h6f1rph2h8] { animation: spin-b-h6f1rph2h8 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-h6f1rph2h8] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-h6f1rph2h8 0.15s ease-out; }
.modal-container[b-h6f1rph2h8] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-h6f1rph2h8] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-h6f1rph2h8 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-h6f1rph2h8] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-h6f1rph2h8] { max-width: 420px; }
@keyframes fadeIn-b-h6f1rph2h8 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-h6f1rph2h8 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-h6f1rph2h8] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-h6f1rph2h8] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-h6f1rph2h8] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-h6f1rph2h8] { color: #dc2626; }
.modal-close[b-h6f1rph2h8] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-h6f1rph2h8] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-h6f1rph2h8] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-h6f1rph2h8] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-h6f1rph2h8] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-h6f1rph2h8] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-h6f1rph2h8] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-h6f1rph2h8] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-h6f1rph2h8] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-h6f1rph2h8] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-h6f1rph2h8] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-h6f1rph2h8] { flex: 2; }
.form-group label[b-h6f1rph2h8] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-h6f1rph2h8], .form-group select[b-h6f1rph2h8], .form-textarea[b-h6f1rph2h8] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-h6f1rph2h8], .form-group select:focus[b-h6f1rph2h8], .form-textarea:focus[b-h6f1rph2h8] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-h6f1rph2h8] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-h6f1rph2h8] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-h6f1rph2h8] { flex: 1; display: flex; align-items: center; }
.form-check[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-h6f1rph2h8] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-h6f1rph2h8] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-h6f1rph2h8] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-h6f1rph2h8] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-h6f1rph2h8] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-h6f1rph2h8] { font-size: 3rem; }
.photo-placeholder span[b-h6f1rph2h8] { font-size: 0.78rem; }
.photo-actions[b-h6f1rph2h8] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-h6f1rph2h8] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-h6f1rph2h8] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-h6f1rph2h8] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-h6f1rph2h8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-h6f1rph2h8] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-h6f1rph2h8] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-h6f1rph2h8] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-h6f1rph2h8] { filter: brightness(1.15); transform: scale(1.05); }
[b-h6f1rph2h8] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-h6f1rph2h8] { padding: 0.75rem; }
    .crud-header[b-h6f1rph2h8] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-h6f1rph2h8] { font-size: 1.1rem; }
    .btn-text[b-h6f1rph2h8] { display: none; }
    .form-row[b-h6f1rph2h8] { flex-direction: column; }
    .form-row-4[b-h6f1rph2h8] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-h6f1rph2h8] { width: 98%; max-height: 95vh; }
    .modal-lg[b-h6f1rph2h8] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-h6f1rph2h8] { padding: 0.75rem; }
    .modal-tabs[b-h6f1rph2h8] { overflow-x: auto; }
    .modal-tab[b-h6f1rph2h8] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-h6f1rph2h8] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-h6f1rph2h8] { display: grid !important; }
    .crud-cards-wrapper[b-h6f1rph2h8] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-h6f1rph2h8] { grid-template-columns: 1fr; }
    .card-details[b-h6f1rph2h8] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-h6f1rph2h8] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-h6f1rph2h8] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-h6f1rph2h8] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-h6f1rph2h8] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpfrecuenciaft.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-exrf99wkgg] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-exrf99wkgg 0.3s ease-out; }
@keyframes slideUp-b-exrf99wkgg { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-exrf99wkgg] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-exrf99wkgg] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-exrf99wkgg] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-exrf99wkgg] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-exrf99wkgg] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-exrf99wkgg] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-exrf99wkgg] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-exrf99wkgg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-exrf99wkgg] { filter: brightness(1.1); }
.btn-outline[b-exrf99wkgg] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-exrf99wkgg] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-exrf99wkgg] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-exrf99wkgg] { filter: brightness(1.1); }
.btn-icon[b-exrf99wkgg] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-exrf99wkgg] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-exrf99wkgg] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-exrf99wkgg] { color: #ef4444; }
.btn-delete:hover[b-exrf99wkgg] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-exrf99wkgg] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-exrf99wkgg] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-exrf99wkgg] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-exrf99wkgg] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-exrf99wkgg] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-exrf99wkgg] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-exrf99wkgg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-exrf99wkgg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-exrf99wkgg] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-exrf99wkgg] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-exrf99wkgg] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-exrf99wkgg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-exrf99wkgg] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-exrf99wkgg] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-exrf99wkgg] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-exrf99wkgg] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-exrf99wkgg] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-exrf99wkgg] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-exrf99wkgg] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-exrf99wkgg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-exrf99wkgg] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-exrf99wkgg] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-exrf99wkgg] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-exrf99wkgg] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-exrf99wkgg] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-exrf99wkgg] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-exrf99wkgg] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-exrf99wkgg] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-exrf99wkgg] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-exrf99wkgg] { display: block; }
.hide-on-cards[b-exrf99wkgg] { display: none !important; }
.show-on-cards[b-exrf99wkgg] { display: grid; }
.hide-on-grid[b-exrf99wkgg] { display: none !important; }

/* Badges */
.badge[b-exrf99wkgg] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-exrf99wkgg] { background: #ecfdf5; color: #065f46; }
.badge-no[b-exrf99wkgg] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-exrf99wkgg] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-exrf99wkgg] { text-align: center; }
.text-muted[b-exrf99wkgg] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-exrf99wkgg], .crud-empty-state[b-exrf99wkgg] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-exrf99wkgg] { font-size: 2rem; }
.crud-spinner[b-exrf99wkgg] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-exrf99wkgg 0.6s linear infinite; }
.crud-spinner-sm[b-exrf99wkgg] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-exrf99wkgg 0.6s linear infinite; }
@keyframes spin-b-exrf99wkgg { to { transform: rotate(360deg); } }
.spin[b-exrf99wkgg] { animation: spin-b-exrf99wkgg 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-exrf99wkgg] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-exrf99wkgg 0.15s ease-out; }
.modal-container[b-exrf99wkgg] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-exrf99wkgg] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-exrf99wkgg 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-exrf99wkgg] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-exrf99wkgg] { max-width: 420px; }
@keyframes fadeIn-b-exrf99wkgg { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-exrf99wkgg { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-exrf99wkgg] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-exrf99wkgg] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-exrf99wkgg] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-exrf99wkgg] { color: #dc2626; }
.modal-close[b-exrf99wkgg] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-exrf99wkgg] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-exrf99wkgg] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-exrf99wkgg] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-exrf99wkgg] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-exrf99wkgg] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-exrf99wkgg] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-exrf99wkgg] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-exrf99wkgg] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-exrf99wkgg] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-exrf99wkgg] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-exrf99wkgg] { flex: 2; }
.form-group label[b-exrf99wkgg] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-exrf99wkgg], .form-group select[b-exrf99wkgg], .form-textarea[b-exrf99wkgg] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-exrf99wkgg], .form-group select:focus[b-exrf99wkgg], .form-textarea:focus[b-exrf99wkgg] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-exrf99wkgg] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-exrf99wkgg] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-exrf99wkgg] { flex: 1; display: flex; align-items: center; }
.form-check[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-exrf99wkgg] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-exrf99wkgg] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-exrf99wkgg] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-exrf99wkgg] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-exrf99wkgg] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-exrf99wkgg] { font-size: 3rem; }
.photo-placeholder span[b-exrf99wkgg] { font-size: 0.78rem; }
.photo-actions[b-exrf99wkgg] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-exrf99wkgg] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-exrf99wkgg] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-exrf99wkgg] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-exrf99wkgg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-exrf99wkgg] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-exrf99wkgg] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-exrf99wkgg] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-exrf99wkgg] { filter: brightness(1.15); transform: scale(1.05); }
[b-exrf99wkgg] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-exrf99wkgg] { padding: 0.75rem; }
    .crud-header[b-exrf99wkgg] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-exrf99wkgg] { font-size: 1.1rem; }
    .btn-text[b-exrf99wkgg] { display: none; }
    .form-row[b-exrf99wkgg] { flex-direction: column; }
    .form-row-4[b-exrf99wkgg] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-exrf99wkgg] { width: 98%; max-height: 95vh; }
    .modal-lg[b-exrf99wkgg] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-exrf99wkgg] { padding: 0.75rem; }
    .modal-tabs[b-exrf99wkgg] { overflow-x: auto; }
    .modal-tab[b-exrf99wkgg] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-exrf99wkgg] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-exrf99wkgg] { display: grid !important; }
    .crud-cards-wrapper[b-exrf99wkgg] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-exrf99wkgg] { grid-template-columns: 1fr; }
    .card-details[b-exrf99wkgg] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-exrf99wkgg] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-exrf99wkgg] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-exrf99wkgg] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-exrf99wkgg] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpproductos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-fpkuc690jr] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-fpkuc690jr 0.3s ease-out; }
@keyframes slideUp-b-fpkuc690jr { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-fpkuc690jr] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-fpkuc690jr] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-fpkuc690jr] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-fpkuc690jr] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-fpkuc690jr] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-fpkuc690jr] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-fpkuc690jr] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-fpkuc690jr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-fpkuc690jr] { filter: brightness(1.1); }
.btn-outline[b-fpkuc690jr] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-fpkuc690jr] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-fpkuc690jr] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-fpkuc690jr] { filter: brightness(1.1); }
.btn-icon[b-fpkuc690jr] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-fpkuc690jr] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-fpkuc690jr] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-fpkuc690jr] { color: #ef4444; }
.btn-delete:hover[b-fpkuc690jr] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-fpkuc690jr] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-fpkuc690jr] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-fpkuc690jr] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-fpkuc690jr] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-fpkuc690jr] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-fpkuc690jr] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-fpkuc690jr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-fpkuc690jr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-fpkuc690jr] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-fpkuc690jr] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-fpkuc690jr] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-fpkuc690jr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-fpkuc690jr] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-fpkuc690jr] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-fpkuc690jr] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-fpkuc690jr] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-fpkuc690jr] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-fpkuc690jr] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-fpkuc690jr] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-fpkuc690jr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-fpkuc690jr] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-fpkuc690jr] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-fpkuc690jr] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-fpkuc690jr] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-fpkuc690jr] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-fpkuc690jr] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-fpkuc690jr] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-fpkuc690jr] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-fpkuc690jr] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-fpkuc690jr] { display: block; }
.hide-on-cards[b-fpkuc690jr] { display: none !important; }
.show-on-cards[b-fpkuc690jr] { display: grid; }
.hide-on-grid[b-fpkuc690jr] { display: none !important; }

/* Badges */
.badge[b-fpkuc690jr] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-fpkuc690jr] { background: #ecfdf5; color: #065f46; }
.badge-no[b-fpkuc690jr] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-fpkuc690jr] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-fpkuc690jr] { text-align: center; }
.text-muted[b-fpkuc690jr] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-fpkuc690jr], .crud-empty-state[b-fpkuc690jr] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-fpkuc690jr] { font-size: 2rem; }
.crud-spinner[b-fpkuc690jr] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-fpkuc690jr 0.6s linear infinite; }
.crud-spinner-sm[b-fpkuc690jr] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-fpkuc690jr 0.6s linear infinite; }
@keyframes spin-b-fpkuc690jr { to { transform: rotate(360deg); } }
.spin[b-fpkuc690jr] { animation: spin-b-fpkuc690jr 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-fpkuc690jr] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-fpkuc690jr 0.15s ease-out; }
.modal-container[b-fpkuc690jr] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-fpkuc690jr] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-fpkuc690jr 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-fpkuc690jr] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-fpkuc690jr] { max-width: 420px; }
@keyframes fadeIn-b-fpkuc690jr { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-fpkuc690jr { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-fpkuc690jr] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-fpkuc690jr] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-fpkuc690jr] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-fpkuc690jr] { color: #dc2626; }
.modal-close[b-fpkuc690jr] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-fpkuc690jr] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-fpkuc690jr] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-fpkuc690jr] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-fpkuc690jr] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-fpkuc690jr] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-fpkuc690jr] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-fpkuc690jr] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-fpkuc690jr] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-fpkuc690jr] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-fpkuc690jr] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-fpkuc690jr] { flex: 2; }
.form-group label[b-fpkuc690jr] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-fpkuc690jr], .form-group select[b-fpkuc690jr], .form-textarea[b-fpkuc690jr] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-fpkuc690jr], .form-group select:focus[b-fpkuc690jr], .form-textarea:focus[b-fpkuc690jr] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-fpkuc690jr] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-fpkuc690jr] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-fpkuc690jr] { flex: 1; display: flex; align-items: center; }
.form-check[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-fpkuc690jr] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-fpkuc690jr] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-fpkuc690jr] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-fpkuc690jr] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-fpkuc690jr] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-fpkuc690jr] { font-size: 3rem; }
.photo-placeholder span[b-fpkuc690jr] { font-size: 0.78rem; }
.photo-actions[b-fpkuc690jr] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-fpkuc690jr] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-fpkuc690jr] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-fpkuc690jr] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-fpkuc690jr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-fpkuc690jr] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-fpkuc690jr] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-fpkuc690jr] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-fpkuc690jr] { filter: brightness(1.15); transform: scale(1.05); }
[b-fpkuc690jr] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-fpkuc690jr] { padding: 0.75rem; }
    .crud-header[b-fpkuc690jr] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-fpkuc690jr] { font-size: 1.1rem; }
    .btn-text[b-fpkuc690jr] { display: none; }
    .form-row[b-fpkuc690jr] { flex-direction: column; }
    .form-row-4[b-fpkuc690jr] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-fpkuc690jr] { width: 98%; max-height: 95vh; }
    .modal-lg[b-fpkuc690jr] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-fpkuc690jr] { padding: 0.75rem; }
    .modal-tabs[b-fpkuc690jr] { overflow-x: auto; }
    .modal-tab[b-fpkuc690jr] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-fpkuc690jr] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-fpkuc690jr] { display: grid !important; }
    .crud-cards-wrapper[b-fpkuc690jr] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-fpkuc690jr] { grid-template-columns: 1fr; }
    .card-details[b-fpkuc690jr] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-fpkuc690jr] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-fpkuc690jr] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-fpkuc690jr] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-fpkuc690jr] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Sodinpro/Frmsdpreportecontratos.razor.rz.scp.css */
/* ============================================================
   Clientes â€” Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-ttmi2l117r] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-ttmi2l117r 0.3s ease-out; }
@keyframes slideUp-b-ttmi2l117r { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-ttmi2l117r] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-ttmi2l117r] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-ttmi2l117r] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-ttmi2l117r] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-ttmi2l117r] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-ttmi2l117r] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-ttmi2l117r] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-ttmi2l117r] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-ttmi2l117r] { filter: brightness(1.1); }
.btn-outline[b-ttmi2l117r] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-ttmi2l117r] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-ttmi2l117r] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-ttmi2l117r] { filter: brightness(1.1); }
.btn-icon[b-ttmi2l117r] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-ttmi2l117r] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-ttmi2l117r] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-ttmi2l117r] { color: #ef4444; }
.btn-delete:hover[b-ttmi2l117r] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-ttmi2l117r] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-ttmi2l117r] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-ttmi2l117r] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-ttmi2l117r] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-ttmi2l117r] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-ttmi2l117r] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-ttmi2l117r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-ttmi2l117r] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-ttmi2l117r] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-ttmi2l117r] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-ttmi2l117r] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-ttmi2l117r] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-ttmi2l117r] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-ttmi2l117r] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-ttmi2l117r] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-ttmi2l117r] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-ttmi2l117r] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-ttmi2l117r] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-ttmi2l117r] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-ttmi2l117r] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-ttmi2l117r] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-ttmi2l117r] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-ttmi2l117r] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-ttmi2l117r] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-ttmi2l117r] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-ttmi2l117r] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-ttmi2l117r] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-ttmi2l117r] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-ttmi2l117r] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-ttmi2l117r] { display: block; }
.hide-on-cards[b-ttmi2l117r] { display: none !important; }
.show-on-cards[b-ttmi2l117r] { display: grid; }
.hide-on-grid[b-ttmi2l117r] { display: none !important; }

/* Badges */
.badge[b-ttmi2l117r] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-ttmi2l117r] { background: #ecfdf5; color: #065f46; }
.badge-no[b-ttmi2l117r] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-ttmi2l117r] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-ttmi2l117r] { text-align: center; }
.text-muted[b-ttmi2l117r] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-ttmi2l117r], .crud-empty-state[b-ttmi2l117r] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-ttmi2l117r] { font-size: 2rem; }
.crud-spinner[b-ttmi2l117r] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-ttmi2l117r 0.6s linear infinite; }
.crud-spinner-sm[b-ttmi2l117r] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-ttmi2l117r 0.6s linear infinite; }
@keyframes spin-b-ttmi2l117r { to { transform: rotate(360deg); } }
.spin[b-ttmi2l117r] { animation: spin-b-ttmi2l117r 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-ttmi2l117r] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-ttmi2l117r 0.15s ease-out; }
.modal-container[b-ttmi2l117r] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-ttmi2l117r] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-ttmi2l117r 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body â€” se ajusta automaticamente */
.modal-lg[b-ttmi2l117r] { max-width: none; width: calc(100% - 2rem); height: calc(100vh - 100px); max-height: calc(100vh - 100px); border-radius: 0.5rem; }
.modal-sm[b-ttmi2l117r] { max-width: 420px; }
@keyframes fadeIn-b-ttmi2l117r { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-ttmi2l117r { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-ttmi2l117r] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-ttmi2l117r] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-ttmi2l117r] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-ttmi2l117r] { color: #dc2626; }
.modal-close[b-ttmi2l117r] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-ttmi2l117r] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-ttmi2l117r] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-ttmi2l117r] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-ttmi2l117r] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-ttmi2l117r] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-ttmi2l117r] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-ttmi2l117r] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-ttmi2l117r] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-ttmi2l117r] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-ttmi2l117r] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-ttmi2l117r] { flex: 2; }
.form-group label[b-ttmi2l117r] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-ttmi2l117r], .form-group select[b-ttmi2l117r], .form-textarea[b-ttmi2l117r] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-ttmi2l117r], .form-group select:focus[b-ttmi2l117r], .form-textarea:focus[b-ttmi2l117r] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-ttmi2l117r] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-ttmi2l117r] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-ttmi2l117r] { flex: 1; display: flex; align-items: center; }
.form-check[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-ttmi2l117r] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-ttmi2l117r] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-ttmi2l117r] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-ttmi2l117r] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-ttmi2l117r] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-ttmi2l117r] { font-size: 3rem; }
.photo-placeholder span[b-ttmi2l117r] { font-size: 0.78rem; }
.photo-actions[b-ttmi2l117r] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-ttmi2l117r] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto â€” solo icono */
.btn-icon-round[b-ttmi2l117r] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-ttmi2l117r] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-ttmi2l117r] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-ttmi2l117r] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-ttmi2l117r] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-ttmi2l117r] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-ttmi2l117r] { filter: brightness(1.15); transform: scale(1.05); }
[b-ttmi2l117r] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-ttmi2l117r] { padding: 0.75rem; }
    .crud-header[b-ttmi2l117r] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-ttmi2l117r] { font-size: 1.1rem; }
    .btn-text[b-ttmi2l117r] { display: none; }
    .form-row[b-ttmi2l117r] { flex-direction: column; }
    .form-row-4[b-ttmi2l117r] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-ttmi2l117r] { width: 98%; max-height: 95vh; }
    .modal-lg[b-ttmi2l117r] { max-width: 98vw; width: 98vw; height: 95vh; max-height: 95vh; }
    .modal-body[b-ttmi2l117r] { padding: 0.75rem; }
    .modal-tabs[b-ttmi2l117r] { overflow-x: auto; }
    .modal-tab[b-ttmi2l117r] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-ttmi2l117r] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-ttmi2l117r] { display: grid !important; }
    .crud-cards-wrapper[b-ttmi2l117r] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-ttmi2l117r] { grid-template-columns: 1fr; }
    .card-details[b-ttmi2l117r] { flex-direction: column; gap: 0.35rem; }
}

/* â”€â”€ BotÃ³n Ayuda â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.btn-help[b-ttmi2l117r] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-ttmi2l117r] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-ttmi2l117r] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-ttmi2l117r] { background:rgba(37,99,235,.25); }
/* _content/Rgclouds.Web/Components/Pages/Superchat/Frmsch_agentes.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-p6kupc45h7] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-p6kupc45h7 0.3s ease-out; }
@keyframes slideUp-b-p6kupc45h7 { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-p6kupc45h7] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-p6kupc45h7] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-p6kupc45h7] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-p6kupc45h7] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-p6kupc45h7] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-p6kupc45h7] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-p6kupc45h7] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-p6kupc45h7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-p6kupc45h7] { filter: brightness(1.1); }
.btn-outline[b-p6kupc45h7] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-p6kupc45h7] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-p6kupc45h7] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-p6kupc45h7] { filter: brightness(1.1); }
.btn-icon[b-p6kupc45h7] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-p6kupc45h7] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-p6kupc45h7] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-p6kupc45h7] { color: #ef4444; }
.btn-delete:hover[b-p6kupc45h7] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-p6kupc45h7] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-p6kupc45h7] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-p6kupc45h7] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-p6kupc45h7] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-p6kupc45h7] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-p6kupc45h7] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-p6kupc45h7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-p6kupc45h7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-p6kupc45h7] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-p6kupc45h7] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-p6kupc45h7] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-p6kupc45h7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-p6kupc45h7] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-p6kupc45h7] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-p6kupc45h7] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-p6kupc45h7] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-p6kupc45h7] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-p6kupc45h7] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-p6kupc45h7] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-p6kupc45h7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-p6kupc45h7] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-p6kupc45h7] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-p6kupc45h7] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-p6kupc45h7] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-p6kupc45h7] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-p6kupc45h7] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-p6kupc45h7] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-p6kupc45h7] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-p6kupc45h7] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-p6kupc45h7] { display: block; }
.hide-on-cards[b-p6kupc45h7] { display: none !important; }
.show-on-cards[b-p6kupc45h7] { display: grid; }
.hide-on-grid[b-p6kupc45h7] { display: none !important; }

/* Badges */
.badge[b-p6kupc45h7] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-p6kupc45h7] { background: #ecfdf5; color: #065f46; }
.badge-no[b-p6kupc45h7] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-p6kupc45h7] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-p6kupc45h7] { text-align: center; }
.text-muted[b-p6kupc45h7] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-p6kupc45h7], .crud-empty-state[b-p6kupc45h7] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-p6kupc45h7] { font-size: 2rem; }
.crud-spinner[b-p6kupc45h7] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-p6kupc45h7 0.6s linear infinite; }
.crud-spinner-sm[b-p6kupc45h7] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-p6kupc45h7 0.6s linear infinite; }
@keyframes spin-b-p6kupc45h7 { to { transform: rotate(360deg); } }
.spin[b-p6kupc45h7] { animation: spin-b-p6kupc45h7 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-p6kupc45h7] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-p6kupc45h7 0.15s ease-out; }
.modal-container[b-p6kupc45h7] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-p6kupc45h7] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-p6kupc45h7 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-p6kupc45h7] { max-width: 820px; }
.modal-sm[b-p6kupc45h7] { max-width: 420px; }
@keyframes fadeIn-b-p6kupc45h7 { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-p6kupc45h7 { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-p6kupc45h7] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-p6kupc45h7] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-p6kupc45h7] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-p6kupc45h7] { color: #dc2626; }
.modal-close[b-p6kupc45h7] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-p6kupc45h7] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-p6kupc45h7] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-p6kupc45h7] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-p6kupc45h7] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-p6kupc45h7] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-p6kupc45h7] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-p6kupc45h7] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-p6kupc45h7] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-p6kupc45h7] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-p6kupc45h7] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-p6kupc45h7] { flex: 2; }
.form-group label[b-p6kupc45h7] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-p6kupc45h7], .form-group select[b-p6kupc45h7], .form-textarea[b-p6kupc45h7] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-p6kupc45h7], .form-group select:focus[b-p6kupc45h7], .form-textarea:focus[b-p6kupc45h7] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-p6kupc45h7] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-p6kupc45h7] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-p6kupc45h7] { flex: 1; display: flex; align-items: center; }
.form-check[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-p6kupc45h7] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-p6kupc45h7] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-p6kupc45h7] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-p6kupc45h7] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-p6kupc45h7] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-p6kupc45h7] { font-size: 3rem; }
.photo-placeholder span[b-p6kupc45h7] { font-size: 0.78rem; }
.photo-actions[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-p6kupc45h7] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-p6kupc45h7] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-p6kupc45h7] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-p6kupc45h7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-p6kupc45h7] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-p6kupc45h7] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-p6kupc45h7] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-p6kupc45h7] { filter: brightness(1.15); transform: scale(1.05); }
[b-p6kupc45h7] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-p6kupc45h7] { padding: 0.75rem; }
    .crud-header[b-p6kupc45h7] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-p6kupc45h7] { font-size: 1.1rem; }
    .btn-text[b-p6kupc45h7] { display: none; }
    .form-row[b-p6kupc45h7] { flex-direction: column; }
    .form-row-4[b-p6kupc45h7] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-p6kupc45h7] { width: 98%; max-height: 95vh; }
    .modal-lg[b-p6kupc45h7] { max-width: 820px; }
    .modal-body[b-p6kupc45h7] { padding: 0.75rem; }
    .modal-tabs[b-p6kupc45h7] { overflow-x: auto; }
    .modal-tab[b-p6kupc45h7] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-p6kupc45h7] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-p6kupc45h7] { display: grid !important; }
    .crud-cards-wrapper[b-p6kupc45h7] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-p6kupc45h7] { grid-template-columns: 1fr; }
    .card-details[b-p6kupc45h7] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-p6kupc45h7] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-p6kupc45h7] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-p6kupc45h7] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-p6kupc45h7] { background:rgba(37,99,235,.25); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-p6kupc45h7] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-p6kupc45h7] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-p6kupc45h7] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-p6kupc45h7] { border-bottom: none; }
.help-section p[b-p6kupc45h7] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-p6kupc45h7], .help-section ol[b-p6kupc45h7] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-p6kupc45h7] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-p6kupc45h7] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-p6kupc45h7] { color: var(--rg-accent,#2563eb); }
.help-example[b-p6kupc45h7] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-p6kupc45h7] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-p6kupc45h7] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-p6kupc45h7] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-p6kupc45h7] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-p6kupc45h7] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-p6kupc45h7] { background: rgba(37,99,235,0.12); }
.help-steps[b-p6kupc45h7] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-p6kupc45h7] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-p6kupc45h7] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-p6kupc45h7] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-p6kupc45h7] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-p6kupc45h7] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-p6kupc45h7] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-p6kupc45h7] { background: rgba(255,255,255,0.04); }
.help-badge[b-p6kupc45h7] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-p6kupc45h7] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-p6kupc45h7] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-p6kupc45h7] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-p6kupc45h7] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-p6kupc45h7] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-p6kupc45h7] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-p6kupc45h7] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-p6kupc45h7] { color: #fca5a5; }

/* ── Específico de Agentes ───────────────────────────────────────────── */
.scag-avatar[b-p6kupc45h7] { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(37,99,235,0.14); color: var(--rg-accent, #2563eb); font-weight: 700; font-size: .72rem; }
.form-hint[b-p6kupc45h7] { display: block; font-size: .72rem; color: var(--rg-text-muted); margin-top: .2rem; }
.form-hint i[b-p6kupc45h7] { margin-right: .2rem; }
/* _content/Rgclouds.Web/Components/Pages/Superchat/Frmsch_cuentas.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-r7po1da1tp] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-r7po1da1tp 0.3s ease-out; }
@keyframes slideUp-b-r7po1da1tp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-r7po1da1tp] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-r7po1da1tp] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-r7po1da1tp] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-r7po1da1tp] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-r7po1da1tp] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-r7po1da1tp] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-r7po1da1tp] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-r7po1da1tp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-r7po1da1tp] { filter: brightness(1.1); }
.btn-outline[b-r7po1da1tp] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-r7po1da1tp] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-r7po1da1tp] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-r7po1da1tp] { filter: brightness(1.1); }
.btn-icon[b-r7po1da1tp] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-r7po1da1tp] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-r7po1da1tp] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-r7po1da1tp] { color: #ef4444; }
.btn-delete:hover[b-r7po1da1tp] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-r7po1da1tp] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-r7po1da1tp] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-r7po1da1tp] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-r7po1da1tp] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-r7po1da1tp] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-r7po1da1tp] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-r7po1da1tp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-r7po1da1tp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-r7po1da1tp] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-r7po1da1tp] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-r7po1da1tp] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-r7po1da1tp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-r7po1da1tp] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-r7po1da1tp] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-r7po1da1tp] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-r7po1da1tp] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-r7po1da1tp] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-r7po1da1tp] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-r7po1da1tp] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-r7po1da1tp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-r7po1da1tp] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-r7po1da1tp] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-r7po1da1tp] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-r7po1da1tp] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-r7po1da1tp] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-r7po1da1tp] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-r7po1da1tp] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-r7po1da1tp] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-r7po1da1tp] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-r7po1da1tp] { display: block; }
.hide-on-cards[b-r7po1da1tp] { display: none !important; }
.show-on-cards[b-r7po1da1tp] { display: grid; }
.hide-on-grid[b-r7po1da1tp] { display: none !important; }

/* Badges */
.badge[b-r7po1da1tp] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-r7po1da1tp] { background: #ecfdf5; color: #065f46; }
.badge-no[b-r7po1da1tp] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-r7po1da1tp] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-r7po1da1tp] { text-align: center; }
.text-muted[b-r7po1da1tp] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-r7po1da1tp], .crud-empty-state[b-r7po1da1tp] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-r7po1da1tp] { font-size: 2rem; }
.crud-spinner[b-r7po1da1tp] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-r7po1da1tp 0.6s linear infinite; }
.crud-spinner-sm[b-r7po1da1tp] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-r7po1da1tp 0.6s linear infinite; }
@keyframes spin-b-r7po1da1tp { to { transform: rotate(360deg); } }
.spin[b-r7po1da1tp] { animation: spin-b-r7po1da1tp 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-r7po1da1tp] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-r7po1da1tp 0.15s ease-out; }
.modal-container[b-r7po1da1tp] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-r7po1da1tp] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-r7po1da1tp 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-r7po1da1tp] { max-width: 820px; }
.modal-sm[b-r7po1da1tp] { max-width: 420px; }
@keyframes fadeIn-b-r7po1da1tp { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-r7po1da1tp { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-r7po1da1tp] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-r7po1da1tp] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-r7po1da1tp] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-r7po1da1tp] { color: #dc2626; }
.modal-close[b-r7po1da1tp] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-r7po1da1tp] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-r7po1da1tp] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-r7po1da1tp] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-r7po1da1tp] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-r7po1da1tp] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-r7po1da1tp] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-r7po1da1tp] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-r7po1da1tp] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-r7po1da1tp] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-r7po1da1tp] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-r7po1da1tp] { flex: 2; }
.form-group label[b-r7po1da1tp] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-r7po1da1tp], .form-group select[b-r7po1da1tp], .form-textarea[b-r7po1da1tp] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-r7po1da1tp], .form-group select:focus[b-r7po1da1tp], .form-textarea:focus[b-r7po1da1tp] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-r7po1da1tp] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-r7po1da1tp] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-r7po1da1tp] { flex: 1; display: flex; align-items: center; }
.form-check[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-r7po1da1tp] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-r7po1da1tp] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-r7po1da1tp] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-r7po1da1tp] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-r7po1da1tp] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-r7po1da1tp] { font-size: 3rem; }
.photo-placeholder span[b-r7po1da1tp] { font-size: 0.78rem; }
.photo-actions[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-r7po1da1tp] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-r7po1da1tp] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-r7po1da1tp] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-r7po1da1tp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-r7po1da1tp] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-r7po1da1tp] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-r7po1da1tp] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-r7po1da1tp] { filter: brightness(1.15); transform: scale(1.05); }
[b-r7po1da1tp] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-r7po1da1tp] { padding: 0.75rem; }
    .crud-header[b-r7po1da1tp] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-r7po1da1tp] { font-size: 1.1rem; }
    .btn-text[b-r7po1da1tp] { display: none; }
    .form-row[b-r7po1da1tp] { flex-direction: column; }
    .form-row-4[b-r7po1da1tp] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-r7po1da1tp] { width: 98%; max-height: 95vh; }
    .modal-lg[b-r7po1da1tp] { max-width: 820px; }
    .modal-body[b-r7po1da1tp] { padding: 0.75rem; }
    .modal-tabs[b-r7po1da1tp] { overflow-x: auto; }
    .modal-tab[b-r7po1da1tp] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-r7po1da1tp] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-r7po1da1tp] { display: grid !important; }
    .crud-cards-wrapper[b-r7po1da1tp] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-r7po1da1tp] { grid-template-columns: 1fr; }
    .card-details[b-r7po1da1tp] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-r7po1da1tp] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-r7po1da1tp] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-r7po1da1tp] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-r7po1da1tp] { background:rgba(37,99,235,.25); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-r7po1da1tp] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-r7po1da1tp] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-r7po1da1tp] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-r7po1da1tp] { border-bottom: none; }
.help-section p[b-r7po1da1tp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-r7po1da1tp], .help-section ol[b-r7po1da1tp] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-r7po1da1tp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-r7po1da1tp] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-r7po1da1tp] { color: var(--rg-accent,#2563eb); }
.help-example[b-r7po1da1tp] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-r7po1da1tp] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-r7po1da1tp] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-r7po1da1tp] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-r7po1da1tp] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-r7po1da1tp] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-r7po1da1tp] { background: rgba(37,99,235,0.12); }
.help-steps[b-r7po1da1tp] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-r7po1da1tp] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-r7po1da1tp] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-r7po1da1tp] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-r7po1da1tp] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-r7po1da1tp] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-r7po1da1tp] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-r7po1da1tp] { background: rgba(255,255,255,0.04); }
.help-badge[b-r7po1da1tp] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-r7po1da1tp] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-r7po1da1tp] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-r7po1da1tp] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-r7po1da1tp] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-r7po1da1tp] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-r7po1da1tp] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-r7po1da1tp] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-r7po1da1tp] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Pages/Superchat/Frmsch_equipos.razor.rz.scp.css */
/* ============================================================
   Clientes — Estilos CRUD + Cards + Tabs + Foto + Responsive
   ============================================================ */

.crud-container[b-51d5oanmgu] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-51d5oanmgu 0.3s ease-out; }
@keyframes slideUp-b-51d5oanmgu { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* Header */
.crud-header[b-51d5oanmgu] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-51d5oanmgu] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-51d5oanmgu] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-51d5oanmgu] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-51d5oanmgu] { display: flex; gap: 0.5rem; }

/* Buttons */
.btn-crud[b-51d5oanmgu] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-51d5oanmgu] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-51d5oanmgu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-51d5oanmgu] { filter: brightness(1.1); }
.btn-outline[b-51d5oanmgu] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-51d5oanmgu] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-51d5oanmgu] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-51d5oanmgu] { filter: brightness(1.1); }
.btn-icon[b-51d5oanmgu] { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; transition: all 0.15s; background: transparent; }
.btn-edit[b-51d5oanmgu] { color: var(--rg-accent, #4f46e5); }
.btn-edit:hover[b-51d5oanmgu] { background: rgba(79, 70, 229, 0.1); }
.btn-delete[b-51d5oanmgu] { color: #ef4444; }
.btn-delete:hover[b-51d5oanmgu] { background: rgba(239, 68, 68, 0.1); }
.view-toggle[b-51d5oanmgu] { padding: 0.5rem 0.65rem; }

/* Alert */
.crud-alert[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-51d5oanmgu] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-51d5oanmgu] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-51d5oanmgu] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }

/* Search */
.crud-search-bar[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; margin-bottom: 0.75rem; background: var(--rg-bg-card, #fff); }
.crud-search-bar i[b-51d5oanmgu] { color: var(--rg-text-muted, #94a3b8); }
.crud-search-bar input[b-51d5oanmgu] { flex: 1; border: none; outline: none; font-size: 0.8rem; background: transparent; color: var(--rg-text-primary, #1e293b); }
.crud-search-clear[b-51d5oanmgu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); }
.crud-count[b-51d5oanmgu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; }

/* Grid */
.crud-grid-wrapper[b-51d5oanmgu] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.5rem; overflow: auto; background: var(--rg-bg-card, #fff); max-height: calc(100vh - 280px); }
.crud-table[b-51d5oanmgu] { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
.crud-table thead[b-51d5oanmgu] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-51d5oanmgu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-secondary, #475569); font-weight: 600; text-align: left; padding: 0.625rem 0.75rem; border-bottom: 2px solid var(--rg-border, #e2e8f0); white-space: nowrap; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.crud-table td[b-51d5oanmgu] { padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); color: var(--rg-text-primary, #1e293b); vertical-align: middle; }
.crud-table tbody tr:hover[b-51d5oanmgu] { background: var(--rg-bg-hover, #f8fafc); }
.col-actions[b-51d5oanmgu] { width: 80px; text-align: center; white-space: nowrap; }

/* Client photo mini */
.client-photo-sm[b-51d5oanmgu] { width: 32px; height: 32px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-text-muted, #94a3b8); font-size: 1.25rem; }
.client-card-photo[b-51d5oanmgu] { width: 40px; height: 40px; border-radius: 50%; background: var(--rg-bg-sidebar, #f1f5f9); display: flex; align-items: center; justify-content: center; color: var(--rg-accent, #4f46e5); font-size: 1.5rem; flex-shrink: 0; }

/* Cards */
.crud-cards-wrapper[b-51d5oanmgu] { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0.75rem; max-height: calc(100vh - 280px); overflow-y: auto; padding: 0.25rem; }
.crud-card[b-51d5oanmgu] { background: var(--rg-bg-card, #fff); border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.625rem; padding: 0.875rem; transition: all 0.15s; display: flex; flex-direction: column; gap: 0.5rem; }
.crud-card:hover[b-51d5oanmgu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.card-header-row[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.75rem; }
.card-header-info[b-51d5oanmgu] { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.card-id[b-51d5oanmgu] { font-size: 0.72rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); }
.card-badges[b-51d5oanmgu] { display: flex; gap: 0.35rem; flex-shrink: 0; }
.card-title[b-51d5oanmgu] { font-size: 0.85rem; font-weight: 600; color: var(--rg-text-primary, #1e293b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-details[b-51d5oanmgu] { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.card-detail[b-51d5oanmgu] { display: flex; flex-direction: column; gap: 0.1rem; }
.card-label[b-51d5oanmgu] { font-size: 0.65rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.03em; }
.card-value[b-51d5oanmgu] { font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.card-actions[b-51d5oanmgu] { display: flex; justify-content: flex-end; gap: 0.25rem; margin-top: auto; padding-top: 0.5rem; border-top: 1px solid var(--rg-border-light, #f1f5f9); }

/* View toggle */
.show-on-grid[b-51d5oanmgu] { display: block; }
.hide-on-cards[b-51d5oanmgu] { display: none !important; }
.show-on-cards[b-51d5oanmgu] { display: grid; }
.hide-on-grid[b-51d5oanmgu] { display: none !important; }

/* Badges */
.badge[b-51d5oanmgu] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.5rem; border-radius: 1rem; font-size: 0.68rem; font-weight: 600; }
.badge-yes[b-51d5oanmgu] { background: #ecfdf5; color: #065f46; }
.badge-no[b-51d5oanmgu] { background: #f1f5f9; color: #64748b; }

/* Utilities */
.font-mono[b-51d5oanmgu] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.76rem; }
.text-center[b-51d5oanmgu] { text-align: center; }
.text-muted[b-51d5oanmgu] { color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }

/* Loading / Empty */
.crud-loading[b-51d5oanmgu], .crud-empty-state[b-51d5oanmgu] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; gap: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-empty-state i[b-51d5oanmgu] { font-size: 2rem; }
.crud-spinner[b-51d5oanmgu] { width: 2rem; height: 2rem; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-51d5oanmgu 0.6s linear infinite; }
.crud-spinner-sm[b-51d5oanmgu] { display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-51d5oanmgu 0.6s linear infinite; }
@keyframes spin-b-51d5oanmgu { to { transform: rotate(360deg); } }
.spin[b-51d5oanmgu] { animation: spin-b-51d5oanmgu 0.8s linear infinite; }

/* Modal (sibling pattern) */
.modal-backdrop[b-51d5oanmgu] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); z-index: 1000; animation: fadeIn-b-51d5oanmgu 0.15s ease-out; }
.modal-container[b-51d5oanmgu] { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 1001; pointer-events: none; }
.modal-dialog[b-51d5oanmgu] { pointer-events: auto; background: var(--rg-bg-card, #fff); border-radius: 0.75rem; width: 95%; max-width: 640px; max-height: 90vh; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,0.2); animation: scaleIn-b-51d5oanmgu 0.2s ease-out; }
/* modal-lg: ocupa toda el area del body — se ajusta automaticamente */
.modal-lg[b-51d5oanmgu] { max-width: 820px; }
.modal-sm[b-51d5oanmgu] { max-width: 420px; }
@keyframes fadeIn-b-51d5oanmgu { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn-b-51d5oanmgu { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

.modal-header[b-51d5oanmgu] { display: flex; justify-content: space-between; align-items: center; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.modal-header h2[b-51d5oanmgu] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); display: flex; align-items: center; gap: 0.5rem; }
.modal-header-danger[b-51d5oanmgu] { border-bottom-color: #fecaca; }
.modal-header-danger h2[b-51d5oanmgu] { color: #dc2626; }
.modal-close[b-51d5oanmgu] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); font-size: 1rem; padding: 0.25rem; border-radius: 0.25rem; }
.modal-close:hover[b-51d5oanmgu] { color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-hover, #f1f5f9); }
.modal-body[b-51d5oanmgu] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-51d5oanmgu] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.625rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }

/* Tabs */
.modal-tabs[b-51d5oanmgu] { display: flex; gap: 0; border-bottom: 2px solid var(--rg-border, #e2e8f0); margin-bottom: 1rem; }
.modal-tab[b-51d5oanmgu] { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.78rem; font-weight: 600; color: var(--rg-text-muted, #94a3b8); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all 0.15s; display: flex; align-items: center; gap: 0.35rem; }
.modal-tab:hover[b-51d5oanmgu] { color: var(--rg-text-primary, #1e293b); }
.modal-tab.active[b-51d5oanmgu] { color: var(--rg-accent, #4f46e5); border-bottom-color: var(--rg-accent, #4f46e5); }

/* Form */
.form-row[b-51d5oanmgu] { display: flex; gap: 0.6rem; margin-bottom: 0.5rem; }
.form-row-4[b-51d5oanmgu] { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.6rem; margin-bottom: 0.5rem; }
.form-group[b-51d5oanmgu] { flex: 1; display: flex; flex-direction: column; gap: 0.15rem; }
.form-group.flex-2[b-51d5oanmgu] { flex: 2; }
.form-group label[b-51d5oanmgu] { font-size: 0.68rem; font-weight: 600; color: var(--rg-text-secondary, #475569); text-transform: uppercase; letter-spacing: 0.03em; }
.form-group input[b-51d5oanmgu], .form-group select[b-51d5oanmgu], .form-textarea[b-51d5oanmgu] { padding: 0.375rem 0.5rem; border: 1px solid var(--rg-border, #e2e8f0); border-radius: 0.375rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); background: var(--rg-bg-card, #fff); outline: none; transition: border-color 0.15s; }
.form-group input:focus[b-51d5oanmgu], .form-group select:focus[b-51d5oanmgu], .form-textarea:focus[b-51d5oanmgu] { border-color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15); }
.form-group input.readonly[b-51d5oanmgu] { background: var(--rg-bg-sidebar, #f8fafc); color: var(--rg-text-muted, #94a3b8); }
.form-textarea[b-51d5oanmgu] { width: 100%; resize: vertical; font-family: inherit; }
.form-check-group[b-51d5oanmgu] { flex: 1; display: flex; align-items: center; }
.form-check[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.form-check input[type="checkbox"][b-51d5oanmgu] { width: 1rem; height: 1rem; accent-color: var(--rg-accent, #4f46e5); }

/* Photo Section */
.photo-section[b-51d5oanmgu] { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 0.75rem 0; }
.photo-preview[b-51d5oanmgu] { width: 160px; height: 160px; border-radius: 0.75rem; border: 2px dashed var(--rg-border, #e2e8f0); overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-sidebar, #f8fafc); }
.photo-preview img[b-51d5oanmgu] { width: 100%; height: 100%; object-fit: cover; }
.photo-placeholder[b-51d5oanmgu] { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--rg-text-muted, #94a3b8); }
.photo-placeholder i[b-51d5oanmgu] { font-size: 3rem; }
.photo-placeholder span[b-51d5oanmgu] { font-size: 0.78rem; }
.photo-actions[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.75rem; justify-content: center; }
.photo-hint[b-51d5oanmgu] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); text-align: center; }

/* Botones redondos de foto — solo icono */
.btn-icon-round[b-51d5oanmgu] { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border: none; border-radius: 50%; font-size: 1.1rem; cursor: pointer; transition: all 0.15s; }
.btn-photo-select[b-51d5oanmgu] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-photo-select:hover[b-51d5oanmgu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-camera[b-51d5oanmgu] { background: #10b981; color: #fff; }
.btn-photo-camera:hover[b-51d5oanmgu] { filter: brightness(1.15); transform: scale(1.05); }
.btn-photo-remove[b-51d5oanmgu] { background: #ef4444; color: #fff; }
.btn-photo-remove:hover[b-51d5oanmgu] { filter: brightness(1.15); transform: scale(1.05); }
[b-51d5oanmgu] .file-input-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* Responsive */
@media (max-width: 768px) {
    .crud-container[b-51d5oanmgu] { padding: 0.75rem; }
    .crud-header[b-51d5oanmgu] { flex-direction: column; align-items: flex-start; }
    .crud-title[b-51d5oanmgu] { font-size: 1.1rem; }
    .btn-text[b-51d5oanmgu] { display: none; }
    .form-row[b-51d5oanmgu] { flex-direction: column; }
    .form-row-4[b-51d5oanmgu] { grid-template-columns: repeat(2, 1fr); }
    .modal-dialog[b-51d5oanmgu] { width: 98%; max-height: 95vh; }
    .modal-lg[b-51d5oanmgu] { max-width: 820px; }
    .modal-body[b-51d5oanmgu] { padding: 0.75rem; }
    .modal-tabs[b-51d5oanmgu] { overflow-x: auto; }
    .modal-tab[b-51d5oanmgu] { font-size: 0.72rem; padding: 0.5rem 0.65rem; white-space: nowrap; }

    .crud-grid-wrapper.show-on-grid[b-51d5oanmgu] { display: none !important; }
    .crud-cards-wrapper.hide-on-grid[b-51d5oanmgu] { display: grid !important; }
    .crud-cards-wrapper[b-51d5oanmgu] { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .crud-cards-wrapper[b-51d5oanmgu] { grid-template-columns: 1fr; }
    .card-details[b-51d5oanmgu] { flex-direction: column; gap: 0.35rem; }
}

/* ── Botón Ayuda ─────────────────────────────────────────────────────── */
.btn-help[b-51d5oanmgu] { background:rgba(37,99,235,.08);color:var(--rg-accent,#2563eb);border:1px solid rgba(37,99,235,.25);padding:.45rem .65rem;border-radius:.5rem;font-size:.9rem;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center; }
.btn-help:hover[b-51d5oanmgu] { background:rgba(37,99,235,.16);border-color:rgba(37,99,235,.5); }
[data-mode="dark"] .btn-help[b-51d5oanmgu] { background:rgba(37,99,235,.15);color:#93c5fd;border-color:rgba(37,99,235,.35); }
[data-mode="dark"] .btn-help:hover[b-51d5oanmgu] { background:rgba(37,99,235,.25); }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-51d5oanmgu] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-51d5oanmgu] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-51d5oanmgu] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-51d5oanmgu] { border-bottom: none; }
.help-section p[b-51d5oanmgu] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-51d5oanmgu], .help-section ol[b-51d5oanmgu] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-51d5oanmgu] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-51d5oanmgu] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-51d5oanmgu] { color: var(--rg-accent,#2563eb); }
.help-example[b-51d5oanmgu] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-51d5oanmgu] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-51d5oanmgu] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-51d5oanmgu] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-51d5oanmgu] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-51d5oanmgu] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-51d5oanmgu] { background: rgba(37,99,235,0.12); }
.help-steps[b-51d5oanmgu] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-51d5oanmgu] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-51d5oanmgu] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-51d5oanmgu] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-51d5oanmgu] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-51d5oanmgu] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-51d5oanmgu] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-51d5oanmgu] { background: rgba(255,255,255,0.04); }
.help-badge[b-51d5oanmgu] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-51d5oanmgu] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-51d5oanmgu] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-51d5oanmgu] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-51d5oanmgu] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-51d5oanmgu] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-51d5oanmgu] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-51d5oanmgu] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-51d5oanmgu] { color: #fca5a5; }

/* ── Específico de Equipos ───────────────────────────────────────────── */
.sceq-icono[b-51d5oanmgu] { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: rgba(37,99,235,0.12); color: var(--rg-accent, #2563eb); }
.sceq-section-title[b-51d5oanmgu] { display: flex; align-items: center; gap: .45rem; font-size: .85rem; font-weight: 700; color: var(--rg-text-primary); margin: .9rem 0 .5rem; padding-top: .6rem; border-top: 1px solid var(--rg-border); }
.sceq-section-title i[b-51d5oanmgu] { color: var(--rg-accent, #2563eb); }
.sceq-empty[b-51d5oanmgu] { font-size: .82rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); border: 1px dashed var(--rg-border); border-radius: .5rem; padding: .6rem .8rem; }

/* Autocomplete usuarios */
.am-autocomplete[b-51d5oanmgu] { position: relative; }
.am-autocomplete > input[b-51d5oanmgu] { width: 100%; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 6px; padding: .45rem .65rem; }
.am-autocomplete > input:focus[b-51d5oanmgu] { border-color: var(--rg-primary); box-shadow: 0 0 0 3px rgba(26,58,92,.15); outline: none; }
.am-dropdown[b-51d5oanmgu] { position: absolute; top: calc(100% + 2px); left: 0; right: 0; z-index: 20; background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 8px; box-shadow: 0 12px 32px rgba(0,0,0,.18); max-height: 260px; overflow-y: auto; }
.am-dropdown-item[b-51d5oanmgu] { display: flex; align-items: center; gap: .5rem; padding: .5rem .7rem; cursor: pointer; font-size: .85rem; color: var(--rg-text-primary); border-bottom: 1px solid var(--rg-border); }
.am-dropdown-item:last-child[b-51d5oanmgu] { border-bottom: none; }
.am-dropdown-item:hover[b-51d5oanmgu] { background: var(--rg-bg-hover); }
.am-code[b-51d5oanmgu] { font-family: monospace; font-size: .72rem; color: var(--rg-text-muted); background: var(--rg-bg-subtle); padding: .1rem .4rem; border-radius: 4px; }
/* Enlace a Personal de Chat desde la sección de agentes */
.sceq-link[b-51d5oanmgu] { margin-left: auto; font-size: .75rem; color: var(--rg-accent, #2563eb); text-decoration: none; font-weight: 600; background: none; border: none; cursor: pointer; padding: 0; display: inline-flex; align-items: center; gap: .25rem; }
.sceq-link:hover[b-51d5oanmgu] { text-decoration: underline; }
/* _content/Rgclouds.Web/Components/Pages/Superchat/Frmsuperchat.razor.rz.scp.css */
/* ── SuperChat inbox (bandeja 3 columnas) ── */
.sc-wrap[b-vk70p6noae] { display:grid; grid-template-columns: 320px 1fr; gap:.6rem; height: calc(100vh - 120px); padding:.6rem; animation: slideUp-b-vk70p6noae .3s ease-out; }
@keyframes slideUp-b-vk70p6noae { from { opacity:0; transform:translateY(12px);} to {opacity:1; transform:none;} }
@media (max-width: 820px){ .sc-wrap[b-vk70p6noae] { grid-template-columns: 1fr; } }

.sc-col[b-vk70p6noae] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:.7rem; display:flex; flex-direction:column; overflow:hidden; }

/* lista */
.sc-lista-head[b-vk70p6noae] { display:flex; align-items:center; justify-content:space-between; padding:.6rem .8rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.sc-titulo[b-vk70p6noae] { font-weight:700; font-size:.9rem; color:var(--rg-text-primary,#1e293b); }
.sc-titulo i[b-vk70p6noae] { color:var(--rg-accent,#2563eb); }
.sc-iconbtn[b-vk70p6noae] { background:none; border:none; cursor:pointer; color:var(--rg-text-secondary,#475569); padding:.3rem; border-radius:.4rem; }
.sc-iconbtn:hover[b-vk70p6noae] { background:var(--rg-bg-hover,#f1f5f9); }
.sc-search[b-vk70p6noae] { display:flex; align-items:center; gap:.4rem; padding:.45rem .6rem; margin:.5rem; border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; background:var(--rg-bg-input,#fff); }
.sc-search i[b-vk70p6noae] { color:var(--rg-text-muted,#94a3b8); }
.sc-search input[b-vk70p6noae] { flex:1; border:none; outline:none; background:transparent; color:var(--rg-text-primary,#1e293b); font-size:.82rem; }
.sc-filtros[b-vk70p6noae] { display:flex; gap:.3rem; padding:0 .5rem .4rem; }
.sc-chip[b-vk70p6noae] { font-size:.72rem; padding:.25rem .55rem; border:1px solid var(--rg-border,#e2e8f0); background:var(--rg-bg-input,#fff); color:var(--rg-text-secondary,#475569); border-radius:1rem; cursor:pointer; }
.sc-chip.on[b-vk70p6noae] { background:var(--rg-accent,#2563eb); color:#fff; border-color:var(--rg-accent,#2563eb); }
.sc-conv-list[b-vk70p6noae] { flex:1; overflow-y:auto; }
.sc-empty[b-vk70p6noae] { padding:1rem; text-align:center; color:var(--rg-text-muted,#94a3b8); font-size:.82rem; }
.sc-conv[b-vk70p6noae] { width:100%; text-align:left; background:none; border:none; border-bottom:1px solid var(--rg-border-light,#f1f5f9); padding:.55rem .8rem; cursor:pointer; }
.sc-conv:hover[b-vk70p6noae] { background:var(--rg-bg-hover,#f8fafc); }
.sc-conv.active[b-vk70p6noae] { background:rgba(37,99,235,.08); border-left:3px solid var(--rg-accent,#2563eb); }
.sc-conv-top[b-vk70p6noae] { display:flex; align-items:center; justify-content:space-between; }
.sc-conv-nom[b-vk70p6noae] { font-weight:600; font-size:.84rem; color:var(--rg-text-primary,#1e293b); }
.sc-badge[b-vk70p6noae] { background:var(--rg-accent,#2563eb); color:#fff; font-size:.66rem; font-weight:700; min-width:1.1rem; height:1.1rem; border-radius:1rem; display:inline-flex; align-items:center; justify-content:center; padding:0 .3rem; }
.sc-conv-sub[b-vk70p6noae] { display:flex; flex-direction:column; gap:.1rem; margin-top:.15rem; }
.sc-canal[b-vk70p6noae] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); }
.sc-conv-prev[b-vk70p6noae] { font-size:.76rem; color:var(--rg-text-secondary,#475569); }

/* hilo */
.sc-hilo[b-vk70p6noae] { }
.sc-empty-big[b-vk70p6noae] { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6rem; color:var(--rg-text-muted,#94a3b8); }
.sc-empty-big i[b-vk70p6noae] { font-size:2.2rem; }
.sc-hilo-head[b-vk70p6noae] { display:flex; align-items:center; justify-content:space-between; padding:.6rem .9rem; border-bottom:1px solid var(--rg-border,#e2e8f0); }
.sc-hilo-nom[b-vk70p6noae] { font-weight:700; color:var(--rg-text-primary,#1e293b); }
.sc-hilo-meta[b-vk70p6noae] { font-size:.74rem; color:var(--rg-text-muted,#94a3b8); }
.sc-hilo-actions[b-vk70p6noae] { display:flex; align-items:center; gap:.3rem; }
.sc-vent[b-vk70p6noae] { font-size:.72rem; color:#b45309; background:rgba(217,119,6,.12); padding:.2rem .5rem; border-radius:1rem; }
[data-mode="dark"] .sc-vent[b-vk70p6noae] { color:#fcd34d; }
.sc-msgs[b-vk70p6noae] { flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.5rem; background:var(--rg-bg-page,#f8fafc); }
.sc-sys[b-vk70p6noae] { align-self:center; font-size:.72rem; color:var(--rg-text-muted,#94a3b8); background:var(--rg-bg-subtle,#eef2f7); padding:.25rem .7rem; border-radius:1rem; }
.sc-msg[b-vk70p6noae] { display:flex; flex-direction:column; max-width:72%; }
.sc-msg.ent[b-vk70p6noae] { align-self:flex-start; }
.sc-msg.sal[b-vk70p6noae] { align-self:flex-end; align-items:flex-end; }
.sc-bubble[b-vk70p6noae] { padding:.5rem .75rem; border-radius:.8rem; font-size:.85rem; white-space:pre-wrap; word-break:break-word; }
.sc-msg.ent .sc-bubble[b-vk70p6noae] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); color:var(--rg-text-primary,#1e293b); border-bottom-left-radius:.2rem; }
.sc-msg.sal .sc-bubble[b-vk70p6noae] { background:var(--rg-accent,#2563eb); color:#fff; border-bottom-right-radius:.2rem; }
.sc-time[b-vk70p6noae] { font-size:.66rem; color:var(--rg-text-muted,#94a3b8); margin-top:.15rem; }
.sc-compose[b-vk70p6noae] { display:flex; gap:.5rem; padding:.6rem .8rem; border-top:1px solid var(--rg-border,#e2e8f0); }
.sc-compose input[b-vk70p6noae] { flex:1; border:1px solid var(--rg-border,#e2e8f0); border-radius:1.2rem; padding:.5rem .9rem; background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b); outline:none; font-size:.85rem; }
.sc-send[b-vk70p6noae] { width:2.4rem; height:2.4rem; border:none; border-radius:50%; background:var(--rg-accent,#2563eb); color:#fff; cursor:pointer; }
.sc-send:disabled[b-vk70p6noae] { opacity:.5; cursor:not-allowed; }
.spin[b-vk70p6noae] { animation: scspin-b-vk70p6noae .8s linear infinite; } @keyframes scspin-b-vk70p6noae { to { transform:rotate(360deg);} }

.sc-toast[b-vk70p6noae] { position:fixed; bottom:1rem; left:50%; transform:translateX(-50%); background:var(--rg-text-primary,#1e293b); color:#fff; padding:.5rem 1rem; border-radius:.5rem; font-size:.8rem; z-index:3000; }
.sc-toast.err[b-vk70p6noae] { background:#dc2626; }

/* ── Modal (transferir / custodia) ── */
.modal-backdrop[b-vk70p6noae] { position:fixed; inset:0; background:rgba(0,0,0,0.4); backdrop-filter:blur(4px); z-index:1000; }
.modal-container[b-vk70p6noae] { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1001; pointer-events:none; }
.modal-dialog[b-vk70p6noae] { pointer-events:auto; background:var(--rg-bg-card,#fff); border-radius:.75rem; width:95%; max-width:680px; max-height:90vh; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,0.2); }
.modal-dialog.modal-sm[b-vk70p6noae] { max-width:440px; }
.modal-dialog.modal-lg[b-vk70p6noae] { max-width: 820px; }
.modal-header[b-vk70p6noae] { display:flex; justify-content:space-between; align-items:center; padding:.75rem 1.25rem; border-bottom:1px solid var(--rg-border,#e2e8f0); flex-shrink:0; }
.modal-header h2[b-vk70p6noae] { margin:0; font-size:1rem; font-weight:700; color:var(--rg-text-primary,#1e293b); display:flex; align-items:center; gap:.5rem; }
.modal-header h2 i[b-vk70p6noae] { color:var(--rg-accent,#2563eb); }
.modal-close[b-vk70p6noae] { background:none; border:none; cursor:pointer; color:var(--rg-text-muted,#94a3b8); font-size:1rem; padding:.25rem; border-radius:.25rem; }
.modal-close:hover[b-vk70p6noae] { color:var(--rg-text-primary); background:var(--rg-bg-hover); }
.modal-body[b-vk70p6noae] { padding:1rem 1.25rem; overflow-y:auto; flex:1; }
.modal-footer[b-vk70p6noae] { display:flex; justify-content:flex-end; gap:.5rem; padding:.625rem 1.25rem; border-top:1px solid var(--rg-border,#e2e8f0); flex-shrink:0; }

.btn-crud[b-vk70p6noae] { display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .85rem; border-radius:.5rem; font-size:.85rem; font-weight:600; cursor:pointer; border:1px solid transparent; }
.btn-crud.btn-primary[b-vk70p6noae] { background:var(--rg-accent,#2563eb); color:#fff; }
.btn-crud.btn-primary:disabled[b-vk70p6noae] { opacity:.6; cursor:not-allowed; }
.btn-crud.btn-outline[b-vk70p6noae] { background:transparent; color:var(--rg-text-secondary,#475569); border-color:var(--rg-border,#e2e8f0); }
.btn-crud.btn-outline:hover[b-vk70p6noae] { background:var(--rg-bg-hover,#f1f5f9); }

/* ── Form (transferir) ── */
.sc-form[b-vk70p6noae] { display:flex; flex-direction:column; gap:.75rem; }
.sc-fg[b-vk70p6noae] { display:flex; flex-direction:column; gap:.3rem; }
.sc-fg label[b-vk70p6noae] { font-size:.78rem; font-weight:600; color:var(--rg-text-secondary,#475569); }
.sc-fg select[b-vk70p6noae], .sc-fg textarea[b-vk70p6noae], .sc-fg input[b-vk70p6noae] { background:var(--rg-bg-input,#fff); color:var(--rg-text-primary,#1e293b); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.45rem .65rem; font-size:.85rem; outline:none; }
.sc-fg select:focus[b-vk70p6noae], .sc-fg textarea:focus[b-vk70p6noae] { border-color:var(--rg-accent,#2563eb); box-shadow:0 0 0 3px rgba(37,99,235,.15); }

/* ── Cadena de custodia ── */
.sc-custodia[b-vk70p6noae] { display:flex; flex-direction:column; gap:.5rem; }
.sc-cust-item[b-vk70p6noae] { display:flex; gap:.6rem; }
.sc-cust-dot[b-vk70p6noae] { display:flex; align-items:center; justify-content:center; min-width:1.6rem; height:1.6rem; border-radius:50%; background:rgba(37,99,235,.12); color:var(--rg-accent,#2563eb); font-size:.8rem; flex-shrink:0; margin-top:.1rem; }
.sc-cust-body[b-vk70p6noae] { flex:1; background:var(--rg-bg-subtle,#f8fafc); border:1px solid var(--rg-border,#e2e8f0); border-radius:.5rem; padding:.55rem .75rem; }
.sc-cust-top[b-vk70p6noae] { display:flex; justify-content:space-between; align-items:center; margin-bottom:.25rem; }
.sc-cust-tipo[b-vk70p6noae] { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--rg-accent,#2563eb); }
.sc-cust-fecha[b-vk70p6noae] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.sc-cust-flow[b-vk70p6noae] { font-size:.85rem; color:var(--rg-text-primary,#1e293b); display:flex; align-items:center; gap:.4rem; }
.sc-cust-flow i[b-vk70p6noae] { color:var(--rg-text-muted,#94a3b8); }
.sc-cust-motivo[b-vk70p6noae] { font-size:.8rem; color:var(--rg-text-secondary,#475569); margin-top:.25rem; }
.sc-cust-motivo i[b-vk70p6noae] { color:var(--rg-text-muted,#94a3b8); margin-right:.25rem; }
.sc-cust-user[b-vk70p6noae] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); margin-top:.2rem; }

/* ── Ayuda (estándar) ─────────────────────────────────────────────────── */
.help-icon-header[b-vk70p6noae] { color: var(--rg-accent,#2563eb); margin-right: 0.25rem; }
.help-body[b-vk70p6noae] { display: flex; flex-direction: column; gap: 0; padding: 0; }
.help-section[b-vk70p6noae] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); }
.help-section:last-child[b-vk70p6noae] { border-bottom: none; }
.help-section p[b-vk70p6noae] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.4rem; }
.help-section ul[b-vk70p6noae], .help-section ol[b-vk70p6noae] { padding-left: 1.25rem; margin-bottom: 0; }
.help-section li[b-vk70p6noae] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); margin-bottom: 0.2rem; }
.help-section-title[b-vk70p6noae] { display: flex; align-items: center; gap: 0.45rem; font-size: 0.88rem; font-weight: 700; color: var(--rg-text-primary,#1e293b); margin-bottom: 0.65rem; }
.help-section-title i[b-vk70p6noae] { color: var(--rg-accent,#2563eb); }
.help-example[b-vk70p6noae] { background: var(--rg-bg-subtle,#f8fafc); border: 1px solid var(--rg-border,#e2e8f0); border-radius: 0.5rem; padding: 0.75rem; }
.help-example-danger[b-vk70p6noae] { background: rgba(220,38,38,0.04); border-color: rgba(220,38,38,0.2); }
.help-example p[b-vk70p6noae] { font-size: 0.82rem; margin-bottom: 0.3rem; }
.help-example-title[b-vk70p6noae] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.4rem; }
.help-tip[b-vk70p6noae] { display: flex; gap: 0.6rem; align-items: flex-start; background: rgba(37,99,235,0.07); border-left: 4px solid var(--rg-accent,#2563eb); border-radius: 0 0.4rem 0.4rem 0; padding: 0.65rem 0.8rem; margin-top: 0.5rem; font-size: 0.82rem; color: var(--rg-text-secondary,#475569); }
.help-tip i[b-vk70p6noae] { color: var(--rg-accent,#2563eb); font-size: 1rem; flex-shrink: 0; margin-top: 0.05rem; }
[data-mode="dark"] .help-tip[b-vk70p6noae] { background: rgba(37,99,235,0.12); }
.help-steps[b-vk70p6noae] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.4rem; }
.help-step[b-vk70p6noae] { display: flex; gap: 0.6rem; align-items: flex-start; }
.help-step-num[b-vk70p6noae] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.5rem; height: 1.5rem; background: var(--rg-accent,#2563eb); color: #fff; border-radius: 50%; font-size: 0.72rem; font-weight: 700; flex-shrink: 0; margin-top: 0.1rem; }
.help-step div[b-vk70p6noae] { font-size: 0.85rem; color: var(--rg-text-secondary,#475569); padding-top: 0.1rem; }
.help-table[b-vk70p6noae] { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.25rem; }
.help-table th[b-vk70p6noae] { background: var(--rg-bg-subtle,#f8fafc); font-weight: 600; text-align: left; padding: 0.4rem 0.6rem; border-bottom: 2px solid var(--rg-border,#e2e8f0); font-size: 0.72rem; text-transform: uppercase; color: var(--rg-text-muted,#94a3b8); }
.help-table td[b-vk70p6noae] { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rg-border,#e2e8f0); color: var(--rg-text-secondary,#475569); vertical-align: top; }
[data-mode="dark"] .help-table th[b-vk70p6noae] { background: rgba(255,255,255,0.04); }
.help-badge[b-vk70p6noae] { display: inline-block; padding: 0.1rem 0.45rem; border-radius: 1rem; font-size: 0.7rem; font-weight: 700; }
.help-badge-ok[b-vk70p6noae] { background: rgba(22,163,74,0.12); color: #166534; }
.help-badge-warn[b-vk70p6noae] { background: rgba(217,119,6,0.12); color: #92400e; }
.help-badge-alert[b-vk70p6noae] { background: rgba(234,88,12,0.12); color: #9a3412; }
.help-badge-danger[b-vk70p6noae] { background: rgba(220,38,38,0.12); color: #991b1b; }
[data-mode="dark"] .help-badge-ok[b-vk70p6noae] { color: #86efac; }
[data-mode="dark"] .help-badge-warn[b-vk70p6noae] { color: #fcd34d; }
[data-mode="dark"] .help-badge-alert[b-vk70p6noae] { color: #fdba74; }
[data-mode="dark"] .help-badge-danger[b-vk70p6noae] { color: #fca5a5; }

/* Barra de identificación del agente */
.sc-ident[b-vk70p6noae] { display: flex; align-items: center; justify-content: space-between; padding: .4rem .6rem; background: var(--rg-bg-subtle); border-bottom: 1px solid var(--rg-border); }
.sc-ident-who[b-vk70p6noae] { display: flex; align-items: center; gap: .35rem; font-size: .82rem; font-weight: 600; color: var(--rg-text-primary); }
.sc-ident-who i[b-vk70p6noae] { color: var(--rg-success); }
.sc-ident-actions[b-vk70p6noae] { display: flex; gap: .2rem; }

/* form-group para el modal Cambiar PIN */
.sc-wrap ~ * .form-group[b-vk70p6noae], .form-group[b-vk70p6noae] { display: flex; flex-direction: column; gap: .25rem; margin-bottom: .6rem; }
.form-group label[b-vk70p6noae] { font-size: .78rem; font-weight: 600; color: var(--rg-text-secondary); }
.form-group input[b-vk70p6noae] { background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border); border-radius: 6px; padding: .45rem .65rem; }
.form-group input:focus[b-vk70p6noae] { border-color: var(--rg-primary); outline: none; box-shadow: 0 0 0 3px rgba(26,58,92,.15); }
/* _content/Rgclouds.Web/Components/Pages/WhatsApp/FrmWhatsAppChat.razor.rz.scp.css */
/* ============================================================
   WhatsApp Chat — Design system RG Clouds (variables + patrones CRUD)
   Replica funcional de APPCITAS adaptada al stack visual
   ============================================================ */

/* ─── Page layout ─── */
.wa-page[b-qtlgw9gccd] { display: flex; flex-direction: column; height: calc(100vh - 60px); overflow: hidden; margin: -1rem; }
@media (min-width: 1024px) { .wa-page[b-qtlgw9gccd] { margin: -1.5rem; } }

/* ─── Header ─── */
.wa-header[b-qtlgw9gccd] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.6rem 1.25rem;
    background: var(--rg-bg-card, #fff);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.wa-header-left[b-qtlgw9gccd] { display: flex; align-items: center; gap: 0.75rem; }
.wa-header-icon[b-qtlgw9gccd] { font-size: 1.5rem; color: #25d366; }
.wa-header h1[b-qtlgw9gccd] { margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.wa-header-sub[b-qtlgw9gccd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); }
.wa-header-right[b-qtlgw9gccd] { display: flex; align-items: center; gap: 0.75rem; }

.wa-connected-badge[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    font-size: 0.75rem; font-weight: 600; color: #25d366;
    background: rgba(37, 211, 102, 0.08);
    padding: 0.25rem 0.65rem;
    border-radius: 1rem;
    border: 1px solid rgba(37, 211, 102, 0.2);
}
.wa-dot-pulse[b-qtlgw9gccd] {
    width: 8px; height: 8px; border-radius: 50%; background: #25d366;
    animation: pulse-b-qtlgw9gccd 2s ease-in-out infinite;
}

/* ─── Body layout ─── */
.wa-body[b-qtlgw9gccd] { display: flex; flex: 1; overflow: hidden; background: var(--rg-bg-main, #f1f5f9); }

/* ─── Sidebar (lista de chats) ─── */
.wa-sidebar[b-qtlgw9gccd] {
    display: flex; flex-direction: column;
    width: 360px; min-width: 300px;
    background: var(--rg-bg-card, #fff);
    border-right: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}

/* Activity tabs */
.wa-activity-tabs[b-qtlgw9gccd] { display: flex; border-bottom: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0; }
.wa-activity-tab[b-qtlgw9gccd] {
    flex: 1; padding: 0.6rem; border: none; background: transparent;
    cursor: pointer; font-size: 0.72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.03em;
    color: var(--rg-text-muted, #94a3b8);
    display: flex; align-items: center; justify-content: center; gap: 0.35rem;
    border-bottom: 2px solid transparent; transition: all 0.2s;
}
.wa-activity-tab:hover[b-qtlgw9gccd] { color: var(--rg-text-secondary, #475569); background: var(--rg-bg-hover, #f8fafc); }
.wa-activity-tab.active[b-qtlgw9gccd] { color: #25d366; border-bottom-color: #25d366; background: rgba(37,211,102,0.04); }
.wa-activity-tab.active-gray[b-qtlgw9gccd] { color: var(--rg-text-secondary, #475569); border-bottom-color: var(--rg-text-muted, #94a3b8); background: var(--rg-bg-hover, #f8fafc); }

.wa-tab-badge[b-qtlgw9gccd] {
    font-size: 0.6rem; padding: 1px 6px; border-radius: 1rem;
    font-weight: 700; color: #fff; margin-left: 0.25rem;
}
.wa-tab-badge.green[b-qtlgw9gccd] { background: #25d366; }
.wa-tab-badge.gray[b-qtlgw9gccd] { background: var(--rg-text-muted, #94a3b8); }

/* Search section */
.wa-search-section[b-qtlgw9gccd] { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--rg-border-light, #f1f5f9); flex-shrink: 0; }
.wa-search-box[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    background: var(--rg-bg-hover, #f1f5f9);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem; padding: 0.4rem 0.75rem;
    font-size: 0.85rem;
}
.wa-search-box i[b-qtlgw9gccd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.85rem; }
.wa-search-box input[b-qtlgw9gccd] { flex: 1; border: none; background: transparent; outline: none; font-size: 0.8rem; color: var(--rg-text-primary, #1e293b); }
.wa-search-clear[b-qtlgw9gccd] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted, #94a3b8); padding: 2px; }

.btn-nuevo-chat[b-qtlgw9gccd] {
    width: 100%; display: flex; align-items: center; justify-content: center; gap: 0.4rem;
    padding: 0.45rem; margin-top: 0.5rem;
    background: rgba(37,211,102,0.08); color: #25d366;
    border: 1px solid rgba(37,211,102,0.25); border-radius: 0.5rem;
    cursor: pointer; font-size: 0.78rem; font-weight: 600; transition: all 0.15s;
}
.btn-nuevo-chat:hover[b-qtlgw9gccd] { background: rgba(37,211,102,0.15); }

.btn-nuevo-chat-sm[b-qtlgw9gccd] {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.4rem 0.75rem; margin-top: 0.75rem;
    background: rgba(37,211,102,0.08); color: #25d366;
    border: 1px solid rgba(37,211,102,0.25); border-radius: 0.375rem;
    cursor: pointer; font-size: 0.72rem; font-weight: 600;
}

/* Chat list */
.wa-chat-list[b-qtlgw9gccd] { flex: 1; overflow-y: auto; }

.wa-chat-item[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.75rem;
    width: 100%; padding: 0.6rem 0.85rem;
    border: none; background: transparent; cursor: pointer;
    text-align: left; border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    transition: all 0.15s; color: inherit; border-left: 3px solid transparent;
}
.wa-chat-item:hover[b-qtlgw9gccd] { background: var(--rg-bg-hover, #f8fafc); }
.wa-chat-item.selected[b-qtlgw9gccd] { background: rgba(79,70,229,0.06); border-left-color: var(--rg-accent, #4f46e5); }
.wa-chat-item.sin-responder[b-qtlgw9gccd] { border-left-color: #ef4444; background: rgba(239,68,68,0.03); }
.wa-chat-item.abierto[b-qtlgw9gccd] { background: rgba(37,211,102,0.04); border-left-color: #86efac; }

.wa-avatar-wrapper[b-qtlgw9gccd] { position: relative; flex-shrink: 0; }
.wa-avatar[b-qtlgw9gccd] {
    width: 42px; height: 42px; border-radius: 50%;
    background: var(--rg-bg-hover, #f1f5f9); color: var(--rg-text-muted, #94a3b8);
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 0.78rem;
    box-shadow: 0 0 0 2px var(--rg-bg-card, #fff);
}
.wa-avatar.danger[b-qtlgw9gccd] { background: #fee2e2; color: #ef4444; box-shadow: 0 0 0 2px #fecaca; }
.wa-avatar.indigo[b-qtlgw9gccd] { background: rgba(79,70,229,0.1); color: var(--rg-accent, #4f46e5); box-shadow: 0 0 0 2px var(--rg-bg-card, #fff); }

.wa-unread-dot[b-qtlgw9gccd] {
    position: absolute; top: -3px; right: -3px;
    width: 18px; height: 18px; border-radius: 50%;
    background: #f59e0b; color: #fff; font-size: 0.5rem;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.wa-unread-dot.danger[b-qtlgw9gccd] { background: #ef4444; }
.wa-unread-dot.pulse[b-qtlgw9gccd] { animation: pulse-b-qtlgw9gccd 2s ease-in-out infinite; }

.wa-open-dot[b-qtlgw9gccd] {
    position: absolute; bottom: 0; right: 0;
    width: 12px; height: 12px; border-radius: 50%;
    background: #86efac; border: 2px solid var(--rg-bg-card, #fff);
}

.wa-chat-info[b-qtlgw9gccd] { flex: 1; min-width: 0; }
.wa-chat-top[b-qtlgw9gccd] { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.wa-chat-name[b-qtlgw9gccd] { font-weight: 600; font-size: 0.82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--rg-text-primary, #1e293b); }
.wa-chat-name.text-danger[b-qtlgw9gccd] { color: #ef4444; }
.wa-chat-time[b-qtlgw9gccd] { font-size: 0.65rem; color: var(--rg-text-muted, #94a3b8); white-space: nowrap; flex-shrink: 0; }
.wa-chat-time.text-danger[b-qtlgw9gccd] { color: #ef4444; }
.wa-chat-jid[b-qtlgw9gccd] { font-size: 0.7rem; color: var(--rg-text-muted, #94a3b8); font-family: monospace; }
.wa-chat-preview[b-qtlgw9gccd] { margin: 0.15rem 0 0; font-size: 0.72rem; color: var(--rg-text-secondary, #475569); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-chat-preview.text-danger[b-qtlgw9gccd] { color: #ef4444; }
.wa-chat-preview.fw-bold[b-qtlgw9gccd] { font-weight: 700; color: var(--rg-text-primary, #1e293b); }
.wa-chat-arrow[b-qtlgw9gccd] { color: var(--rg-border, #e2e8f0); font-size: 0.85rem; }

.wa-search-warning[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 0.85rem; background: #fffbeb; border-bottom: 1px solid #fde68a;
    font-size: 0.7rem; color: #92400e;
}

/* Load more */
.wa-load-more-section[b-qtlgw9gccd] { padding: 0.5rem; text-align: center; }
.wa-load-more-btn[b-qtlgw9gccd] {
    width: 100%; padding: 0.45rem; background: rgba(79,70,229,0.06);
    border: 1px solid rgba(79,70,229,0.15); border-radius: 0.5rem; cursor: pointer;
    font-size: 0.72rem; font-weight: 600; color: var(--rg-accent, #4f46e5);
    display: flex; align-items: center; justify-content: center; gap: 0.35rem;
}
.wa-load-more-btn:hover[b-qtlgw9gccd] { background: rgba(79,70,229,0.12); }

/* ─── Main panel (tabs + messages) ─── */
.wa-main[b-qtlgw9gccd] { display: flex; flex-direction: column; flex: 1; min-width: 0; }

/* Tabs bar */
.wa-tabs-bar[b-qtlgw9gccd] {
    display: flex; align-items: center;
    background: var(--rg-bg-card, #fff);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0; overflow-x: auto;
}
.wa-tab[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 0.65rem; cursor: pointer;
    border-bottom: 2px solid transparent;
    max-width: 180px; flex-shrink: 0; transition: all 0.2s;
}
.wa-tab:hover[b-qtlgw9gccd] { background: var(--rg-bg-hover, #f8fafc); }
.wa-tab.active[b-qtlgw9gccd] { border-bottom-color: var(--rg-accent, #4f46e5); background: rgba(79,70,229,0.04); }
.wa-tab.sin-responder[b-qtlgw9gccd] { border-bottom-color: #ef4444; background: rgba(239,68,68,0.04); }

.wa-tab:hover .wa-tab-close[b-qtlgw9gccd] { opacity: 1; }
.wa-tab-close[b-qtlgw9gccd] {
    opacity: 0; width: 18px; height: 18px; border-radius: 50%;
    border: none; background: transparent; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; margin-left: auto; transition: all 0.15s;
}
.wa-tab-close:hover[b-qtlgw9gccd] { background: #fee2e2; color: #ef4444; }
.wa-tab.active .wa-tab-close[b-qtlgw9gccd] { opacity: 0.7; }

.wa-tab-avatar-wrapper[b-qtlgw9gccd] { position: relative; flex-shrink: 0; }
.wa-tab-avatar[b-qtlgw9gccd] {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--rg-bg-hover, #f1f5f9); color: var(--rg-text-muted, #94a3b8);
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 0.6rem;
}
.wa-tab-avatar.active[b-qtlgw9gccd] { background: rgba(79,70,229,0.1); color: var(--rg-accent, #4f46e5); }
.wa-tab-avatar.danger[b-qtlgw9gccd] { background: #fee2e2; color: #ef4444; }

.wa-tab-dot[b-qtlgw9gccd] {
    position: absolute; top: -2px; right: -2px;
    width: 14px; height: 14px; border-radius: 50%;
    background: #f59e0b; display: flex; align-items: center; justify-content: center;
    font-size: 0.45rem; color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}
.wa-tab-dot.danger[b-qtlgw9gccd] { background: #ef4444; }
.wa-tab-dot.pulse[b-qtlgw9gccd] { animation: pulse-b-qtlgw9gccd 2s ease-in-out infinite; }

.wa-tab-name[b-qtlgw9gccd] {
    font-size: 0.72rem; font-weight: 500; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; color: var(--rg-text-primary, #1e293b);
}
.wa-tabs-spacer[b-qtlgw9gccd] { flex: 1; }
.wa-tabs-count[b-qtlgw9gccd] { font-size: 0.6rem; color: var(--rg-text-muted, #94a3b8); padding: 0 0.75rem; flex-shrink: 0; }

/* Conv header */
.wa-conv-header[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.5rem 1rem;
    background: var(--rg-bg-card, #fff);
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    flex-shrink: 0;
}
.wa-conv-avatar[b-qtlgw9gccd] {
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(79,70,229,0.1); color: var(--rg-accent, #4f46e5);
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 0.7rem; flex-shrink: 0;
}
.wa-conv-info[b-qtlgw9gccd] { flex: 1; min-width: 0; }
.wa-conv-info strong[b-qtlgw9gccd] { display: block; font-size: 0.88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--rg-text-primary, #1e293b); }
.wa-conv-info small[b-qtlgw9gccd] { color: var(--rg-text-muted, #94a3b8); font-size: 0.7rem; }

/* Messages */
.wa-messages[b-qtlgw9gccd] {
    flex: 1; overflow-y: auto; padding: 1rem;
    display: flex; flex-direction: column; gap: 0.25rem;
    background: linear-gradient(135deg, var(--rg-bg-main, #f1f5f9) 25%, var(--rg-bg-hover, #e8ecf1) 100%);
}
.wa-msg[b-qtlgw9gccd] { max-width: 75%; padding: 0.5rem 0.65rem 0.25rem; border-radius: 0.75rem; word-wrap: break-word; box-shadow: 0 1px 1px rgba(0,0,0,0.06); }
.wa-msg-in[b-qtlgw9gccd] { align-self: flex-start; background: var(--rg-bg-card, #fff); border-top-left-radius: 3px; }
.wa-msg-out[b-qtlgw9gccd] { align-self: flex-end; background: #d1fae5; border-top-right-radius: 3px; }
.wa-msg-text[b-qtlgw9gccd] { margin: 0; font-size: 0.82rem; line-height: 1.4; white-space: pre-wrap; color: var(--rg-text-primary, #1e293b); }
.wa-msg-meta[b-qtlgw9gccd] { display: flex; justify-content: flex-end; align-items: center; gap: 0.2rem; margin-top: 0.1rem; }
.wa-msg-time[b-qtlgw9gccd] { font-size: 0.6rem; color: #8696a0; }
.wa-msg-meta i[b-qtlgw9gccd] { font-size: 0.7rem; color: #8696a0; }
.wa-msg-meta .text-info[b-qtlgw9gccd] { color: #53bdeb; }

/* Media buttons */
.wa-media-load-btn[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    padding: 0.4rem 0.65rem; background: rgba(79,70,229,0.08);
    border: none; border-radius: 0.5rem; cursor: pointer;
    font-size: 0.72rem; color: var(--rg-accent, #4f46e5); margin-bottom: 0.25rem; transition: all 0.15s;
}
.wa-media-load-btn:hover[b-qtlgw9gccd] { background: rgba(79,70,229,0.15); }

.wa-media-img-wrap[b-qtlgw9gccd] { margin-bottom: 0.25rem; cursor: pointer; }
.wa-media-img[b-qtlgw9gccd] { max-width: 280px; max-height: 300px; border-radius: 0.5rem; display: block; }
.wa-media-img:hover[b-qtlgw9gccd] { opacity: 0.9; }
.wa-media-audio-wrap[b-qtlgw9gccd] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.25rem; }
.wa-media-doc[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.65rem;
    padding: 0.5rem 0.65rem; background: var(--rg-bg-hover, #f9fafb); border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem; text-decoration: none; color: inherit;
    margin-bottom: 0.25rem; transition: all 0.15s;
}
.wa-media-doc:hover[b-qtlgw9gccd] { background: var(--rg-bg-main, #f1f5f9); }
.wa-doc-icon[b-qtlgw9gccd] {
    width: 40px; height: 40px; border-radius: 0.5rem;
    background: #fee2e2; color: #ef4444;
    display: flex; align-items: center; justify-content: center; font-size: 1.1rem;
}
.wa-doc-info[b-qtlgw9gccd] { flex: 1; min-width: 0; }
.wa-doc-info span[b-qtlgw9gccd] { display: block; font-size: 0.78rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-doc-info small[b-qtlgw9gccd] { font-size: 0.65rem; color: var(--rg-text-muted, #94a3b8); text-transform: uppercase; }

/* Attach preview */
.wa-attach-preview[b-qtlgw9gccd] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.5rem 1rem; background: var(--rg-bg-card, #fff);
    border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0;
}
.wa-attach-info[b-qtlgw9gccd] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.78rem; color: var(--rg-text-primary, #1e293b); }
.wa-attach-info small[b-qtlgw9gccd] { color: var(--rg-text-muted, #94a3b8); }
.wa-attach-btn[b-qtlgw9gccd] {
    padding: 0.5rem; border-radius: 50%; cursor: pointer;
    color: var(--rg-text-secondary, #475569); display: flex; align-items: center;
    font-size: 1.1rem; transition: all 0.15s;
}
.wa-attach-btn:hover[b-qtlgw9gccd] { background: var(--rg-bg-hover, #f1f5f9); }

/* Input bar */
.wa-input-bar[b-qtlgw9gccd] {
    display: flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    background: var(--rg-bg-card, #fff);
    border-top: 1px solid var(--rg-border, #e2e8f0); flex-shrink: 0;
}
.wa-msg-input[b-qtlgw9gccd] {
    flex: 1; border: 1px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-hover, #f1f5f9);
    border-radius: 1.5rem; padding: 0.6rem 1rem;
    font-size: 0.82rem; outline: none; color: var(--rg-text-primary, #1e293b);
}
.wa-msg-input:focus[b-qtlgw9gccd] { border-color: #25d366; background: var(--rg-bg-card, #fff); box-shadow: 0 0 0 2px rgba(37,211,102,0.15); }

.wa-send-btn[b-qtlgw9gccd] {
    width: 42px; height: 42px; border-radius: 50%; border: none;
    background: #25d366; color: #fff; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; flex-shrink: 0; box-shadow: 0 2px 6px rgba(37,211,102,0.3);
    transition: all 0.15s;
}
.wa-send-btn:hover:not(:disabled)[b-qtlgw9gccd] { background: #1fb855; }
.wa-send-btn:disabled[b-qtlgw9gccd] { background: var(--rg-border, #d1d5db); box-shadow: none; cursor: not-allowed; }

/* Center panels */
.wa-center-panel[b-qtlgw9gccd] { flex: 1; display: flex; align-items: center; justify-content: center; background: var(--rg-bg-main, #f1f5f9); }
.wa-center-content[b-qtlgw9gccd] { text-align: center; max-width: 400px; color: var(--rg-text-secondary, #475569); }
.wa-center-content h2[b-qtlgw9gccd], .wa-center-content h3[b-qtlgw9gccd] { color: var(--rg-text-primary, #1e293b); margin: 0.5rem 0; }
.wa-center-content p[b-qtlgw9gccd] { font-size: 0.82rem; margin: 0.25rem 0 1rem; }

.wa-disconnected-icon[b-qtlgw9gccd] {
    width: 80px; height: 80px; border-radius: 50%; background: #fee2e2;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 1rem; font-size: 2rem; color: #ef4444;
}

.btn-wa-connect[b-qtlgw9gccd] {
    display: inline-flex; align-items: center; gap: 0.5rem;
    padding: 0.5rem 1rem; background: #25d366; color: #fff;
    border: none; border-radius: 0.5rem; cursor: pointer;
    font-size: 0.82rem; font-weight: 600; box-shadow: 0 2px 8px rgba(37,211,102,0.25);
    transition: all 0.15s;
}
.btn-wa-connect:hover[b-qtlgw9gccd] { background: #1fb855; }
.btn-wa-connect:disabled[b-qtlgw9gccd] { opacity: 0.5; cursor: not-allowed; }

/* QR Modal */
.wa-qr-modal-header[b-qtlgw9gccd] {
    padding: 1rem 1.25rem; background: #25d366; color: #fff;
    display: flex; align-items: center; justify-content: space-between;
    border-radius: 0.75rem 0.75rem 0 0;
}
.wa-qr-modal-header h3[b-qtlgw9gccd] { margin: 0; font-size: 1rem; display: flex; align-items: center; gap: 0.5rem; }
.wa-qr-container[b-qtlgw9gccd] { display: inline-block; background: #fff; padding: 0.75rem; border-radius: 0.75rem; box-shadow: inset 0 2px 6px rgba(0,0,0,0.06); margin-bottom: 1rem; }
.wa-qr-img[b-qtlgw9gccd] { width: 224px; height: 224px; object-fit: contain; }
.wa-pairing-code[b-qtlgw9gccd] {
    display: inline-flex; flex-direction: column; gap: 0.25rem;
    padding: 0.75rem 1.25rem; background: var(--rg-bg-hover, #f8fafc); border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem; margin-bottom: 1rem;
}
.wa-pairing-code span[b-qtlgw9gccd] { font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); }
.wa-pairing-code strong[b-qtlgw9gccd] { font-family: monospace; font-size: 1.4rem; letter-spacing: 3px; color: var(--rg-accent, #4f46e5); }
.wa-qr-polling[b-qtlgw9gccd] { display: flex; align-items: center; justify-content: center; gap: 0.4rem; font-size: 0.72rem; color: var(--rg-text-muted, #94a3b8); margin-top: 0.5rem; }

/* Media overlay */
.wa-media-overlay[b-qtlgw9gccd] {
    position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 9999;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.wa-media-close[b-qtlgw9gccd] {
    position: absolute; top: 1rem; right: 1rem;
    background: rgba(255,255,255,0.1); border: none;
    color: #fff; font-size: 1.4rem; cursor: pointer; padding: 0.5rem; border-radius: 0.5rem;
}
.wa-media-full[b-qtlgw9gccd] { max-width: 90vw; max-height: 90vh; object-fit: contain; border-radius: 0.5rem; }

/* Empty & Loading states */
.wa-loading[b-qtlgw9gccd] { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 2rem; color: var(--rg-text-muted, #94a3b8); font-size: 0.78rem; }
.wa-loading-sm[b-qtlgw9gccd] { display: flex; align-items: center; justify-content: center; gap: 0.4rem; padding: 0.5rem; color: var(--rg-text-muted, #94a3b8); font-size: 0.72rem; }
.wa-empty-search[b-qtlgw9gccd] { padding: 2rem 1rem; text-align: center; color: var(--rg-text-muted, #94a3b8); }
.wa-empty-search i[b-qtlgw9gccd] { font-size: 2.5rem; display: block; margin-bottom: 0.5rem; }
.wa-empty-search p[b-qtlgw9gccd] { font-size: 0.82rem; margin: 0; }

/* Icons & Buttons shared */
.wa-icon-btn[b-qtlgw9gccd] {
    background: transparent; border: none; cursor: pointer;
    padding: 0.4rem; border-radius: 0.375rem; color: var(--rg-text-secondary, #475569);
    font-size: 1rem; display: flex; align-items: center; transition: all 0.15s;
}
.wa-icon-btn:hover[b-qtlgw9gccd] { background: var(--rg-bg-hover, #f1f5f9); color: var(--rg-text-primary, #1e293b); }

.wa-back-btn[b-qtlgw9gccd] {
    display: none; background: none; border: none; cursor: pointer;
    font-size: 1.2rem; color: var(--rg-text-secondary, #475569); padding: 0.4rem;
}

/* Modal shared */
.modal-backdrop[b-qtlgw9gccd] {
    position: fixed; inset: 0; background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px); z-index: 999;
}
.modal-panel[b-qtlgw9gccd] {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: var(--rg-bg-card, #fff); border-radius: 0.75rem;
    box-shadow: 0 25px 50px rgba(0,0,0,0.15); z-index: 1000;
    width: min(600px, 92vw); max-height: 90vh; overflow-y: auto;
}
.modal-close[b-qtlgw9gccd] {
    background: none; border: none; cursor: pointer; font-size: 1rem;
    color: rgba(255,255,255,0.7); padding: 0.25rem;
}
.modal-close:hover[b-qtlgw9gccd] { color: #fff; }
.modal-body[b-qtlgw9gccd] { padding: 1.25rem; }
.modal-footer[b-qtlgw9gccd] {
    padding: 0.75rem 1.25rem; border-top: 1px solid var(--rg-border, #e2e8f0);
    display: flex; justify-content: flex-end; gap: 0.5rem;
}

/* btn-crud reuse from design system */
.btn-crud[b-qtlgw9gccd] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 1rem; border: none; border-radius: 0.5rem;
    font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: all 0.15s;
}
.btn-crud:disabled[b-qtlgw9gccd] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-qtlgw9gccd] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-qtlgw9gccd] { filter: brightness(1.1); }
.btn-outline[b-qtlgw9gccd] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-qtlgw9gccd] { background: var(--rg-bg-hover, #f1f5f9); }

/* Animations */
@keyframes pulse-b-qtlgw9gccd { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes spin-b-qtlgw9gccd { to { transform: rotate(360deg); } }
.spin[b-qtlgw9gccd] { animation: spin-b-qtlgw9gccd 0.8s linear infinite; }

.rg-spinner-sm[b-qtlgw9gccd] {
    display: inline-block; width: 14px; height: 14px;
    border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff;
    border-radius: 50%; animation: spin-b-qtlgw9gccd 0.6s linear infinite;
}

/* ─── RESPONSIVE ─── */
.show-mobile[b-qtlgw9gccd] { display: none !important; }

@media (max-width: 768px) {
    .wa-sidebar[b-qtlgw9gccd] { width: 100%; }
    .wa-sidebar.hide-mobile[b-qtlgw9gccd] { display: none; }
    .wa-main.hide-mobile[b-qtlgw9gccd] { display: none; }
    .show-mobile[b-qtlgw9gccd] { display: flex !important; }
    .wa-msg[b-qtlgw9gccd] { max-width: 85%; }
    .wa-media-img[b-qtlgw9gccd] { max-width: 220px; }
}

@media (max-width: 480px) {
    .wa-chat-item[b-qtlgw9gccd] { padding: 0.5rem 0.65rem; }
    .wa-avatar[b-qtlgw9gccd] { width: 38px; height: 38px; font-size: 0.7rem; }
}
/* _content/Rgclouds.Web/Components/Pages/WhatsApp/FrmWhatsAppConfig.razor.rz.scp.css */
/* ============================================================
   WhatsApp Config — Estilos (alineados al design system RG Clouds)
   ============================================================ */

/* --- Buttons (design system — requerido en cada CSS scoped) --- */
.btn-crud[b-72596x3jpb] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.btn-crud:disabled[b-72596x3jpb] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-72596x3jpb] { background: var(--rg-accent, #4f46e5); color: #fff; }
.btn-primary:hover:not(:disabled)[b-72596x3jpb] { filter: brightness(1.1); }
.btn-outline[b-72596x3jpb] { background: transparent; color: var(--rg-text-secondary, #475569); border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover:not(:disabled)[b-72596x3jpb] { background: var(--rg-bg-hover, #f1f5f9); }
.btn-danger[b-72596x3jpb] { background: #ef4444; color: #fff; }
.btn-danger:hover:not(:disabled)[b-72596x3jpb] { filter: brightness(1.1); }

/* --- CRUD shared (header, alerts, loading, empty) --- */
.crud-container[b-72596x3jpb] { padding: 1.25rem; max-width: 100%; animation: slideUp-b-72596x3jpb 0.3s ease-out; }
@keyframes slideUp-b-72596x3jpb { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.crud-header[b-72596x3jpb] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; gap: 0.75rem; }
.crud-header-left[b-72596x3jpb] { display: flex; align-items: center; gap: 0.75rem; }
.crud-header-icon[b-72596x3jpb] { font-size: 1.75rem; color: var(--rg-accent, #4f46e5); }
.crud-title[b-72596x3jpb] { font-size: 1.25rem; font-weight: 700; color: var(--rg-text-primary, #1e293b); margin: 0; }
.crud-subtitle[b-72596x3jpb] { font-size: 0.75rem; color: var(--rg-text-muted, #94a3b8); }
.crud-header-actions[b-72596x3jpb] { display: flex; gap: 0.5rem; }
.crud-alert[b-72596x3jpb] { display: flex; align-items: center; gap: 0.5rem; padding: 0.625rem 1rem; border-radius: 0.5rem; margin-bottom: 0.75rem; font-size: 0.8rem; font-weight: 500; }
.crud-alert.success[b-72596x3jpb] { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.crud-alert.error[b-72596x3jpb] { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.crud-alert-close[b-72596x3jpb] { margin-left: auto; background: none; border: none; cursor: pointer; color: inherit; opacity: 0.6; }
.crud-loading[b-72596x3jpb] { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 3rem 1rem; color: var(--rg-text-muted, #94a3b8); font-size: 0.85rem; }
.crud-spinner[b-72596x3jpb] { width: 24px; height: 24px; border: 3px solid var(--rg-border, #e2e8f0); border-top-color: var(--rg-accent, #4f46e5); border-radius: 50%; animation: spin-b-72596x3jpb 0.6s linear infinite; }

/* --- Status Bar --- */
.wa-status-bar[b-72596x3jpb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.wa-status-info[b-72596x3jpb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary, #1e293b);
}

.wa-status-dot[b-72596x3jpb] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.wa-status-dot.online[b-72596x3jpb] {
    background: #25d366;
    box-shadow: 0 0 6px rgba(37, 211, 102, 0.5);
}

.wa-status-dot.offline[b-72596x3jpb] {
    background: #ef4444;
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.3);
}

.wa-status-text[b-72596x3jpb] {
    color: var(--rg-text-muted, #94a3b8);
}

.wa-status-actions[b-72596x3jpb] {
    display: flex;
    gap: 0.5rem;
}

/* --- WhatsApp Green Button (design system compliant) --- */
.btn-wa-green[b-72596x3jpb] {
    background: #25d366;
    color: #fff;
}
.btn-wa-green:hover:not(:disabled)[b-72596x3jpb] {
    background: #1fb855;
    filter: brightness(1.05);
}

/* --- QR Panel Inline --- */
.wa-qr-panel[b-72596x3jpb] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid #25d366;
    border-radius: 0.625rem;
    margin-bottom: 1.5rem;
    overflow: hidden;
}

.wa-qr-panel-header[b-72596x3jpb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.25rem;
    background: rgba(37, 211, 102, 0.06);
    border-bottom: 1px solid rgba(37, 211, 102, 0.15);
}

.wa-qr-panel-header h3[b-72596x3jpb] {
    margin: 0;
    color: #166534;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.wa-qr-panel-body[b-72596x3jpb] {
    padding: 1.5rem;
    text-align: center;
}

.wa-qr-container[b-72596x3jpb] {
    display: inline-block;
    background: #fff;
    padding: 1rem;
    border-radius: 0.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    border: 1px solid var(--rg-border, #e2e8f0);
}

.wa-qr-img[b-72596x3jpb] {
    width: 260px;
    height: 260px;
    image-rendering: pixelated;
}

.wa-pairing-code[b-72596x3jpb] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5rem;
    padding: 0.75rem 1.5rem;
    margin-bottom: 1rem;
    display: inline-flex;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.wa-pairing-code strong[b-72596x3jpb] {
    font-family: monospace;
    font-size: 1.1rem;
    letter-spacing: 2px;
    color: #166534;
}

.wa-qr-hint[b-72596x3jpb] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
    margin: 0.5rem 0 0;
}

/* --- Config List --- */
.wa-config-list[b-72596x3jpb] {
    display: grid;
    gap: 0.75rem;
}

.wa-config-card[b-72596x3jpb] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.625rem;
    padding: 0.875rem 1.25rem;
    transition: all 0.15s;
}

.wa-config-card:hover[b-72596x3jpb] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.wa-config-card.active[b-72596x3jpb] {
    border-color: #25d366;
    border-left: 4px solid #25d366;
}

.wa-config-header[b-72596x3jpb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.wa-config-title[b-72596x3jpb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--rg-text-primary, #1e293b);
}

.wa-badge-active[b-72596x3jpb] {
    background: #dcfce7;
    color: #166534;
    font-size: 0.68rem;
    padding: 0.15rem 0.5rem;
    border-radius: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.wa-config-actions[b-72596x3jpb] {
    display: flex;
    gap: 0.25rem;
}

/* Icon buttons — same as Frmclientes */
.btn-icon[b-72596x3jpb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: all 0.15s;
    background: transparent;
}

.btn-edit[b-72596x3jpb] {
    color: var(--rg-accent, #4f46e5);
}
.btn-edit:hover[b-72596x3jpb] {
    background: rgba(79, 70, 229, 0.1);
}

.btn-test[b-72596x3jpb] {
    color: #25d366;
}
.btn-test:hover[b-72596x3jpb] {
    background: rgba(37, 211, 102, 0.1);
}

.btn-delete[b-72596x3jpb] {
    color: #ef4444;
}
.btn-delete:hover[b-72596x3jpb] {
    background: rgba(239, 68, 68, 0.1);
}

.wa-config-details[b-72596x3jpb] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.wa-config-detail[b-72596x3jpb] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary, #475569);
}

.wa-config-detail i[b-72596x3jpb] {
    font-size: 0.75rem;
    color: var(--rg-text-muted, #94a3b8);
}

.wa-url-text[b-72596x3jpb] {
    font-family: monospace;
    font-size: 0.75rem;
}

/* --- Form --- */
.form-grid[b-72596x3jpb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.full-width[b-72596x3jpb] {
    grid-column: 1 / -1;
}

.form-hint[b-72596x3jpb] {
    font-size: 0.7rem;
    color: var(--rg-text-muted, #94a3b8);
    margin-top: 0.25rem;
}

.password-wrapper[b-72596x3jpb] {
    position: relative;
}

.password-wrapper .rg-input[b-72596x3jpb] {
    padding-right: 2.5rem;
}

.password-toggle[b-72596x3jpb] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    padding: 0.25rem;
}

.password-toggle:hover[b-72596x3jpb] {
    color: var(--rg-text-primary, #1e293b);
}

/* --- Toggle Switch --- */
.toggle-switch[b-72596x3jpb] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.toggle-switch input[b-72596x3jpb] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-72596x3jpb] {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: #d1d5db;
    border-radius: 24px;
    transition: 0.3s;
}

.toggle-slider[b-72596x3jpb]::before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background: #fff;
    border-radius: 50%;
    transition: 0.3s;
}

.toggle-switch input:checked + .toggle-slider[b-72596x3jpb] {
    background: #25d366;
}

.toggle-switch input:checked + .toggle-slider[b-72596x3jpb]::before {
    transform: translateX(20px);
}

/* --- Test Section --- */
.wa-test-section[b-72596x3jpb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

.wa-test-result[b-72596x3jpb] {
    font-size: 0.8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.wa-test-result.ok[b-72596x3jpb] {
    color: #25d366;
}

.wa-test-result.fail[b-72596x3jpb] {
    color: #ef4444;
}

/* --- Modal (reutilizando patron CRUD) --- */
.modal-backdrop[b-72596x3jpb] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 999;
}

.modal-panel[b-72596x3jpb] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    width: min(600px, 92vw);
    max-height: 90vh;
    overflow-y: auto;
}

.modal-sm[b-72596x3jpb] {
    width: min(420px, 90vw);
}

.modal-header[b-72596x3jpb] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal-header h2[b-72596x3jpb] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-close[b-72596x3jpb] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    color: var(--rg-text-muted, #94a3b8);
    padding: 0.25rem;
    border-radius: 0.375rem;
}

.modal-close:hover[b-72596x3jpb] {
    background: var(--rg-bg-hover, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}

.modal-body[b-72596x3jpb] {
    padding: 1.25rem;
}

.modal-footer[b-72596x3jpb] {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

/* --- Spinner small --- */
.rg-spinner-sm[b-72596x3jpb] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-72596x3jpb 0.6s linear infinite;
}

@keyframes spin-b-72596x3jpb {
    to { transform: rotate(360deg); }
}

.spin[b-72596x3jpb] {
    animation: spin-b-72596x3jpb 0.8s linear infinite;
}

/* --- Empty state (patron CRUD) --- */
.crud-empty-state[b-72596x3jpb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    text-align: center;
}
.crud-empty-state i[b-72596x3jpb] {
    font-size: 3rem;
    margin-bottom: 0.75rem;
}

/* --- Responsive --- */
@media (max-width: 640px) {
    .form-grid[b-72596x3jpb] {
        grid-template-columns: 1fr;
    }

    .wa-status-bar[b-72596x3jpb] {
        flex-direction: column;
        align-items: flex-start;
    }

    .wa-config-details[b-72596x3jpb] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .wa-qr-img[b-72596x3jpb] {
        width: 200px;
        height: 200px;
    }

    .btn-text[b-72596x3jpb] {
        display: none;
    }
}

/* ============================================================
   Pairing Code (vincular sin escanear QR)
   ============================================================ */
.wa-pairing-form[b-72596x3jpb] {
    margin: 0.4rem 0 0.75rem;
    padding: 0.85rem 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
}
.wa-pairing-form-header[b-72596x3jpb] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    color: var(--rg-text-primary);
    margin-bottom: 0.35rem;
}
.wa-pairing-form-header i[b-72596x3jpb] { font-size: 1.05rem; }
.wa-pairing-form-hint[b-72596x3jpb] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    margin: 0.25rem 0 0.6rem;
    line-height: 1.45;
}
.wa-pairing-form-hint code[b-72596x3jpb] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.78rem;
    color: var(--rg-primary);
}
.wa-pairing-form-row[b-72596x3jpb] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}
.wa-pairing-input[b-72596x3jpb] {
    flex: 1;
    min-width: 0;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.95rem;
    letter-spacing: 0.06em;
    outline: none;
    transition: border-color 0.18s, box-shadow 0.18s;
}
.wa-pairing-input:focus[b-72596x3jpb] {
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.15);
}

/* Display del código grande tipo XXXX-XXXX */
.wa-pairing-big[b-72596x3jpb] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    padding: 1.5rem 0.5rem;
    margin: 0.5rem auto 0.75rem;
}
.wa-pairing-char[b-72596x3jpb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.4rem;
    height: 3rem;
    padding: 0 0.6rem;
    background: linear-gradient(135deg, var(--rg-primary), #2563eb);
    color: #fff;
    font-family: 'Cascadia Code','Fira Code','Consolas',monospace;
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.15);
    user-select: all;
}
.wa-pairing-char:first-child:not(:only-child)[b-72596x3jpb]::after,
.wa-pairing-char:nth-child(4):not(:last-child)[b-72596x3jpb]::after {
    /* separador visual entre los 2 bloques de 4 chars */
}
/* _content/Rgclouds.Web/Components/Pages/WorkspaceGlobal.razor.rz.scp.css */
/* ── Workspace Global — shell de pestañas (MDI), full-bleed ──────────────── */
/* Rompe el padding (1.5rem) del .app-content para ocupar TODA el área como un solo cuerpo. */
.ws-root[b-c4xxstv7tm] { display: flex; flex-direction: column; margin: -1.5rem; height: calc(100vh - 60px); overflow: hidden;
    background: var(--rg-bg-card); }

/* Cinta de pestañas estilo navegador — pegada arriba (en el recuadro superior) */
.ws-tabbar[b-c4xxstv7tm] { display: flex; align-items: flex-end; gap: 0.25rem; padding: 0.4rem 0.75rem 0; overflow-x: auto;
    border-bottom: 1px solid var(--rg-border); flex-shrink: 0; scrollbar-width: thin; background: var(--rg-bg-subtle); }
.ws-tab[b-c4xxstv7tm] { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.5rem 0.85rem; border: 1px solid var(--rg-border);
    border-bottom: none; border-radius: 0.55rem 0.55rem 0 0; background: var(--rg-bg-subtle); color: var(--rg-text-secondary);
    cursor: pointer; white-space: nowrap; font-size: 0.84rem; font-weight: 600; max-width: 220px; position: relative; top: 1px;
    transition: background 0.15s, color 0.15s; }
.ws-tab:hover[b-c4xxstv7tm] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.ws-tab.active[b-c4xxstv7tm] { background: var(--rg-bg-card); color: var(--rg-text-primary); border-color: var(--rg-border);
    box-shadow: 0 -2px 0 0 var(--ws-acc, var(--rg-primary)) inset; }
.ws-tab > span:not(.ws-tab-close)[b-c4xxstv7tm] { overflow: hidden; text-overflow: ellipsis; }
.ws-tab > i[b-c4xxstv7tm] { color: var(--ws-acc, var(--rg-primary)); flex-shrink: 0; }
.ws-tab-close[b-c4xxstv7tm] { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px;
    border-radius: 50%; flex-shrink: 0; color: var(--rg-text-muted); }
.ws-tab-close:hover[b-c4xxstv7tm] { background: var(--rg-danger); color: #fff; }
.ws-tab-add[b-c4xxstv7tm] { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
    border: 1px solid var(--rg-border); border-radius: 0.5rem; background: var(--rg-bg-card); color: var(--rg-primary);
    cursor: pointer; flex-shrink: 0; margin-bottom: 0.3rem; }
.ws-tab-add:hover[b-c4xxstv7tm] { background: var(--rg-primary); color: #fff; }

/* Contenido — edge-to-edge, sin bordes ni radios (un solo cuerpo con las pestañas) */
.ws-content[b-c4xxstv7tm] { flex: 1; min-height: 0; overflow: auto; background: var(--rg-bg-card); border: none; border-radius: 0; }
.ws-pane[b-c4xxstv7tm] { padding: 0; }
.ws-pane.active[b-c4xxstv7tm] { animation: wsFade-b-c4xxstv7tm 0.18s ease; }
@keyframes wsFade-b-c4xxstv7tm { from { opacity: 0; } to { opacity: 1; } }

.ws-empty[b-c4xxstv7tm] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem;
    padding: 3rem 1rem; color: var(--rg-text-muted); }
.ws-empty i[b-c4xxstv7tm] { font-size: 2rem; }

/* Launcher */
.ws-launcher-backdrop[b-c4xxstv7tm] { position: fixed; inset: 0; background: rgba(0,0,0,0.45); backdrop-filter: blur(4px); z-index: 1500; }
.ws-launcher-container[b-c4xxstv7tm] { position: fixed; inset: 0; display: flex; align-items: flex-start; justify-content: center;
    padding-top: 8vh; z-index: 1501; pointer-events: none; }
.ws-launcher[b-c4xxstv7tm] { pointer-events: auto; width: 92%; max-width: 760px; max-height: 78vh; display: flex; flex-direction: column;
    background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 0.85rem; overflow: hidden;
    box-shadow: 0 24px 70px rgba(0,0,0,0.28); }
.ws-launcher-head[b-c4xxstv7tm] { display: flex; align-items: center; justify-content: space-between; padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--rg-border); }
.ws-launcher-head h2[b-c4xxstv7tm] { margin: 0; font-size: 1rem; font-weight: 700; color: var(--rg-text-primary); display: flex; align-items: center; gap: 0.5rem; }
.ws-launcher-head h2 i[b-c4xxstv7tm] { color: var(--rg-primary); }
.ws-launcher-close[b-c4xxstv7tm] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); font-size: 1rem; }
.ws-launcher-close:hover[b-c4xxstv7tm] { color: var(--rg-text-primary); }
.ws-launcher-search[b-c4xxstv7tm] { display: flex; align-items: center; gap: 0.5rem; padding: 0.7rem 1.1rem; border-bottom: 1px solid var(--rg-border); }
.ws-launcher-search i[b-c4xxstv7tm] { color: var(--rg-text-muted); }
.ws-launcher-search input[b-c4xxstv7tm] { flex: 1; background: var(--rg-bg-input); color: var(--rg-text-primary); border: 1px solid var(--rg-border);
    border-radius: 0.5rem; padding: 0.45rem 0.7rem; font-size: 0.88rem; }
.ws-launcher-body[b-c4xxstv7tm] { overflow-y: auto; padding: 0.75rem 1.1rem 1rem; }
.ws-launcher-group[b-c4xxstv7tm] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--rg-text-muted); margin: 0.85rem 0 0.5rem; }
.ws-launcher-grid[b-c4xxstv7tm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.5rem; }
.ws-launcher-item[b-c4xxstv7tm] { display: flex; align-items: center; gap: 0.6rem; padding: 0.6rem 0.75rem; border: 1px solid var(--rg-border);
    border-radius: 0.6rem; background: var(--rg-bg-subtle); color: var(--rg-text-primary); cursor: pointer; text-align: left;
    font-size: 0.85rem; transition: all 0.12s; position: relative; }
.ws-launcher-item:hover[b-c4xxstv7tm] { background: var(--rg-bg-hover); border-color: var(--rg-primary); transform: translateY(-1px); }
.ws-launcher-item > i:first-child[b-c4xxstv7tm] { color: var(--rg-primary); font-size: 1.1rem; flex-shrink: 0; }
.ws-launcher-item > span[b-c4xxstv7tm] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-launcher-item.abierta[b-c4xxstv7tm] { border-color: var(--rg-success); }
.ws-li-check[b-c4xxstv7tm] { position: absolute; right: 0.5rem; color: var(--rg-success); }

/* Full-bleed responsive: el padding de .app-content baja a 1rem y 0.75rem */
@media (max-width: 768px) { .ws-root[b-c4xxstv7tm] { margin: -1rem; } }
@media (max-width: 480px) { .ws-root[b-c4xxstv7tm] { margin: -0.75rem; } }

@media (max-width: 640px) {
    .ws-tab[b-c4xxstv7tm] { max-width: 150px; }
    .ws-launcher-grid[b-c4xxstv7tm] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Editor/RGDAIAssistantModal.razor.rz.scp.css */
/* ── RGDAIAssistantModal — estilos aislados ─────────────────────────────── */

.rgd-ai-backdrop[b-m1hrh9pnav] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(4px);
    z-index: 1500;
}

.rgd-ai-container[b-m1hrh9pnav] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1501;
    pointer-events: none;
}

.rgd-ai-dialog[b-m1hrh9pnav] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 860px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

/* ── Header ─────────────────────────────────────────────────────────────── */
.rgd-ai-header[b-m1hrh9pnav] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    background: linear-gradient(180deg, rgba(83, 74, 183, 0.07), transparent);
}
.rgd-ai-header h2[b-m1hrh9pnav] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--rg-text-primary);
}
.rgd-ai-header h2 i[b-m1hrh9pnav] {
    color: #7F77DD;
}
.rgd-ai-pill[b-m1hrh9pnav] {
    background: rgba(127, 119, 221, 0.15);
    color: #534AB7;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.1rem 0.55rem;
    border-radius: 999px;
    border: 1px solid rgba(127, 119, 221, 0.3);
}
[data-mode="dark"] .rgd-ai-pill[b-m1hrh9pnav] {
    color: #CECBF6;
    background: rgba(127, 119, 221, 0.2);
}
.rgd-ai-close[b-m1hrh9pnav] {
    background: none;
    border: none;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
    cursor: pointer;
}
.rgd-ai-close:hover[b-m1hrh9pnav] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

/* ── Body ───────────────────────────────────────────────────────────────── */
.rgd-ai-body[b-m1hrh9pnav] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.rgd-ai-banner[b-m1hrh9pnav] {
    background: rgba(127, 119, 221, 0.07);
    border-left: 4px solid #7F77DD;
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.65rem 0.85rem;
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
}
.rgd-ai-banner i[b-m1hrh9pnav] {
    color: #7F77DD;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.05rem;
}
[data-mode="dark"] .rgd-ai-banner[b-m1hrh9pnav] {
    background: rgba(127, 119, 221, 0.12);
}

/* ── Query bar ──────────────────────────────────────────────────────────── */
.rgd-ai-query[b-m1hrh9pnav] {
    display: grid;
    grid-template-columns: 1fr 140px auto;
    gap: 0.5rem;
}
.rgd-ai-input[b-m1hrh9pnav],
.rgd-ai-select[b-m1hrh9pnav] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.5rem 0.7rem;
    font-size: 0.9rem;
}
.rgd-ai-input:focus[b-m1hrh9pnav],
.rgd-ai-select:focus[b-m1hrh9pnav] {
    outline: none;
    border-color: #7F77DD;
    box-shadow: 0 0 0 3px rgba(127, 119, 221, 0.18);
}

/* ── Sugerencias ────────────────────────────────────────────────────────── */
.rgd-ai-quick[b-m1hrh9pnav] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.rgd-ai-quick-label[b-m1hrh9pnav] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}
.rgd-ai-chip[b-m1hrh9pnav] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.15s;
}
.rgd-ai-chip:hover:not(:disabled)[b-m1hrh9pnav] {
    background: rgba(127, 119, 221, 0.1);
    border-color: #7F77DD;
    color: #534AB7;
}
[data-mode="dark"] .rgd-ai-chip:hover:not(:disabled)[b-m1hrh9pnav] {
    color: #CECBF6;
}
.rgd-ai-chip:disabled[b-m1hrh9pnav] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Alert ──────────────────────────────────────────────────────────────── */
.rgd-ai-alert[b-m1hrh9pnav] {
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.3);
    color: #991b1b;
    border-radius: 6px;
    padding: 0.55rem 0.8rem;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
[data-mode="dark"] .rgd-ai-alert[b-m1hrh9pnav] {
    color: #fca5a5;
}

/* ── Empty state ────────────────────────────────────────────────────────── */
.rgd-ai-empty[b-m1hrh9pnav] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    padding: 1.5rem 1rem;
    text-align: center;
    color: var(--rg-text-muted);
}
.rgd-ai-empty i[b-m1hrh9pnav] {
    font-size: 1.8rem;
}
.rgd-ai-empty p[b-m1hrh9pnav] {
    margin: 0;
    font-size: 0.85rem;
}

/* ── Resultados ─────────────────────────────────────────────────────────── */
.rgd-ai-results[b-m1hrh9pnav] {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}
.rgd-ai-card[b-m1hrh9pnav] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.75rem 0.9rem;
}
.rgd-ai-card-hdr[b-m1hrh9pnav] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}
.rgd-ai-card-hdr strong[b-m1hrh9pnav] {
    font-size: 0.92rem;
    color: var(--rg-text-primary);
}
.rgd-ai-meta[b-m1hrh9pnav] {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}
.rgd-ai-tag[b-m1hrh9pnav] {
    background: var(--rg-bg-input);
    color: var(--rg-text-secondary);
    font-size: 0.68rem;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 999px;
    border: 1px solid var(--rg-border);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.rgd-ai-snippet[b-m1hrh9pnav] {
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
    margin: 0 0 0.5rem;
    line-height: 1.5;
    white-space: pre-wrap;
}

/* ── Bridge V6.1 ────────────────────────────────────────────────────────── */
.rgd-ai-bridge[b-m1hrh9pnav] {
    background: var(--rg-bg-card);
    border: 1px dashed rgba(127, 119, 221, 0.4);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    margin-top: 0.4rem;
}
.rgd-ai-bridge-title[b-m1hrh9pnav] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.76rem;
    font-weight: 700;
    color: #534AB7;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
}
[data-mode="dark"] .rgd-ai-bridge-title[b-m1hrh9pnav] {
    color: #CECBF6;
}
.rgd-ai-bridge ul[b-m1hrh9pnav] {
    margin: 0;
    padding-left: 1rem;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.rgd-ai-bridge li[b-m1hrh9pnav] {
    font-size: 0.8rem;
    color: var(--rg-text-secondary);
    line-height: 1.5;
}
.rgd-ai-bridge code[b-m1hrh9pnav] {
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 0.76rem;
    font-family: var(--font-mono, monospace);
}

/* ── Botones ────────────────────────────────────────────────────────────── */
.rgd-ai-btn[b-m1hrh9pnav] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.95rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    border: 1px solid transparent;
}
.rgd-ai-btn:disabled[b-m1hrh9pnav] {
    opacity: 0.6;
    cursor: not-allowed;
}
.rgd-ai-btn-primary[b-m1hrh9pnav] {
    background: #534AB7;
    color: #fff;
}
.rgd-ai-btn-primary:hover:not(:disabled)[b-m1hrh9pnav] {
    background: #3C3489;
}
.rgd-ai-btn-outline[b-m1hrh9pnav] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border-color: var(--rg-border);
}
.rgd-ai-btn-outline:hover[b-m1hrh9pnav] {
    background: var(--rg-bg-hover);
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.rgd-ai-footer[b-m1hrh9pnav] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.7rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    flex-shrink: 0;
}
.rgd-ai-foot-hint[b-m1hrh9pnav] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--rg-text-muted);
}
.rgd-ai-foot-hint i[b-m1hrh9pnav] {
    color: var(--rg-success, #16a34a);
}

/* ── Animacion del icono loading ────────────────────────────────────────── */
.spin[b-m1hrh9pnav] {
    animation: rgd-ai-spin-b-m1hrh9pnav 0.8s linear infinite;
    display: inline-block;
}
@keyframes rgd-ai-spin-b-m1hrh9pnav {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Editor/RGDCalculatedFieldsModal.razor.rz.scp.css */
/* ── RGDCalculatedFieldsModal — estilos aislados ───────────────────────── */

.rgd-cf-backdrop[b-j45pkd018q] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(4px);
    z-index: 1400;
}

.rgd-cf-container[b-j45pkd018q] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1401;
    pointer-events: none;
}

.rgd-cf-dialog[b-j45pkd018q] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 760px;
    max-height: 88vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

/* ── Header ─────────────────────────────────────────────────────────────── */
.rgd-cf-header[b-j45pkd018q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}
.rgd-cf-header h2[b-j45pkd018q] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--rg-text-primary);
}
.rgd-cf-header h2 i[b-j45pkd018q] {
    color: var(--rg-accent, #2563eb);
}
.rgd-cf-count[b-j45pkd018q] {
    background: var(--rg-bg-input);
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    min-width: 20px;
    text-align: center;
}
.rgd-cf-close[b-j45pkd018q] {
    background: none;
    border: none;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
    cursor: pointer;
}
.rgd-cf-close:hover[b-j45pkd018q] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

/* ── Body ───────────────────────────────────────────────────────────────── */
.rgd-cf-body[b-j45pkd018q] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
    flex: 1;
}

.rgd-cf-banner[b-j45pkd018q] {
    background: rgba(37, 99, 235, 0.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 0.4rem 0.4rem 0;
    padding: 0.7rem 0.9rem;
    margin-bottom: 1rem;
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
}
.rgd-cf-banner i[b-j45pkd018q] {
    color: var(--rg-accent, #2563eb);
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: 0.05rem;
}
.rgd-cf-banner code[b-j45pkd018q] {
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.78rem;
    font-family: var(--font-mono, monospace);
    color: var(--rg-text-primary);
}
[data-mode="dark"] .rgd-cf-banner[b-j45pkd018q] {
    background: rgba(37, 99, 235, 0.12);
}

/* ── Empty state ────────────────────────────────────────────────────────── */
.rgd-cf-empty[b-j45pkd018q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.8rem;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--rg-text-muted);
}
.rgd-cf-empty i[b-j45pkd018q] {
    font-size: 2.4rem;
    color: var(--rg-text-muted);
}
.rgd-cf-empty p[b-j45pkd018q] {
    margin: 0;
    font-size: 0.9rem;
}

/* ── Lista de cards ─────────────────────────────────────────────────────── */
.rgd-cf-list[b-j45pkd018q] {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.rgd-cf-card[b-j45pkd018q] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.65rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.rgd-cf-card-row[b-j45pkd018q] {
    display: grid;
    grid-template-columns: 1fr 160px 32px;
    gap: 0.5rem;
    align-items: end;
}

/* ── Form groups ────────────────────────────────────────────────────────── */
.rgd-cf-fg[b-j45pkd018q] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.rgd-cf-fg label[b-j45pkd018q] {
    font-size: 10px;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}
.rgd-cf-input[b-j45pkd018q] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.4rem 0.55rem;
    font-size: 0.85rem;
    width: 100%;
    box-sizing: border-box;
}
.rgd-cf-input:focus[b-j45pkd018q] {
    outline: none;
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}
.rgd-cf-mono[b-j45pkd018q] {
    font-family: var(--font-mono, monospace);
    font-size: 0.8rem;
}

/* ── Botones ────────────────────────────────────────────────────────────── */
.rgd-cf-btn[b-j45pkd018q] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.85rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    border: 1px solid transparent;
}
.rgd-cf-btn-primary[b-j45pkd018q] {
    background: var(--rg-primary, #1a3a5c);
    color: #fff;
}
.rgd-cf-btn-primary:hover[b-j45pkd018q] {
    filter: brightness(1.1);
}
.rgd-cf-btn-outline[b-j45pkd018q] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border-color: var(--rg-border);
}
.rgd-cf-btn-outline:hover[b-j45pkd018q] {
    background: var(--rg-bg-hover);
}
.rgd-cf-btn-icon[b-j45pkd018q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--rg-bg-input);
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    transition: all 0.15s;
}
.rgd-cf-btn-danger:hover[b-j45pkd018q] {
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
    border-color: rgba(220, 38, 38, 0.3);
}
[data-mode="dark"] .rgd-cf-btn-danger:hover[b-j45pkd018q] {
    color: #fca5a5;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.rgd-cf-footer[b-j45pkd018q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.7rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    flex-shrink: 0;
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Editor/RGDDesignerEditor.razor.rz.scp.css */
/* 🎨 RGDDesignerEditor.razor.css — Estilos del editor V6 con tema RG */

.rgd-edt[b-s5k95o87f1] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    color: var(--rg-text-primary);
}

/* ── ALERT ─────────────────────────────────────── */
.rgd-edt-alert[b-s5k95o87f1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 14px;
    border-radius: 6px;
    margin-bottom: 8px;
    font-size: 13px;
}

.rgd-edt-alert-success[b-s5k95o87f1] {
    background: rgba(34, 197, 94, 0.15);
    color: #16a34a;
    border: 1px solid rgba(34, 197, 94, 0.4);
}

.rgd-edt-alert-error[b-s5k95o87f1] {
    background: rgba(239, 68, 68, 0.15);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.4);
}

.rgd-edt-alert button[b-s5k95o87f1] {
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
}

[data-mode="dark"] .rgd-edt-alert-success[b-s5k95o87f1] { color: #86efac; }
[data-mode="dark"] .rgd-edt-alert-error[b-s5k95o87f1]   { color: #fca5a5; }

/* ── LAYOUT 3 columnas ─────────────────────────── */
.rgd-edt-layout[b-s5k95o87f1] {
    display: grid;
    grid-template-columns: 240px 1fr 280px;
    gap: 10px;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ── TOOLBOX ──────────────────────────────────── */
.rgd-edt-toolbox[b-s5k95o87f1] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    padding: 12px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.rgd-edt-group[b-s5k95o87f1] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rgd-edt-group-title[b-s5k95o87f1] {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rg-text-muted);
    margin-bottom: 4px;
    font-weight: 600;
}

.rgd-edt-tool[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    background: var(--rg-bg-subtle);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    font-size: 12px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s;
}

.rgd-edt-tool:hover:not(:disabled)[b-s5k95o87f1] {
    border-color: var(--rg-accent);
    background: var(--rg-bg-hover);
}

.rgd-edt-tool:disabled[b-s5k95o87f1] {
    opacity: 0.4;
    cursor: not-allowed;
}

.rgd-edt-tool i[b-s5k95o87f1] { color: var(--rg-primary); }

.rgd-edt-hint[b-s5k95o87f1] {
    font-size: 10px;
    color: var(--rg-text-muted);
    margin: 4px 0 0;
    font-style: italic;
}

.rgd-edt-input[b-s5k95o87f1] {
    width: 100%;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    padding: 5px 7px;
    font-size: 12px;
    font-family: inherit;
}

.rgd-edt-input:focus[b-s5k95o87f1] {
    outline: none;
    border-color: var(--rg-accent);
}

.rgd-edt-action[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: 0;
}

.rgd-edt-action-preview[b-s5k95o87f1] {
    background: var(--rg-accent);
    color: #0b1220;
}

.rgd-edt-action-preview:hover:not(:disabled)[b-s5k95o87f1] { filter: brightness(1.1); }

.rgd-edt-action-save[b-s5k95o87f1] {
    background: var(--rg-success);
    color: white;
}

.rgd-edt-action:disabled[b-s5k95o87f1] { opacity: 0.5; cursor: not-allowed; }

.rgd-edt-spinner[b-s5k95o87f1] {
    width: 12px;
    height: 12px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: rgd-edt-spin-b-s5k95o87f1 0.7s linear infinite;
}

@keyframes rgd-edt-spin-b-s5k95o87f1 { to { transform: rotate(360deg); } }

/* ── CANVAS ───────────────────────────────────── */
.rgd-edt-canvas-wrap[b-s5k95o87f1] {
    overflow: auto;
    background: #475569;
    border-radius: 8px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.rgd-edt-page[b-s5k95o87f1] {
    background: white;
    color: #1f2937;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    overflow: hidden;
    flex-shrink: 0;
}

.rgd-edt-empty-page[b-s5k95o87f1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #94a3b8;
    text-align: center;
    padding: 60px 20px;
}

.rgd-edt-empty-page i[b-s5k95o87f1] { font-size: 3rem; margin-bottom: 12px; }

.rgd-edt-section[b-s5k95o87f1] {
    border: 2px dashed #cbd5e1;
    margin: 8px;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s;
}

.rgd-edt-section:hover[b-s5k95o87f1] { border-color: #06b6d4; }

.rgd-edt-section.selected[b-s5k95o87f1] {
    border: 2px solid #06b6d4;
    background: rgba(6, 182, 212, 0.04);
}

.rgd-edt-section.drop-here[b-s5k95o87f1] {
    border: 2px solid #22c55e;
    background: rgba(34, 197, 94, 0.08);
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.12);
}

.rgd-edt-section[draggable="true"][b-s5k95o87f1] {
    cursor: grab;
}

.rgd-edt-section[draggable="true"]:active[b-s5k95o87f1] {
    cursor: grabbing;
}

.rgd-edt-grip[b-s5k95o87f1] {
    color: #94a3b8;
    cursor: grab;
    font-size: 14px;
}

.rgd-edt-grip-mini[b-s5k95o87f1] {
    color: #cbd5e1;
    cursor: grab;
    font-size: 12px;
    margin-right: 2px;
}

.rgd-edt-item.drop-here[b-s5k95o87f1] {
    border: 2px solid #22c55e;
    background: rgba(34, 197, 94, 0.1);
}

.rgd-edt-section-header[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    background: #f1f5f9;
    border-bottom: 1px dashed #cbd5e1;
    font-size: 11px;
}

.rgd-edt-section-tag[b-s5k95o87f1] {
    background: #06b6d4;
    color: #0b1220;
    padding: 1px 8px;
    border-radius: 3px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 10px;
}

.rgd-edt-section-info[b-s5k95o87f1] {
    color: #64748b;
    flex: 1;
}

.rgd-edt-section-del[b-s5k95o87f1] {
    background: transparent;
    border: 0;
    color: #b91c1c;
    cursor: pointer;
    opacity: 0.5;
}

.rgd-edt-section-del:hover[b-s5k95o87f1] { opacity: 1; }

.rgd-edt-section-body[b-s5k95o87f1] {
    padding: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.rgd-edt-section-empty[b-s5k95o87f1] {
    color: #94a3b8;
    font-size: 11px;
    font-style: italic;
}

.rgd-edt-item[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    color: #1f2937;
    transition: all 0.15s;
}

.rgd-edt-item:hover[b-s5k95o87f1] { border-color: #06b6d4; }

.rgd-edt-item.selected[b-s5k95o87f1] {
    border: 2px solid #06b6d4;
    background: #e0f2fe;
}

.rgd-edt-item-type[b-s5k95o87f1] {
    font-weight: 600;
    color: #1a3a5c;
}

.rgd-edt-item-value[b-s5k95o87f1] {
    color: #64748b;
    font-family: ui-monospace, monospace;
    font-size: 11px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rgd-edt-item-del[b-s5k95o87f1] {
    background: transparent;
    border: 0;
    color: #ef4444;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

/* ── PREVIEW BOX ───────────────────────────────── */
.rgd-edt-preview-box[b-s5k95o87f1] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    overflow: hidden;
    width: 100%;
    max-width: 8.5in;
}

.rgd-edt-preview-header[b-s5k95o87f1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 14px;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    font-size: 12px;
}

.rgd-edt-preview-header button[b-s5k95o87f1] {
    background: transparent;
    border: 0;
    color: var(--rg-text-secondary);
    cursor: pointer;
}

.rgd-edt-preview-img[b-s5k95o87f1] {
    display: block;
    width: 100%;
    height: auto;
    background: white;
}

/* ── PROPS PANEL ───────────────────────────────── */
.rgd-edt-props[b-s5k95o87f1] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    padding: 14px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rgd-edt-props-title[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 13px;
    color: var(--rg-text-primary);
    padding-bottom: 8px;
    border-bottom: 1px solid var(--rg-border);
    margin-bottom: 4px;
}

.rgd-edt-props-empty[b-s5k95o87f1] {
    text-align: center;
    color: var(--rg-text-muted);
    padding: 40px 16px;
    font-size: 12px;
}

.rgd-edt-props-empty i[b-s5k95o87f1] {
    font-size: 2rem;
    display: block;
    margin-bottom: 8px;
}

.rgd-edt-fg[b-s5k95o87f1] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rgd-edt-fg label[b-s5k95o87f1] {
    font-size: 10px;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}

.rgd-edt-fg-row[b-s5k95o87f1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}

.rgd-edt-check[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 6px;
    text-transform: none;
    letter-spacing: 0;
    color: var(--rg-text-primary);
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
}

/* Bloque de toggles de control de grupo (Fase A del Designer V6.1) */
.rgd-edt-group-flags[b-s5k95o87f1] {
    gap: 6px;
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px dashed var(--rg-border);
}
.rgd-edt-group-flags .rgd-edt-check i[b-s5k95o87f1] {
    color: var(--rg-text-muted);
}

/* ── Fase C — Reglas condicionales en celda body ─────────────── */
.rgd-edt-cond-block[b-s5k95o87f1] {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed var(--rg-border);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.rgd-edt-cond-hdr[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
}
.rgd-edt-cond-hdr i[b-s5k95o87f1] {
    color: var(--rg-accent, #2563eb);
}
.rgd-edt-cond-row[b-s5k95o87f1] {
    display: grid;
    grid-template-columns: 1fr 28px 28px 24px 24px;
    gap: 4px;
    align-items: center;
    padding: 4px;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 4px;
}
.rgd-cond-expr[b-s5k95o87f1] {
    font-family: var(--font-mono, monospace);
    font-size: 11px;
}
.rgd-edt-color[b-s5k95o87f1] {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    background: var(--rg-bg-input);
    cursor: pointer;
}
.rgd-edt-check-inline[b-s5k95o87f1] {
    justify-content: center;
    gap: 0;
    padding: 0;
}
.rgd-edt-check-inline input[type="checkbox"][b-s5k95o87f1] {
    display: none;
}
.rgd-edt-check-inline i[b-s5k95o87f1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    color: var(--rg-text-secondary);
    font-size: 12px;
}
.rgd-edt-check-inline input[type="checkbox"]:checked + i[b-s5k95o87f1] {
    background: var(--rg-primary, #1a3a5c);
    color: #fff;
    border-color: var(--rg-primary, #1a3a5c);
}
.rgd-edt-tool-mini[b-s5k95o87f1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--rg-bg-input);
    color: var(--rg-text-secondary);
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
    transition: all 0.15s;
}
.rgd-edt-tool-mini:hover[b-s5k95o87f1] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}
.rgd-edt-tool-mini.rgd-edt-tool-danger:hover[b-s5k95o87f1] {
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
    border-color: rgba(220, 38, 38, 0.3);
}
[data-mode="dark"] .rgd-edt-tool-mini.rgd-edt-tool-danger:hover[b-s5k95o87f1] {
    color: #fca5a5;
}

/* Fase B — Botón de campos calculados con chip de conteo */
.rgd-edt-tool-calc[b-s5k95o87f1] {
    position: relative;
}
.rgd-edt-tool-badge[b-s5k95o87f1] {
    margin-left: auto;
    background: var(--rg-accent, #2563eb);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 999px;
    min-width: 18px;
    text-align: center;
}

/* Fase E — Botón Asistente IA (alineado a la derecha del canvas-toolbar) */
.rgd-edt-ai-btn[b-s5k95o87f1] {
    margin-left: auto;
    background: rgba(127, 119, 221, 0.12) !important;
    color: #534AB7 !important;
    border-color: rgba(127, 119, 221, 0.35) !important;
}
.rgd-edt-ai-btn:hover:not(:disabled)[b-s5k95o87f1] {
    background: rgba(127, 119, 221, 0.2) !important;
    border-color: #7F77DD !important;
}
[data-mode="dark"] .rgd-edt-ai-btn[b-s5k95o87f1] {
    color: #CECBF6 !important;
    background: rgba(127, 119, 221, 0.18) !important;
}

/* ── CANVAS TOOLBAR (Diseño / Preview) ─────────────── */
.rgd-edt-canvas-toolbar[b-s5k95o87f1] {
    display: flex;
    gap: 6px;
    align-items: center;
    background: #3b4c60;
    border-radius: 6px;
    padding: 5px 8px;
    align-self: flex-start;
    position: sticky;
    top: 0;
    z-index: 10;
}

.rgd-edt-view-btn[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 4px;
    background: transparent;
    color: #cbd5e1;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}

.rgd-edt-view-btn:hover:not(:disabled)[b-s5k95o87f1] {
    background: rgba(255,255,255,0.1);
    color: #fff;
}

.rgd-edt-view-btn.active[b-s5k95o87f1] {
    background: #06b6d4;
    color: #0b1220;
    border-color: #06b6d4;
    font-weight: 700;
}

.rgd-edt-view-btn:disabled[b-s5k95o87f1] {
    opacity: 0.35;
    cursor: not-allowed;
}

/* ── CANVAS: items visuales ─────────────────────────── */
.rgd-edt-item-table-wrap[b-s5k95o87f1] {
    display: block !important;
    width: 100%;
    padding: 0 !important;
    gap: 0 !important;
    border-radius: 5px;
    overflow: hidden;
}

.rgd-edt-canvas-table-wrap[b-s5k95o87f1] {
    width: 100%;
    overflow: auto;
}

.rgd-edt-canvas-table[b-s5k95o87f1] {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    color: #1f2937;
    background: white;
}

.rgd-edt-canvas-table thead tr[b-s5k95o87f1] {
    background: #1a3a5c;
    color: white;
}

.rgd-edt-canvas-table th[b-s5k95o87f1],
.rgd-edt-canvas-table td[b-s5k95o87f1] {
    padding: 4px 8px;
    border: 1px solid #e2e8f0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
    font-size: 11px;
}

.rgd-edt-canvas-table th[b-s5k95o87f1] {
    font-weight: 700;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    position: relative;
    overflow: hidden;
    vertical-align: bottom;
    padding-right: 10px !important;
}

.rgd-edt-canvas-table tbody td[b-s5k95o87f1] {
    color: #94a3b8;
    font-style: italic;
}

.rgd-edt-canvas-table-meta[b-s5k95o87f1] {
    padding: 3px 8px;
    background: #f1f5f9;
    font-size: 10px;
    color: #64748b;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.rgd-edt-canvas-text[b-s5k95o87f1] {
    padding: 4px 6px;
    word-break: break-word;
    line-height: 1.3;
    max-height: 80px;
    overflow: hidden;
    flex: 1;
}

.rgd-edt-canvas-media[b-s5k95o87f1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px;
    color: #64748b;
    font-size: 11px;
}

.rgd-edt-canvas-media i[b-s5k95o87f1] {
    font-size: 1.6rem;
    color: #94a3b8;
}

/* ── CAMPOS DEL REPORTE ────────────────────────────── */
.rgd-edt-fields-wrap[b-s5k95o87f1] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.rgd-edt-field-chip[b-s5k95o87f1] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    background: rgba(6, 182, 212, 0.1);
    border: 1px solid rgba(6, 182, 212, 0.3);
    border-radius: 10px;
    font-size: 11px;
    color: #06b6d4;
    cursor: pointer;
    font-family: ui-monospace, monospace;
    transition: all 0.15s;
}

.rgd-edt-field-chip:hover:not(:disabled)[b-s5k95o87f1] {
    background: rgba(6, 182, 212, 0.22);
    border-color: #06b6d4;
    transform: scale(1.04);
}

.rgd-edt-field-chip:disabled[b-s5k95o87f1] {
    opacity: 0.4;
    cursor: not-allowed;
}

[data-mode="dark"] .rgd-edt-field-chip[b-s5k95o87f1] { color: #67e8f9; }

/* ── RESIZE HANDLE EN COLUMNAS ─────────────────────── */
.rgd-col-resize-handle[b-s5k95o87f1] {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    cursor: col-resize;
    background: transparent;
    z-index: 2;
    border-right: 2px solid transparent;
    transition: border-color 0.1s;
}

.rgd-col-resize-handle:hover[b-s5k95o87f1] {
    border-right-color: var(--rg-primary, #1a3a5c);
    background: rgba(26, 58, 92, 0.1);
}

.rgd-edt-canvas-table th[b-s5k95o87f1] {
    position: relative;
    padding-right: 12px !important; /* espacio para el handle */
}

/* label + badge de ancho en cabecera */
.rgd-canvas-col-label[b-s5k95o87f1] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 8px);
}

.rgd-canvas-col-w[b-s5k95o87f1] {
    display: block;
    font-size: 9px;
    font-weight: 400;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: none;
    letter-spacing: 0;
    line-height: 1;
    margin-top: 1px;
}

/* Badges en celdas de datos del canvas */
.rgd-canvas-fmt-badge[b-s5k95o87f1] {
    display: inline-block;
    padding: 1px 5px;
    background: rgba(99, 102, 241, 0.12);
    border: 1px solid rgba(99, 102, 241, 0.3);
    border-radius: 4px;
    font-size: 9px;
    color: #6366f1;
    font-family: ui-monospace, monospace;
}

.rgd-canvas-agg-badge[b-s5k95o87f1] {
    display: inline-block;
    padding: 1px 5px;
    background: rgba(34, 197, 94, 0.12);
    border: 1px solid rgba(34, 197, 94, 0.3);
    border-radius: 4px;
    font-size: 10px;
    color: #16a34a;
    font-weight: 700;
}

.rgd-canvas-cell-dots[b-s5k95o87f1] {
    color: var(--rg-text-muted, #94a3b8);
    font-style: italic;
    font-size: 11px;
}

[data-mode="dark"] .rgd-canvas-fmt-badge[b-s5k95o87f1] { color: #a5b4fc; }
[data-mode="dark"] .rgd-canvas-agg-badge[b-s5k95o87f1] { color: #86efac; }

/* ── GRILLA DE PROPIEDADES POR COLUMNA ─────────────── */
.rgd-edt-col-grid-header[b-s5k95o87f1] {
    padding: 5px 0 3px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-secondary, #64748b);
    border-top: 1px solid var(--rg-border, #e2e8f0);
    margin-top: 6px;
}

.rgd-edt-col-block[b-s5k95o87f1] {
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 6px;
    padding: 7px 8px 6px;
    margin-bottom: 6px;
    background: var(--rg-bg-subtle, #f8fafc);
}

[data-mode="dark"] .rgd-edt-col-block[b-s5k95o87f1] {
    background: rgba(255,255,255,0.03);
}

.rgd-edt-col-block-hdr[b-s5k95o87f1] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
}

.rgd-edt-col-num[b-s5k95o87f1] {
    font-size: 10px;
    font-weight: 700;
    color: var(--rg-primary, #1a3a5c);
    background: rgba(26, 58, 92, 0.1);
    border-radius: 4px;
    padding: 1px 6px;
}

/* Input pequeño para la grilla por columna */
.rgd-input-sm[b-s5k95o87f1] {
    font-size: 11px !important;
    padding: 3px 5px !important;
    height: auto !important;
}

[data-mode="dark"] .rgd-edt-col-num[b-s5k95o87f1] {
    color: #93c5fd;
    background: rgba(147,197,253,0.12);
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Viewer/RGDDynamicReportViewer.razor.rz.scp.css */
/* 🚀 RGDDynamicReportViewer.razor.css — Estilos del orquestador del visor V6
   Tema oscuro RG con tokens, salvo el lienzo del papel que siempre es blanco. */

@media screen {
    .rgd-print-only[b-jugo6gi3ue] { display: none !important; }

    .rgd-page[b-jugo6gi3ue] {
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
        border-radius: 4px;
    }
}

@media print {
    .rgd-toolbar[b-jugo6gi3ue],
    .rgd-canvas[b-jugo6gi3ue],
    .rgd-viewer[b-jugo6gi3ue] {
        display: none !important;
    }

    .rgd-print-only[b-jugo6gi3ue] { display: block !important; }

    body[b-jugo6gi3ue] {
        background: white !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        height: auto !important;
    }

    .rgd-print-page[b-jugo6gi3ue] {
        background: white !important;
        page-break-after: always !important;
        break-after: page !important;
        position: relative !important;
        overflow: visible;
        box-shadow: none !important;
        border: none !important;
    }
}

.rgd-viewer[b-jugo6gi3ue] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: var(--rg-bg-page, #1e293b);
}

/* ─── TOOLBAR ─────────────────────────────────────── */
.rgd-toolbar[b-jugo6gi3ue] {
    background: var(--rg-bg-card, #0f172a);
    border-bottom: 1px solid var(--rg-border, #334155);
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.rgd-toolbar-pill[b-jugo6gi3ue] {
    display: flex;
    align-items: center;
    gap: 14px;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(10px);
    border-radius: 30px;
    padding: 6px 18px;
    color: var(--rg-text-primary, #e2e8f0);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.rgd-tb-btn[b-jugo6gi3ue] {
    background: transparent;
    border: 0;
    color: var(--rg-text-primary, #e2e8f0);
    cursor: pointer;
    font-size: 13px;
    padding: 4px 8px;
    transition: color 0.15s;
}

.rgd-tb-btn:hover:not(:disabled)[b-jugo6gi3ue] {
    color: var(--rg-accent, #06b6d4);
}

.rgd-tb-btn:disabled[b-jugo6gi3ue] {
    opacity: 0.35;
    cursor: not-allowed;
}

.rgd-tb-info[b-jugo6gi3ue] {
    min-width: 120px;
    text-align: center;
    font-size: 13px;
    color: var(--rg-text-secondary, #94a3b8);
}

.rgd-tb-sep[b-jugo6gi3ue] {
    width: 1px;
    height: 20px;
    background: rgba(255, 255, 255, 0.15);
}

.rgd-tb-print[b-jugo6gi3ue] {
    background: var(--rg-accent, #06b6d4);
    color: #0b1220;
    border: 0;
    padding: 6px 16px;
    border-radius: 20px;
    font-weight: 700;
    cursor: pointer;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: filter 0.15s;
}

.rgd-tb-print:hover[b-jugo6gi3ue] { filter: brightness(1.1); }

/* ─── CANVAS ─────────────────────────────────────── */
.rgd-canvas[b-jugo6gi3ue] {
    flex: 1;
    overflow-y: auto;
    padding: 40px;
    background: #475569;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.rgd-page[b-jugo6gi3ue] {
    background: white;
    color: #1f2937;
    position: relative;
}

/* ─── ESTADOS ────────────────────────────────────── */
.rgd-empty[b-jugo6gi3ue] {
    padding: 60px 20px;
    text-align: center;
    background: var(--rg-bg-card, #1e293b);
    border-radius: 12px;
    border: 1px dashed var(--rg-border, #334155);
    color: var(--rg-text-secondary, #94a3b8);
}

.rgd-empty i[b-jugo6gi3ue] {
    font-size: 3rem;
    color: var(--rg-text-muted, #64748b);
    display: block;
    margin-bottom: 16px;
}

.rgd-empty h3[b-jugo6gi3ue] {
    color: var(--rg-text-primary, #e2e8f0);
    margin-bottom: 8px;
}

.rgd-loading[b-jugo6gi3ue] {
    padding: 80px 20px;
    text-align: center;
    color: #64748b;
}

.rgd-spinner[b-jugo6gi3ue] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--rg-accent, #06b6d4);
    border-radius: 50%;
    animation: rgd-spin-b-jugo6gi3ue 0.7s linear infinite;
    margin: 0 auto 14px;
}

@keyframes rgd-spin-b-jugo6gi3ue { to { transform: rotate(360deg); } }

.rgd-error[b-jugo6gi3ue] {
    background: rgba(239, 68, 68, 0.12);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #fca5a5;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
    width: 100%;
    max-width: 8.5in;
}

.rgd-error-page[b-jugo6gi3ue] {
    padding: 24px;
    color: #b91c1c;
    background: white;
}

/* ─── BANDAS ─────────────────────────────────────── */
.rgd-band[b-jugo6gi3ue] {
    /* Estilo inline define altura por seccion */
}

.rgd-page-area[b-jugo6gi3ue] {
    pointer-events: none;
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Viewer/RGDItemViewer.razor.rz.scp.css */
/* 🎯 RGDItemViewer.razor.css */

.rgd-item[b-97wf8z7yia] {
    /* Container — el style inline define posicion absoluta/relativa segun Dock/X/Y */
}

.rgd-qr-wrapper[b-97wf8z7yia] {
    background: white;
    border: 1px solid #e5e7eb;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    box-sizing: border-box;
}

.rgd-qr-wrapper svg[b-97wf8z7yia] {
    display: block;
    max-width: 100%;
    max-height: 100%;
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Viewer/RGDSectionViewer.razor.rz.scp.css */
/* 📄 RGDSectionViewer.razor.css */

.rgd-section[b-7pa7iuc91c] {
    /* Estilo inline configura altura/min-height segun tipo */
}

.rgd-section-items[b-7pa7iuc91c] {
    position: relative;
    height: 100%;
}
/* _content/Rgclouds.Web/Components/Reporting/Designer/Viewer/RGDTableViewer.razor.rz.scp.css */
/* 📋 RGDTableViewer.razor.css — Estilos del visor de tabla del Designer V6
   El reporte impreso siempre va con fondo blanco y colores corporativos para PDF.
   En tema oscuro de la app, la tabla mantiene fondo blanco (es papel). */

.rgd-table[b-39jfpaieym] {
    background: white;
    color: #1f2937;
    border-collapse: collapse;
    border: 1px solid #cbd5e1;
}

.rgd-table th[b-39jfpaieym],
.rgd-table td[b-39jfpaieym] {
    border: 1px solid #cbd5e1;
    padding: 4px 8px;
    vertical-align: top;
}

/* Cabecera */
.rgd-table-head[b-39jfpaieym] {
    background: #f1f5f9;
    color: #1a3a5c;
}

.rgd-table-head th[b-39jfpaieym] {
    background: #f1f5f9;
    color: #1a3a5c;
    font-weight: 600;
}

/* Pie */
.rgd-table-foot td[b-39jfpaieym] {
    font-weight: 700;
    background: #f1f5f9;
}

/* Grupo */
.rgd-group-header td[b-39jfpaieym] {
    background: #e0f2fe;
    color: #0c4a6e;
    font-weight: 700;
    padding: 6px 10px;
}

.rgd-group-footer td[b-39jfpaieym] {
    background: #f8fafc;
    font-weight: 700;
    border-top: 2px solid #cbd5e1;
}

/* Imagen en celda */
.rgd-cell-image[b-39jfpaieym] {
    height: 30px;
    width: auto;
    max-width: 50px;
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
}

.rgd-cell-image:hover[b-39jfpaieym] {
    border-color: var(--rg-accent, #06b6d4);
    box-shadow: 0 0 0 2px rgba(6, 182, 212, 0.2);
}

/* En modo impresion, garantizar negro sobre blanco */
@media print {
    .rgd-table[b-39jfpaieym],
    .rgd-table-head[b-39jfpaieym],
    .rgd-table-foot[b-39jfpaieym],
    .rgd-group-header[b-39jfpaieym],
    .rgd-group-footer[b-39jfpaieym] {
        color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
}
/* _content/Rgclouds.Web/Components/Shared/AlertBanner.razor.rz.scp.css */
/* ============================================================
   AlertBanner — Banner inline 4 variantes
   ============================================================ */
.rg-alert[b-mys3kvtlsn] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid;
    margin-bottom: 1rem;
    font-size: 0.85rem;
    line-height: 1.45;
}
.rg-alert-icon[b-mys3kvtlsn] { font-size: 1rem; flex-shrink: 0; margin-top: 0.15rem; }
.rg-alert-body[b-mys3kvtlsn] { flex: 1; }
.rg-alert-body b[b-mys3kvtlsn] { font-weight: 700; }

/* Variants — usar tokens más rgba para mantener contraste en ambos modos */
.rg-alert-info[b-mys3kvtlsn]    { background: rgba(37,99,235,0.08);  border-color: rgba(37,99,235,0.3);  color: #1e40af; }
.rg-alert-success[b-mys3kvtlsn] { background: rgba(22,163,74,0.08);  border-color: rgba(22,163,74,0.3);  color: #166534; }
.rg-alert-warning[b-mys3kvtlsn] { background: rgba(217,119,6,0.08);  border-color: rgba(217,119,6,0.3);  color: #92400e; }
.rg-alert-danger[b-mys3kvtlsn]  { background: rgba(220,38,38,0.08);  border-color: rgba(220,38,38,0.3);  color: #991b1b; }

[data-mode="dark"] .rg-alert-info[b-mys3kvtlsn]    { color: #93c5fd; }
[data-mode="dark"] .rg-alert-success[b-mys3kvtlsn] { color: #86efac; }
[data-mode="dark"] .rg-alert-warning[b-mys3kvtlsn] { color: #fcd34d; }
[data-mode="dark"] .rg-alert-danger[b-mys3kvtlsn]  { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Shared/AplicacionDocumentoModal.razor.rz.scp.css */
/* AplicacionDocumentoModal — estilos aislados */
.adm-backdrop[b-6zibmcmwfn] { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1300; }
.adm-container[b-6zibmcmwfn] { position: fixed; inset: 0; z-index: 1301; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.adm-dialog[b-6zibmcmwfn] {
    background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 12px;
    width: 880px; max-width: 96vw; max-height: 88vh;
    display: flex; flex-direction: column;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3); overflow: hidden;
}
.adm-header[b-6zibmcmwfn] {
    padding: .9rem 1.1rem; border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    display: flex; justify-content: space-between; align-items: center;
}
.adm-header h2[b-6zibmcmwfn] { margin: 0; font-size: 1rem; color: var(--rg-text-primary); display: inline-flex; align-items: center; gap: .55rem; }
.adm-header h2 i[b-6zibmcmwfn] { color: var(--rg-info); }
.adm-close[b-6zibmcmwfn] { background: none; border: none; cursor: pointer; width: 32px; height: 32px; border-radius: 6px; color: var(--rg-text-muted); display: inline-flex; align-items: center; justify-content: center; }
.adm-close:hover[b-6zibmcmwfn] { background: var(--rg-bg-hover); color: var(--rg-danger); }
.adm-body[b-6zibmcmwfn] { padding: 1rem 1.1rem; overflow-y: auto; flex: 1; }
.adm-footer[b-6zibmcmwfn] { padding: .75rem 1.1rem; border-top: 1px solid var(--rg-border); background: var(--rg-bg-subtle); display: flex; justify-content: flex-end; gap: .5rem; }

.adm-context[b-6zibmcmwfn] {
    display: flex; gap: 1.25rem; flex-wrap: wrap;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 8px; padding: .55rem .8rem;
    margin-bottom: .6rem;
    font-size: .82rem; color: var(--rg-text-secondary);
}
.adm-context .mono[b-6zibmcmwfn] { font-family: 'Cascadia Code',monospace; color: var(--rg-text-primary); font-weight: 600; }

/* Barra de acciones */
.adm-action-bar[b-6zibmcmwfn] {
    display: flex; justify-content: space-between; align-items: center;
    padding: .6rem .8rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    margin-bottom: .6rem;
    gap: 1rem;
    flex-wrap: wrap;
}
.adm-action-info[b-6zibmcmwfn] { display: flex; align-items: center; gap: .5rem; font-size: .82rem; flex-wrap: wrap; }
.adm-mont-lbl[b-6zibmcmwfn] { color: var(--rg-text-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 600; margin-left: .4rem; }
.adm-mont-val[b-6zibmcmwfn] { font-size: .95rem; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rg-text-primary); padding: 0 .4rem; }
.adm-mont-val.ok[b-6zibmcmwfn]      { color: var(--rg-success); }
.adm-mont-val.partial[b-6zibmcmwfn] { color: var(--rg-warning); }
.adm-mont-val.diff[b-6zibmcmwfn]    { color: var(--rg-danger); }
[data-mode="dark"] .adm-mont-val.ok[b-6zibmcmwfn] { color: #86efac; }

.adm-action-btns[b-6zibmcmwfn] { display: flex; gap: .35rem; }
.adm-btn-sec[b-6zibmcmwfn], .adm-btn-pri[b-6zibmcmwfn] {
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    padding: .35rem .65rem;
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: .3rem;
    transition: all .12s;
}
.adm-btn-sec[b-6zibmcmwfn] { background: var(--rg-bg-card); color: var(--rg-text-secondary); }
.adm-btn-sec:hover[b-6zibmcmwfn] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.adm-btn-pri[b-6zibmcmwfn] { background: var(--rg-bg-subtle); color: var(--rg-primary); border-color: var(--rg-primary); }
.adm-btn-pri:hover[b-6zibmcmwfn] { background: var(--rg-primary); color: #fff; }
[data-mode="dark"] .adm-btn-pri[b-6zibmcmwfn] { color: #93c5fd; border-color: rgba(147,197,253,.5); }
[data-mode="dark"] .adm-btn-pri:hover[b-6zibmcmwfn] { background: var(--rg-accent); color: #fff; }

/* Fila con monto aplicado */
.adm-table tbody tr.applied[b-6zibmcmwfn] { background: rgba(37,99,235,.04); }
[data-mode="dark"] .adm-table tbody tr.applied[b-6zibmcmwfn] { background: rgba(37,99,235,.1); }

/* Input de monto aplicado */
.adm-monto-input[b-6zibmcmwfn] {
    width: 100%;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    padding: .3rem .45rem;
    font-size: .82rem;
    font-weight: 600;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--rg-text-primary);
}
.adm-monto-input:focus[b-6zibmcmwfn] {
    outline: none;
    border-color: var(--rg-accent);
    box-shadow: 0 0 0 2px rgba(37,99,235,.15);
}
.adm-monto-input.filled[b-6zibmcmwfn] {
    background: rgba(37,99,235,.06);
    border-color: rgba(37,99,235,.4);
    color: var(--rg-accent);
}
[data-mode="dark"] .adm-monto-input.filled[b-6zibmcmwfn] { color: #93c5fd; background: rgba(37,99,235,.15); }

.adm-grid-wrap[b-6zibmcmwfn] { border: 1px solid var(--rg-border); border-radius: 8px; overflow: hidden; }
.adm-table[b-6zibmcmwfn] { width: 100%; border-collapse: collapse; font-size: .85rem; }
.adm-table thead th[b-6zibmcmwfn] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .6rem .65rem; border-bottom: 2px solid var(--rg-border); text-align: left; position: sticky; top: 0; }
.adm-table thead th.num[b-6zibmcmwfn] { text-align: right; }
.adm-table tbody tr[b-6zibmcmwfn] { cursor: pointer; transition: background .1s; }
.adm-table tbody tr:hover[b-6zibmcmwfn] { background: var(--rg-bg-hover); }
.adm-table tbody td[b-6zibmcmwfn] { padding: .5rem .65rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.adm-table td.num[b-6zibmcmwfn] { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.adm-table td.mono[b-6zibmcmwfn] { font-family: 'Cascadia Code',monospace; font-size: .8rem; }
.adm-table td.accent[b-6zibmcmwfn] { color: var(--rg-accent); font-weight: 700; }
.adm-table td.saldo[b-6zibmcmwfn] { color: var(--rg-success); font-weight: 700; }
[data-mode="dark"] .adm-table td.saldo[b-6zibmcmwfn] { color: #4ade80; }

.adm-loading[b-6zibmcmwfn], .adm-empty[b-6zibmcmwfn] { text-align: center; padding: 2rem; color: var(--rg-text-muted); display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.adm-empty i[b-6zibmcmwfn] { font-size: 2.5rem; color: var(--rg-success); }
.adm-empty strong[b-6zibmcmwfn] { color: var(--rg-text-primary); font-size: 1rem; }

.spin[b-6zibmcmwfn] { animation: adm-spin-b-6zibmcmwfn 1s linear infinite; }
@keyframes adm-spin-b-6zibmcmwfn { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/CajaActivaGuard.razor.rz.scp.css */
/* ============================================================
   🛡 CajaActivaGuard — Estilos aislados
   ============================================================ */

/* Estado intermedio (verificando) */
.cag-state[b-n2yefu0z1l] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: .75rem; padding: 3rem 1rem;
    color: var(--rg-text-muted, #94a3b8);
}
.cag-spinner[b-n2yefu0z1l] {
    width: 2.5rem; height: 2.5rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: var(--rg-accent, #2563eb);
    border-radius: 50%;
    animation: cag-spin-b-n2yefu0z1l .7s linear infinite;
}
@keyframes cag-spin-b-n2yefu0z1l { to { transform: rotate(360deg); } }

/* Bloqueado: sin sesión activa */
.cag-blocked[b-n2yefu0z1l] {
    display: flex; flex-direction: column; align-items: center;
    gap: 1rem;
    text-align: center;
    padding: 3rem 1.5rem;
    max-width: 480px;
    margin: 2.5rem auto;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 1rem;
    box-shadow: 0 4px 24px rgba(0,0,0,.06);
    animation: cag-slideUp-b-n2yefu0z1l .35s ease-out;
}
@keyframes cag-slideUp-b-n2yefu0z1l { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

.cag-blocked-icon[b-n2yefu0z1l] {
    width: 80px; height: 80px;
    border-radius: 50%;
    background: rgba(220, 38, 38, .08);
    color: var(--rg-danger, #dc2626);
    display: flex; align-items: center; justify-content: center;
    font-size: 2.3rem;
    border: 3px solid rgba(220, 38, 38, .15);
}
.cag-icon-danger[b-n2yefu0z1l] {
    background: rgba(220,38,38,.08);
    color: var(--rg-danger, #dc2626);
    border-color: rgba(220,38,38,.18);
}
.cag-icon-warn[b-n2yefu0z1l] {
    background: rgba(217,119,6,.10);
    color: var(--rg-warning, #d97706);
    border-color: rgba(217,119,6,.22);
}
[data-mode="dark"] .cag-icon-danger[b-n2yefu0z1l] { background: rgba(220,38,38,.18); }
[data-mode="dark"] .cag-icon-warn[b-n2yefu0z1l]   { background: rgba(217,119,6,.22); }

/* ── Lista de cajas asignadas (caso 2) ────────────────────────────── */
.cag-cajas-list[b-n2yefu0z1l] {
    display: flex; flex-direction: column; gap: .4rem;
    width: 100%; max-width: 380px;
    margin-top: .25rem;
}
.cag-caja-row[b-n2yefu0z1l] {
    display: flex; align-items: center; gap: .55rem;
    padding: .55rem .75rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
}
.cag-caja-row i[b-n2yefu0z1l] { color: var(--rg-accent, #2563eb); font-size: 1rem; }
.cag-caja-name[b-n2yefu0z1l] { flex: 1; }
.cag-caja-rol[b-n2yefu0z1l] {
    font-size: .7rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em;
    padding: .15rem .5rem;
    background: rgba(37,99,235,.1);
    color: var(--rg-accent, #2563eb);
    border-radius: 999px;
}
[data-mode="dark"] .cag-caja-row[b-n2yefu0z1l] { background: rgba(255,255,255,.04); }

/* ── Bloque de contacto al admin (caso 1) ─────────────────────────── */
.cag-contact-box[b-n2yefu0z1l] {
    display: flex; gap: .65rem; align-items: flex-start;
    padding: .65rem .85rem;
    background: rgba(37,99,235,.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 .55rem .55rem 0;
    font-size: .82rem;
    color: var(--rg-text-secondary, #475569);
    text-align: left;
    width: 100%;
    max-width: 380px;
}
.cag-contact-box i[b-n2yefu0z1l] {
    color: var(--rg-accent, #2563eb);
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: .1rem;
}
[data-mode="dark"] .cag-contact-box[b-n2yefu0z1l] { background: rgba(37,99,235,.15); }

.cag-blocked-title[b-n2yefu0z1l] {
    font-size: 1.15rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0;
}
.cag-blocked-text[b-n2yefu0z1l] {
    font-size: .88rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0;
    max-width: 380px;
    line-height: 1.55;
}
.cag-blocked-actions[b-n2yefu0z1l] {
    display: flex; gap: .65rem;
    margin-top: .25rem;
}
.cag-blocked-hint[b-n2yefu0z1l] {
    display: flex; gap: .4rem; align-items: flex-start;
    margin-top: .75rem;
    padding: .65rem .8rem;
    background: rgba(37,99,235,.06);
    border-left: 3px solid var(--rg-accent, #2563eb);
    border-radius: 0 .4rem .4rem 0;
    font-size: .75rem;
    color: var(--rg-text-secondary, #475569);
    text-align: left;
    max-width: 380px;
}
[data-mode="dark"] .cag-blocked-hint[b-n2yefu0z1l] { background: rgba(37,99,235,.12); }

/* Banner verde arriba cuando sí hay caja */
.cag-banner[b-n2yefu0z1l] {
    display: flex; justify-content: space-between; align-items: center;
    background: linear-gradient(90deg, rgba(22,163,74,.08), rgba(22,163,74,.02));
    border: 1px solid rgba(22,163,74,.25);
    border-radius: .55rem;
    padding: .5rem .85rem;
    margin-bottom: .75rem;
}
.cag-banner-left[b-n2yefu0z1l] { display: flex; align-items: center; gap: .65rem; }
.cag-banner-icon[b-n2yefu0z1l] { color: var(--rg-success, #16a34a); font-size: 1.25rem; }
.cag-banner-label[b-n2yefu0z1l] {
    font-size: .65rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em;
    color: var(--rg-text-muted, #94a3b8);
}
.cag-banner-value[b-n2yefu0z1l] {
    font-size: .85rem;
    color: var(--rg-text-primary, #1e293b);
    display: flex; gap: .4rem; align-items: baseline;
}
.cag-banner-num[b-n2yefu0z1l] { font-weight: 700; color: var(--rg-success, #16a34a); }
.cag-banner-caja[b-n2yefu0z1l] { font-size: .78rem; color: var(--rg-text-secondary, #475569); }
.font-mono[b-n2yefu0z1l] { font-family: 'Cascadia Code', 'Fira Code', monospace; }

/* Botón Cerrar Caja en el banner verde */
.cag-cierre-btn[b-n2yefu0z1l] {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .45rem .85rem;
    border: 1px solid rgba(220,38,38,.35);
    border-radius: .5rem;
    background: rgba(220,38,38,.08);
    color: var(--rg-danger, #dc2626);
    font-size: .8rem; font-weight: 600;
    cursor: pointer;
    transition: all .15s;
    white-space: nowrap;
}
.cag-cierre-btn:hover[b-n2yefu0z1l] {
    background: var(--rg-danger, #dc2626);
    color: #fff;
    border-color: var(--rg-danger, #dc2626);
}
[data-mode="dark"] .cag-cierre-btn[b-n2yefu0z1l] { background: rgba(220,38,38,.15); }
[data-mode="dark"] .cag-cierre-btn:hover[b-n2yefu0z1l] { background: var(--rg-danger, #dc2626); color: #fff; }
/* _content/Rgclouds.Web/Components/Shared/CentroCostoPickerModal.razor.rz.scp.css */
/* CentroCostoPickerModal — estilos aislados */
.cco-backdrop[b-0kyxzothph] { position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 1200; }
.cco-container[b-0kyxzothph] { position: fixed; inset: 0; z-index: 1201; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.cco-dialog[b-0kyxzothph] {
    background: var(--rg-bg-card); border: 1px solid var(--rg-border); border-radius: 12px;
    width: 640px; max-width: 96vw; max-height: 88vh;
    display: flex; flex-direction: column;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3); overflow: hidden;
}
.cco-header[b-0kyxzothph] {
    padding: .9rem 1.1rem; border-bottom: 1px solid var(--rg-border);
    display: flex; justify-content: space-between; align-items: center;
    background: var(--rg-bg-subtle);
}
.cco-header h2[b-0kyxzothph] { margin: 0; font-size: 1rem; color: var(--rg-text-primary); display: inline-flex; align-items: center; gap: .55rem; }
.cco-header h2 i[b-0kyxzothph] { color: var(--rg-primary); }
.cco-close[b-0kyxzothph] { background: none; border: none; cursor: pointer; width: 32px; height: 32px; border-radius: 6px; color: var(--rg-text-muted); display: inline-flex; align-items: center; justify-content: center; }
.cco-close:hover[b-0kyxzothph] { background: var(--rg-bg-hover); color: var(--rg-danger); }
.cco-body[b-0kyxzothph] { padding: 1rem 1.1rem; overflow-y: auto; flex: 1; }
.cco-footer[b-0kyxzothph] { padding: .75rem 1.1rem; border-top: 1px solid var(--rg-border); background: var(--rg-bg-subtle); display: flex; justify-content: flex-end; gap: .5rem; }
.cco-search[b-0kyxzothph] { display: flex; align-items: center; gap: .4rem; margin-bottom: .75rem; background: var(--rg-bg-input); border: 1px solid var(--rg-border); border-radius: 8px; padding: .35rem .5rem; }
.cco-search input[b-0kyxzothph] { flex: 1; border: none; outline: none; background: transparent; color: var(--rg-text-primary); font-size: .87rem; padding: .25rem .35rem; }
.cco-search-btn[b-0kyxzothph], .cco-search-clear[b-0kyxzothph] { background: none; border: none; cursor: pointer; color: var(--rg-text-muted); width: 28px; height: 28px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; }
.cco-search-btn:hover[b-0kyxzothph], .cco-search-clear:hover[b-0kyxzothph] { background: var(--rg-bg-hover); color: var(--rg-accent); }
.cco-count[b-0kyxzothph] { font-size: .72rem; color: var(--rg-text-muted); padding: 0 .5rem; font-weight: 600; }
.cco-grid-wrap[b-0kyxzothph] { border: 1px solid var(--rg-border); border-radius: 8px; overflow: hidden; }
.cco-table[b-0kyxzothph] { width: 100%; border-collapse: collapse; font-size: .85rem; }
.cco-table thead th[b-0kyxzothph] { background: var(--rg-bg-subtle); color: var(--rg-text-secondary); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .6rem .65rem; border-bottom: 2px solid var(--rg-border); text-align: left; position: sticky; top: 0; }
.cco-table tbody tr[b-0kyxzothph] { cursor: pointer; transition: background .1s; }
.cco-table tbody tr:hover[b-0kyxzothph] { background: var(--rg-bg-hover); }
.cco-table tbody td[b-0kyxzothph] { padding: .5rem .65rem; border-bottom: 1px solid var(--rg-border); color: var(--rg-text-primary); }
.cco-table td.mono[b-0kyxzothph] { font-family: 'Cascadia Code','Fira Code',Consolas,monospace; font-size: .8rem; color: var(--rg-accent); font-weight: 600; }
.cco-loading[b-0kyxzothph], .cco-empty[b-0kyxzothph] { text-align: center; padding: 2rem; color: var(--rg-text-muted); display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.cco-empty i[b-0kyxzothph] { font-size: 2rem; }
.spin[b-0kyxzothph] { animation: cco-spin-b-0kyxzothph 1s linear infinite; }
@keyframes cco-spin-b-0kyxzothph { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/CentroCostoSmartInput.razor.rz.scp.css */
/* ============================================================
   🏢 CentroCostoSmartInput.razor.css
   Tokens --rg-* (light/dark). Sin hex hardcoded fuera de rgba().
   ============================================================ */

.cco-wrap[b-931efq0flt] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.2rem;
}

.cco-input-row[b-931efq0flt] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
}

.cco-input[b-931efq0flt] {
    flex: 1;
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.45rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.cco-input[b-931efq0flt]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.cco-input:focus[b-931efq0flt] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.cco-input:disabled[b-931efq0flt] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    cursor: not-allowed;
}

.cco-icon[b-931efq0flt] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--rg-text-muted, #94a3b8);
    pointer-events: none;
}

.cco-spin i[b-931efq0flt] {
    display: inline-block;
    animation: cco-rotate-b-931efq0flt 0.9s linear infinite;
    color: var(--rg-primary, #2563eb);
}

@keyframes cco-rotate-b-931efq0flt { to { transform: rotate(360deg); } }

.cco-clear[b-931efq0flt] {
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    border-radius: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    padding: 0;
}

.cco-clear:hover[b-931efq0flt] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
}

.cco-drop[b-931efq0flt] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: cco-fade-b-931efq0flt 0.12s ease-out;
}

@keyframes cco-fade-b-931efq0flt {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.cco-item[b-931efq0flt] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-primary, #1e293b);
    transition: background-color 0.1s;
    font-size: 0.85rem;
}

.cco-item:last-child[b-931efq0flt] { border-bottom: none; }

.cco-item:hover[b-931efq0flt],
.cco-item.active[b-931efq0flt] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.cco-item-id[b-931efq0flt] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

[data-mode="dark"] .cco-item-id[b-931efq0flt] { color: #93c5fd; }

.cco-item-name[b-931efq0flt] {
    flex: 1;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cco-hint-row[b-931efq0flt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.cco-hint[b-931efq0flt] {
    font-size: 0.78rem;
    font-weight: 600;
}

.cco-hint.ok[b-931efq0flt]  { color: var(--rg-success, #16a34a); }
.cco-hint.err[b-931efq0flt] { color: var(--rg-danger, #dc2626); }

[data-mode="dark"] .cco-hint.ok[b-931efq0flt]  { color: #86efac; }
[data-mode="dark"] .cco-hint.err[b-931efq0flt] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Shared/ChatAgentePinGate.razor.rz.scp.css */
/* ── Gate de identificación por PIN ── */
.opg-shell[b-jticsig9pz] { min-height: calc(100vh - 160px); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem 1rem; outline:none; }
.opg-header[b-jticsig9pz] { text-align:center; margin-bottom:1.6rem; }
.opg-brand[b-jticsig9pz] { width:44px; height:44px; border-radius:12px; background:var(--rg-primary,#1a3a5c); color:#fff; font-weight:700; font-size:22px; display:inline-flex; align-items:center; justify-content:center; margin-bottom:.6rem; }
.opg-title[b-jticsig9pz] { font-size:1.4rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.opg-sub[b-jticsig9pz] { font-size:.82rem; color:var(--rg-text-muted,#94a3b8); margin-top:.25rem; }
.opg-pill[b-jticsig9pz] { display:inline-flex; align-items:center; gap:.4rem; background:var(--rg-bg-subtle,#f1f5f9); border:1px solid var(--rg-border,#e2e8f0); padding:.3rem .8rem; border-radius:100px; font-size:.74rem; color:var(--rg-text-secondary,#475569); margin-top:.7rem; }
.opg-dot[b-jticsig9pz] { opacity:.5; }
.opg-on[b-jticsig9pz] { font-size:7px; color:#16a34a; }

.opg-card[b-jticsig9pz] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:16px; box-shadow:0 24px 64px rgba(0,0,0,.18); width:100%; max-width:860px; overflow:hidden; display:grid; grid-template-columns:1fr 320px; }
@media (max-width:760px){ .opg-card[b-jticsig9pz] { grid-template-columns:1fr; } }

/* usuarios */
.opg-users[b-jticsig9pz] { padding:1.4rem; }
.opg-users-title[b-jticsig9pz] { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--rg-text-muted,#94a3b8); font-weight:700; margin-bottom:1rem; }
.opg-empty[b-jticsig9pz] { color:var(--rg-text-muted,#94a3b8); font-size:.85rem; padding:1.5rem 0; text-align:center; }
.opg-grid[b-jticsig9pz] { display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
@media (max-width:760px){ .opg-grid[b-jticsig9pz] { grid-template-columns:repeat(2,1fr); } }
.opg-tile[b-jticsig9pz] { border:1px solid var(--rg-border,#e2e8f0); border-radius:.7rem; padding:1rem .6rem; text-align:center; cursor:pointer; background:var(--rg-bg-card,#fff); transition:all .12s; display:flex; flex-direction:column; align-items:center; gap:.1rem; }
.opg-tile:hover:not(:disabled)[b-jticsig9pz] { border-color:var(--rg-primary,#1a3a5c); background:var(--rg-bg-hover,#f8fafc); }
.opg-tile.sel[b-jticsig9pz] { border-color:var(--rg-primary,#1a3a5c); background:rgba(26,58,92,.06); box-shadow:0 0 0 3px rgba(26,58,92,.12); }
.opg-tile.lock[b-jticsig9pz] { opacity:.55; cursor:not-allowed; border-style:dashed; }
.opg-tile:disabled[b-jticsig9pz] { cursor:not-allowed; }
.opg-avatar[b-jticsig9pz] { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; margin-bottom:.4rem; }
.opg-avatar-lg[b-jticsig9pz] { width:56px; height:56px; margin:0 auto .5rem; }
.opg-name[b-jticsig9pz] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.opg-role[b-jticsig9pz] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); }
.opg-badge[b-jticsig9pz] { margin-top:.4rem; font-size:.66rem; font-weight:700; padding:.1rem .5rem; border-radius:1rem; }
.opg-badge.lock[b-jticsig9pz] { background:rgba(220,38,38,.12); color:#dc2626; }
.opg-badge.nopin[b-jticsig9pz] { background:rgba(148,163,184,.18); color:var(--rg-text-muted,#94a3b8); }

/* pin */
.opg-pin[b-jticsig9pz] { background:var(--rg-bg-page,#f8fafc); border-left:1px solid var(--rg-border,#e2e8f0); padding:1.4rem 1.2rem; display:flex; flex-direction:column; }
@media (max-width:760px){ .opg-pin[b-jticsig9pz] { border-left:none; border-top:1px solid var(--rg-border,#e2e8f0); } }
.opg-pin-empty[b-jticsig9pz] { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.82rem; padding:2rem 0; }
.opg-pin-empty i[b-jticsig9pz] { font-size:2rem; }
.opg-pin-user[b-jticsig9pz] { text-align:center; margin-bottom:1rem; }
.opg-pin-name[b-jticsig9pz] { font-weight:700; font-size:.9rem; color:var(--rg-text-primary,#1e293b); }
.opg-pin-hint2[b-jticsig9pz] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.opg-display[b-jticsig9pz] { display:flex; justify-content:center; gap:.75rem; margin-bottom:1.2rem; }
.opg-digit[b-jticsig9pz] { width:16px; height:16px; border-radius:50%; border:2px solid var(--rg-border,#cbd5e1); }
.opg-digit.on[b-jticsig9pz] { background:var(--rg-primary,#1a3a5c); border-color:var(--rg-primary,#1a3a5c); }
.opg-pad[b-jticsig9pz] { display:grid; grid-template-columns:repeat(3,1fr); gap:.55rem; }
.opg-key[b-jticsig9pz] { aspect-ratio:1.5; border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; background:var(--rg-bg-card,#fff); font-family:'Cascadia Code',monospace; font-size:1.25rem; font-weight:700; cursor:pointer; color:var(--rg-text-primary,#1e293b); transition:all .1s; }
.opg-key:hover:not(:disabled)[b-jticsig9pz] { background:var(--rg-bg-hover,#f1f5f9); border-color:var(--rg-primary,#1a3a5c); }
.opg-key:disabled[b-jticsig9pz] { opacity:.5; cursor:not-allowed; }
.opg-key.act[b-jticsig9pz] { font-size:1rem; color:var(--rg-text-secondary,#475569); }
.opg-key.ok[b-jticsig9pz] { background:var(--rg-primary,#1a3a5c); color:#fff; border-color:var(--rg-primary,#1a3a5c); }
.opg-error[b-jticsig9pz] { background:rgba(220,38,38,.1); color:#dc2626; border-radius:.4rem; padding:.5rem .75rem; font-size:.76rem; text-align:center; margin-top:.75rem; display:flex; align-items:center; justify-content:center; gap:.4rem; }
.opg-foot[b-jticsig9pz] { text-align:center; font-size:.7rem; color:var(--rg-text-muted,#94a3b8); margin-top:1rem; }
.spin[b-jticsig9pz] { animation: opgspin-b-jticsig9pz .8s linear infinite; } @keyframes opgspin-b-jticsig9pz { to { transform:rotate(360deg);} }
/* _content/Rgclouds.Web/Components/Shared/ClgConfigGuard.razor.rz.scp.css */
/* ── ClgConfigGuard ────────────────────────────────────────────────── */

.ccg-state[b-xu69to2w7w] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: .75rem; padding: 3rem 1rem;
    color: var(--rg-text-muted, #94a3b8);
}
.ccg-spinner[b-xu69to2w7w] {
    width: 2.5rem; height: 2.5rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: var(--rg-accent, #2563eb);
    border-radius: 50%;
    animation: ccg-spin-b-xu69to2w7w .7s linear infinite;
}
@keyframes ccg-spin-b-xu69to2w7w { to { transform: rotate(360deg); } }

.ccg-blocked[b-xu69to2w7w] {
    display: flex; flex-direction: column; align-items: center;
    gap: 1rem;
    text-align: center;
    padding: 2.5rem 1.5rem;
    max-width: 580px;
    margin: 2rem auto;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 1rem;
    box-shadow: 0 4px 24px rgba(0,0,0,.06);
    animation: ccg-slideUp-b-xu69to2w7w .35s ease-out;
}
@keyframes ccg-slideUp-b-xu69to2w7w { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

.ccg-blocked-icon[b-xu69to2w7w] {
    width: 84px; height: 84px;
    border-radius: 50%;
    background: rgba(217,119,6,.10);
    color: var(--rg-warning, #d97706);
    display: flex; align-items: center; justify-content: center;
    font-size: 2.4rem;
    border: 3px solid rgba(217,119,6,.20);
}
[data-mode="dark"] .ccg-blocked-icon[b-xu69to2w7w] { background: rgba(217,119,6,.20); }

.ccg-blocked-title[b-xu69to2w7w] {
    font-size: 1.2rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0;
}
.ccg-blocked-text[b-xu69to2w7w] {
    font-size: .88rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0;
    max-width: 480px;
    line-height: 1.55;
}

.ccg-faltantes[b-xu69to2w7w] {
    width: 100%;
    background: rgba(220,38,38,.05);
    border: 1px solid rgba(220,38,38,.20);
    border-radius: .55rem;
    padding: .75rem 1rem;
    text-align: left;
}
.ccg-faltantes-title[b-xu69to2w7w] {
    font-size: .78rem;
    font-weight: 700;
    color: var(--rg-danger, #dc2626);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: .5rem;
    display: flex; align-items: center; gap: .4rem;
}
.ccg-faltantes ul[b-xu69to2w7w] { list-style: none; padding: 0; margin: 0; }
.ccg-faltantes li[b-xu69to2w7w] {
    font-size: .82rem;
    color: var(--rg-text-primary, #1e293b);
    padding: .25rem 0;
    display: flex; align-items: center; gap: .45rem;
}
.ccg-faltantes li i[b-xu69to2w7w] { color: var(--rg-danger, #dc2626); font-size: .85rem; flex-shrink: 0; }
[data-mode="dark"] .ccg-faltantes[b-xu69to2w7w] { background: rgba(220,38,38,.12); }

.ccg-contact-box[b-xu69to2w7w] {
    display: flex; gap: .65rem; align-items: flex-start;
    padding: .75rem 1rem;
    background: rgba(37,99,235,.07);
    border-left: 4px solid var(--rg-accent, #2563eb);
    border-radius: 0 .55rem .55rem 0;
    font-size: .82rem;
    color: var(--rg-text-secondary, #475569);
    text-align: left;
    width: 100%;
    max-width: 480px;
}
.ccg-contact-box i[b-xu69to2w7w] {
    color: var(--rg-accent, #2563eb);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: .05rem;
}
[data-mode="dark"] .ccg-contact-box[b-xu69to2w7w] { background: rgba(37,99,235,.15); }

.ccg-blocked-actions[b-xu69to2w7w] {
    display: flex; gap: .65rem;
    margin-top: .35rem;
}

.btn-crud[b-xu69to2w7w] {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .55rem 1.1rem;
    border: none; border-radius: .5rem;
    font-size: .82rem; font-weight: 600;
    cursor: pointer;
    transition: all .15s;
}
.btn-primary[b-xu69to2w7w] { background: var(--rg-accent, #2563eb); color: #fff; }
.btn-primary:hover[b-xu69to2w7w] { filter: brightness(1.1); }
.btn-outline[b-xu69to2w7w] {
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}
.btn-outline:hover[b-xu69to2w7w] { background: var(--rg-bg-hover, #f1f5f9); }
/* _content/Rgclouds.Web/Components/Shared/ClientAutocomplete.razor.rz.scp.css */
/* ============================================================
   🔎 ClientAutocomplete.razor.css
   Usa tokens --rg-* (light/dark) para integrarse con el tema.
   ============================================================ */

.ca-wrapper[b-bwjkdinm3t] {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.ca-input[b-bwjkdinm3t] {
    flex: 1;
    width: 100%;
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 6px;
    font-size: 0.9rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.ca-input[b-bwjkdinm3t]::placeholder {
    color: var(--rg-text-muted, #94a3b8);
}

.ca-input:focus[b-bwjkdinm3t] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.ca-input:disabled[b-bwjkdinm3t] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted);
    cursor: not-allowed;
}

/* ---------- Ícono de estado ---------- */
.ca-status-icon[b-bwjkdinm3t]       { font-size: 1rem; flex-shrink: 0; }
.ca-status-icon.ca-ok[b-bwjkdinm3t] { color: var(--rg-success, #16a34a); }
.ca-status-icon.ca-new[b-bwjkdinm3t]{ color: var(--rg-accent, #2563eb); }
.ca-spin[b-bwjkdinm3t]              { animation: ca-rotate-b-bwjkdinm3t 0.9s linear infinite; color: var(--rg-primary, #1a3a5c); }

/* ---------- Botón limpiar ---------- */
.ca-clear-btn[b-bwjkdinm3t] {
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.18s ease;
    font-size: 0.75rem;
    padding: 0;
}
.ca-clear-btn:hover[b-bwjkdinm3t] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
    border-color: var(--rg-danger, #dc2626);
    transform: scale(1.05);
}

@keyframes ca-rotate-b-bwjkdinm3t { to { transform: rotate(360deg); } }

/* ---------- Dropdown flotante ---------- */
.ca-dropdown[b-bwjkdinm3t] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: ca-fade-slide-b-bwjkdinm3t 0.15s ease-out;
}
@keyframes ca-fade-slide-b-bwjkdinm3t {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Ítems ---------- */
.ca-item[b-bwjkdinm3t] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    transition: background-color 0.12s;
    color: var(--rg-text-primary, #1e293b);
}
.ca-item:last-child[b-bwjkdinm3t] { border-bottom: none; }

.ca-item:hover[b-bwjkdinm3t],
.ca-item.active[b-bwjkdinm3t] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.ca-item-icon[b-bwjkdinm3t] {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
    color: #ffffff;
    font-size: 1rem;
    flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.25);
}

.ca-item-body[b-bwjkdinm3t] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ca-item-name[b-bwjkdinm3t] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ca-item-meta[b-bwjkdinm3t] {
    font-size: 0.76rem;
    color: var(--rg-text-secondary, #64748b);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.ca-item-id[b-bwjkdinm3t] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 4px;
    font-weight: 600;
}
[data-mode="dark"] .ca-item-id[b-bwjkdinm3t] { color: #93c5fd; }

.ca-item-sep[b-bwjkdinm3t] { color: var(--rg-text-muted, #94a3b8); }

/* ---------- Hint de más resultados ---------- */
.ca-more[b-bwjkdinm3t] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.55rem 0.85rem;
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #64748b);
    font-size: 0.78rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    font-style: italic;
}

/* ---------- Empty state ---------- */
.ca-empty[b-bwjkdinm3t] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 0.85rem;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.85rem;
    justify-content: center;
}
.ca-empty i[b-bwjkdinm3t] { font-size: 1.1rem; }
/* _content/Rgclouds.Web/Components/Shared/ClientePickerModal.razor.rz.scp.css */
/* ============================================================
   ClientePickerModal.razor.css — estilos aislados del modal
   Componente compartido — diseño consistente para toda la app.
   ============================================================ */

/* Modal — clases prefijadas para evitar conflicto con Bootstrap (.modal-dialog tiene pointer-events:none) */
.cpm-backdrop[b-qxz8fnasze] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 1040;
    pointer-events: auto;
    animation: cpm-fade-in-b-qxz8fnasze .15s ease;
}
.cpm-container[b-qxz8fnasze] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1050;
    padding: 1rem;
    pointer-events: none;  /* deja pasar clicks fuera del dialog */
}
.cpm-dialog[b-qxz8fnasze] {
    pointer-events: auto;  /* dialog SÍ recibe clicks */
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: .75rem;
    box-shadow: 0 20px 50px rgba(0,0,0,.3);
    max-height: 90vh;
    max-width: 820px; width: 95vw;
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: cpm-slide-in-b-qxz8fnasze .2s ease;
}
@keyframes cpm-fade-in-b-qxz8fnasze { from { opacity: 0; } to { opacity: 1; } }
@keyframes cpm-slide-in-b-qxz8fnasze { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }

/* Header / Body / Footer (clases prefijadas) */
.cpm-header[b-qxz8fnasze] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
}
.cpm-header h2[b-qxz8fnasze] {
    font-size: 1.05rem; font-weight: 700; color: var(--rg-text-primary);
    display: flex; align-items: center; gap: .5rem;
    margin: 0;
}
.cpm-header h2 i[b-qxz8fnasze] { color: var(--rg-primary); }
.cpm-close[b-qxz8fnasze] {
    border: none; background: transparent; cursor: pointer;
    color: var(--rg-text-secondary); font-size: 1.1rem;
    padding: .25rem .5rem; border-radius: 4px;
}
.cpm-close:hover[b-qxz8fnasze] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }

.cpm-body[b-qxz8fnasze] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.cpm-footer[b-qxz8fnasze] {
    display: flex; justify-content: flex-end; gap: .5rem;
    padding: .75rem 1.25rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
}

/* Búsqueda */
.crud-search-bar[b-qxz8fnasze] {
    display: flex; align-items: center; gap: .5rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: .35rem .5rem .35rem .75rem;
    margin-bottom: .75rem;
}
.crud-search-bar > i.bi-search[b-qxz8fnasze] { color: var(--rg-text-muted); font-size: .9rem; }
.crud-search-bar input[b-qxz8fnasze] {
    flex: 1;
    background: transparent;
    border: none;
    color: var(--rg-text-primary);
    font-size: .9rem;
    padding: .25rem 0;
    outline: none;
}
.crud-search-clear[b-qxz8fnasze] {
    border: none; background: transparent; cursor: pointer;
    color: var(--rg-text-muted); padding: 0 .35rem;
}
.crud-search-clear:hover[b-qxz8fnasze] { color: var(--rg-danger); }

.btn-crud[b-qxz8fnasze] {
    display: inline-flex; align-items: center; gap: .35rem;
    border-radius: 6px;
    padding: .4rem .75rem;
    font-size: .85rem; font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background .12s, border-color .12s;
}
.btn-crud.btn-sm[b-qxz8fnasze] { padding: .3rem .6rem; font-size: .8rem; }
.btn-crud.btn-primary[b-qxz8fnasze] { background: var(--rg-primary); color: #fff; border-color: var(--rg-primary); }
.btn-crud.btn-primary:hover:not(:disabled)[b-qxz8fnasze] { filter: brightness(1.08); }
.btn-crud.btn-outline[b-qxz8fnasze] { background: transparent; color: var(--rg-text-primary); border-color: var(--rg-border); }
.btn-crud.btn-outline:hover[b-qxz8fnasze] { background: var(--rg-bg-hover); }
.btn-crud:disabled[b-qxz8fnasze] { opacity: .55; cursor: not-allowed; }

/* Grid resultados */
.cpm-grid[b-qxz8fnasze] {
    border: 1px solid var(--rg-border);
    border-radius: .5rem;
    overflow: auto;
    max-height: 420px;
}
.crud-table[b-qxz8fnasze] {
    width: 100%;
    border-collapse: collapse;
    font-size: .85rem;
    table-layout: fixed;
}
.crud-table thead[b-qxz8fnasze] { position: sticky; top: 0; z-index: 1; }
.crud-table th[b-qxz8fnasze] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600; text-align: left;
    padding: .55rem .75rem;
    border-bottom: 2px solid var(--rg-border);
    white-space: nowrap;
    font-size: .72rem;
    text-transform: uppercase; letter-spacing: .03em;
}
.crud-table td[b-qxz8fnasze] {
    padding: .55rem .75rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.crud-table tbody tr:hover[b-qxz8fnasze] { background: var(--rg-bg-hover); }

.font-mono[b-qxz8fnasze] { font-family: 'Cascadia Code','Fira Code','Courier New',monospace; font-size: .82rem; }
.text-center[b-qxz8fnasze] { text-align: center; }
.text-muted[b-qxz8fnasze] { color: var(--rg-text-muted); }

.spin[b-qxz8fnasze] { animation: cpm-spin-b-qxz8fnasze 1s linear infinite; }
@keyframes cpm-spin-b-qxz8fnasze { from { transform: rotate(0); } to { transform: rotate(360deg); } }

.cpm-more[b-qxz8fnasze] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    font-size: .78rem;
    text-align: center;
    padding: .55rem;
}

.crud-spinner-sm[b-qxz8fnasze] {
    display: inline-block;
    width: 16px; height: 16px;
    border: 2px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: cpm-spin-b-qxz8fnasze .7s linear infinite;
    vertical-align: middle;
}
/* _content/Rgclouds.Web/Components/Shared/ClienteSmartInput.razor.rz.scp.css */
/* ============================================================
   👤 ClienteSmartInput.razor.css
   Tokens --rg-* (light/dark). Sin hex hardcoded fuera de rgba().
   ============================================================ */

.csi-wrap[b-rltf2ep5dn] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.2rem;
}

.csi-input-row[b-rltf2ep5dn] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
}

.csi-input[b-rltf2ep5dn] {
    flex: 1;
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.45rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.csi-input[b-rltf2ep5dn]::placeholder {
    color: var(--rg-text-muted, #94a3b8);
}

.csi-input:focus[b-rltf2ep5dn] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.csi-input:disabled[b-rltf2ep5dn] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    cursor: not-allowed;
}

/* ── Ícono de estado / botones laterales ──────────────────── */
.csi-icon[b-rltf2ep5dn] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--rg-text-muted, #94a3b8);
    pointer-events: none;
}

.csi-spin i[b-rltf2ep5dn] {
    display: inline-block;
    animation: csi-rotate-b-rltf2ep5dn 0.9s linear infinite;
    color: var(--rg-primary, #2563eb);
}

@keyframes csi-rotate-b-rltf2ep5dn { to { transform: rotate(360deg); } }

.csi-clear[b-rltf2ep5dn] {
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    border-radius: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    padding: 0;
}

.csi-clear:hover[b-rltf2ep5dn] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
}

.csi-picker[b-rltf2ep5dn] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-card, #ffffff);
    color: var(--rg-text-secondary, #475569);
    border-radius: 0.45rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.csi-picker:hover[b-rltf2ep5dn] {
    background: var(--rg-bg-hover);
    border-color: var(--rg-primary);
    color: var(--rg-primary);
}

.csi-picker:disabled[b-rltf2ep5dn] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Dropdown flotante ────────────────────────────────────── */
.csi-drop[b-rltf2ep5dn] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: csi-fade-b-rltf2ep5dn 0.12s ease-out;
}

@keyframes csi-fade-b-rltf2ep5dn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.csi-item[b-rltf2ep5dn] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-primary, #1e293b);
    transition: background-color 0.1s;
    font-size: 0.85rem;
}

.csi-item:last-child[b-rltf2ep5dn] { border-bottom: none; }

.csi-item:hover[b-rltf2ep5dn],
.csi-item.active[b-rltf2ep5dn] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.csi-item-id[b-rltf2ep5dn] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

[data-mode="dark"] .csi-item-id[b-rltf2ep5dn] { color: #93c5fd; }

.csi-item-name[b-rltf2ep5dn] {
    flex: 1;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.csi-item-meta[b-rltf2ep5dn] {
    color: var(--rg-text-muted, #94a3b8);
    font-size: 0.75rem;
    font-family: "Cascadia Code", monospace;
}

/* ── Hint (✔ / ✘) ────────────────────────────────────────── */
.csi-hint[b-rltf2ep5dn] {
    font-size: 0.78rem;
    margin-top: 0.2rem;
    font-weight: 600;
}

.csi-hint.ok[b-rltf2ep5dn]  { color: var(--rg-success, #16a34a); }
.csi-hint.err[b-rltf2ep5dn] { color: var(--rg-danger, #dc2626); }

/* Candado inline cuando el input está bloqueado (cliente seleccionado y confirmado).
   Aparece justo antes del ✔ Nombre — ahorra una línea vs. mostrarlo aparte. */
.csi-lock[b-rltf2ep5dn] {
    margin-right: 0.25rem;
    color: var(--rg-success, #16a34a);
    font-size: 0.85rem;
}
[data-mode="dark"] .csi-lock[b-rltf2ep5dn] { color: #86efac; }

[data-mode="dark"] .csi-hint.ok[b-rltf2ep5dn]  { color: #86efac; }
[data-mode="dark"] .csi-hint.err[b-rltf2ep5dn] { color: #fca5a5; }

/* ── Hint row con badge DGII ─────────────────────────────── */
.csi-hint-row[b-rltf2ep5dn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.csi-badge-dgii[b-rltf2ep5dn],
.csi-badge-dgii-loading[b-rltf2ep5dn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.5rem;
    border-radius: 1rem;
    letter-spacing: 0.04em;
}

.csi-badge-dgii[b-rltf2ep5dn] {
    background: rgba(22, 163, 74, 0.12);
    color: var(--rg-success, #16a34a);
    border: 1px solid rgba(22, 163, 74, 0.30);
}

.csi-badge-dgii i[b-rltf2ep5dn] {
    color: var(--rg-success, #16a34a);
    font-size: 0.85rem;
}

.csi-badge-dgii-loading[b-rltf2ep5dn] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    border: 1px solid var(--rg-border, #e2e8f0);
}

.csi-spin-i[b-rltf2ep5dn] {
    display: inline-block;
    animation: csi-rotate-b-rltf2ep5dn 0.9s linear infinite;
}

[data-mode="dark"] .csi-badge-dgii[b-rltf2ep5dn] { color: #86efac; }
[data-mode="dark"] .csi-badge-dgii i[b-rltf2ep5dn] { color: #86efac; }

.csi-hint.warn[b-rltf2ep5dn] { color: var(--rg-warning, #d97706); }
[data-mode="dark"] .csi-hint.warn[b-rltf2ep5dn] { color: #fcd34d; }

/* Estado bloqueado por OCR / disabled — fondo más oscuro y candado */
.csi-input-locked[b-rltf2ep5dn],
.csi-input:disabled[b-rltf2ep5dn],
.csi-input:read-only[b-rltf2ep5dn] {
    background: rgba(22,163,74,0.06) !important;
    border-color: rgba(22,163,74,0.3) !important;
    color: var(--rg-text-primary) !important;
    cursor: not-allowed !important;
    user-select: text;
}

[data-mode="dark"] .csi-input-locked[b-rltf2ep5dn],
[data-mode="dark"] .csi-input:disabled[b-rltf2ep5dn],
[data-mode="dark"] .csi-input:read-only[b-rltf2ep5dn] {
    background: rgba(22,163,74,0.12) !important;
}
/* _content/Rgclouds.Web/Components/Shared/CodificacionContableViewer.razor.rz.scp.css */
/* ── CodificacionContableViewer — modal de visualización de asiento ── */

.modal-backdrop[b-6e69j2gxch] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5); backdrop-filter: blur(4px);
    z-index: 1000;
}
.modal-container[b-6e69j2gxch] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1001; pointer-events: none;
}
.modal-dialog[b-6e69j2gxch] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: .75rem;
    width: 95%;
    max-width: 880px;
    max-height: 90vh;
    overflow: hidden;
    display: flex; flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.ccv-dialog[b-6e69j2gxch] { max-width: 920px; }
.modal-header[b-6e69j2gxch] {
    display: flex; justify-content: space-between; align-items: center;
    padding: .85rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}
.modal-header h2[b-6e69j2gxch] {
    margin: 0; font-size: 1rem; font-weight: 700;
    display: flex; align-items: center; gap: .5rem;
    color: var(--rg-text-primary, #1e293b);
}
.modal-close[b-6e69j2gxch] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem; padding: .25rem;
}
.modal-body[b-6e69j2gxch] { padding: 1rem 1.25rem; overflow-y: auto; flex: 1; }
.modal-footer[b-6e69j2gxch] {
    display: flex; justify-content: flex-end; gap: .5rem;
    padding: .7rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

.btn-crud[b-6e69j2gxch] { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1rem;
    border: none; border-radius: .5rem; font-size: .8rem; font-weight: 600; cursor: pointer; }
.btn-outline[b-6e69j2gxch] { background: transparent; color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0); }
.btn-outline:hover[b-6e69j2gxch] { background: var(--rg-bg-hover, #f1f5f9); }

.crud-spinner[b-6e69j2gxch] { width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: var(--rg-accent, #2563eb);
    border-radius: 50%; animation: ccv-spin-b-6e69j2gxch .7s linear infinite; }
@keyframes ccv-spin-b-6e69j2gxch { to { transform: rotate(360deg); } }

/* ── Meta del documento ── */
.ccv-meta[b-6e69j2gxch] {
    display: flex; flex-wrap: wrap; gap: 1.25rem;
    padding: .75rem 1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .55rem;
    margin-bottom: 1rem;
    font-size: .85rem;
    color: var(--rg-text-secondary, #475569);
}
.ccv-meta strong[b-6e69j2gxch] { color: var(--rg-text-primary, #1e293b); }

.ccv-loading[b-6e69j2gxch], .ccv-empty[b-6e69j2gxch] {
    display: flex; flex-direction: column; align-items: center; gap: .75rem;
    padding: 3rem 1rem; color: var(--rg-text-muted, #94a3b8);
}
.ccv-empty i[b-6e69j2gxch] { font-size: 2.5rem; color: var(--rg-warning, #d97706); }

/* ── Tabla ── */
.ccv-table-wrapper[b-6e69j2gxch] { border: 1px solid var(--rg-border, #e2e8f0); border-radius: .5rem; overflow: hidden; }
.ccv-table[b-6e69j2gxch] { width: 100%; border-collapse: collapse; font-size: .82rem; }
.ccv-table th[b-6e69j2gxch] {
    background: var(--rg-bg-subtle, #f8fafc);
    color: var(--rg-text-secondary, #475569);
    font-weight: 600; text-align: left;
    padding: .55rem .75rem;
    border-bottom: 2px solid var(--rg-border, #e2e8f0);
    font-size: .72rem;
    text-transform: uppercase; letter-spacing: .03em;
}
.ccv-table td[b-6e69j2gxch] {
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.ccv-table tbody tr:hover[b-6e69j2gxch] { background: var(--rg-bg-hover, #f8fafc); }

.ccv-total-row td[b-6e69j2gxch] { font-size: .9rem; padding-top: .65rem; padding-bottom: .65rem;
    border-top: 2px solid var(--rg-border, #e2e8f0); background: var(--rg-bg-subtle, #f8fafc); }
.ccv-warning-row td[b-6e69j2gxch] {
    background: rgba(220,38,38,.07);
    color: var(--rg-danger, #dc2626);
    padding: .6rem .75rem;
}
.ccv-warning-row i[b-6e69j2gxch] { margin-right: .35rem; }

.text-center[b-6e69j2gxch] { text-align: center; }
.text-end[b-6e69j2gxch] { text-align: right; }
.font-mono[b-6e69j2gxch] { font-family: 'Cascadia Code','Fira Code',monospace; font-size: .78rem; }
[data-mode="dark"] .ccv-meta[b-6e69j2gxch] { background: rgba(255,255,255,.04); }
[data-mode="dark"] .ccv-total-row td[b-6e69j2gxch] { background: rgba(255,255,255,.04); }

.ccv-empty .btn-crud[b-6e69j2gxch] { margin-top:.75rem; }
.ccv-retry-msg[b-6e69j2gxch] { margin-top:.6rem; font-size:.82rem; padding:.4rem .7rem; border-radius:.4rem; }
.ccv-retry-msg.ok[b-6e69j2gxch]  { background:rgba(22,163,74,.12); color:var(--rg-success,#16a34a); }
.ccv-retry-msg.err[b-6e69j2gxch] { background:rgba(220,38,38,.12); color:var(--rg-danger,#dc2626); }
.spin[b-6e69j2gxch] { animation: ccvspin-b-6e69j2gxch 1s linear infinite; display:inline-block; }
@keyframes ccvspin-b-6e69j2gxch { to { transform: rotate(360deg);} }
/* _content/Rgclouds.Web/Components/Shared/CollationAlertModal.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════════
   CollationAlertModal — diálogo técnico de error 468
   ══════════════════════════════════════════════════════════════ */

.ca-backdrop[b-of43pxl1qc] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.ca-modal[b-of43pxl1qc] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 12px;
    width: 100%;
    max-width: 560px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    display: flex;
    flex-direction: column;
    animation: ca-slide-in-b-of43pxl1qc .18s ease-out;
}

@keyframes ca-slide-in-b-of43pxl1qc {
    from { opacity: 0; transform: translateY(-16px) scale(.97); }
    to   { opacity: 1; transform: translateY(0)      scale(1);  }
}

/* ── Header ─────────────────────────────────────────────────── */
.ca-header[b-of43pxl1qc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .9rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
    background: rgba(239,68,68,.08);
    border-radius: 12px 12px 0 0;
}

.ca-header-left[b-of43pxl1qc] {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.ca-icon[b-of43pxl1qc] {
    font-size: 1.6rem;
    color: #ef4444;
}

.ca-title[b-of43pxl1qc] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #991b1b;
}

[data-mode="dark"] .ca-title[b-of43pxl1qc] { color: #fca5a5; }

.ca-subtitle[b-of43pxl1qc] {
    font-size: .78rem;
    color: var(--rg-text-secondary);
}

.ca-close[b-of43pxl1qc] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-secondary);
    font-size: 1rem;
    padding: .25rem .4rem;
    border-radius: 6px;
    transition: background .15s;
}
.ca-close:hover[b-of43pxl1qc] { background: var(--rg-bg-hover); }

/* ── Body ────────────────────────────────────────────────────── */
.ca-body[b-of43pxl1qc] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ca-alert-banner[b-of43pxl1qc] {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    background: rgba(239,68,68,.08);
    border: 1px solid rgba(239,68,68,.25);
    border-radius: 8px;
    padding: .75rem 1rem;
    font-size: .85rem;
    color: var(--rg-text-primary);
    line-height: 1.5;
}

.ca-alert-banner i[b-of43pxl1qc] {
    color: #ef4444;
    font-size: 1rem;
    flex-shrink: 0;
    margin-top: .1rem;
}

.ca-section[b-of43pxl1qc] {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.ca-label[b-of43pxl1qc] {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--rg-text-muted);
}

.ca-code-block[b-of43pxl1qc] {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    padding: .55rem .85rem;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: .88rem;
    color: var(--rg-text-primary);
}

.ca-code-block i[b-of43pxl1qc] { color: var(--rg-text-muted); }

.ca-row-two[b-of43pxl1qc] {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.ca-vs[b-of43pxl1qc] {
    font-size: 1.2rem;
    color: var(--rg-text-muted);
    flex-shrink: 0;
    padding-top: 1.2rem;
}

.ca-chip[b-of43pxl1qc] {
    display: inline-flex;
    align-items: center;
    padding: .3rem .65rem;
    border-radius: 6px;
    font-size: .78rem;
    font-family: monospace;
    font-weight: 600;
    white-space: nowrap;
}

.ca-chip-a[b-of43pxl1qc] {
    background: rgba(239,68,68,.12);
    color: #b91c1c;
    border: 1px solid rgba(239,68,68,.3);
}
[data-mode="dark"] .ca-chip-a[b-of43pxl1qc] { color: #fca5a5; }

.ca-chip-b[b-of43pxl1qc] {
    background: rgba(234,179,8,.12);
    color: #854d0e;
    border: 1px solid rgba(234,179,8,.3);
}
[data-mode="dark"] .ca-chip-b[b-of43pxl1qc] { color: #fde68a; }

.ca-instruccion[b-of43pxl1qc] {
    margin: 0;
    font-size: .85rem;
    color: var(--rg-text-primary);
    line-height: 1.55;
}

.ca-tip[b-of43pxl1qc] {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    background: rgba(59,130,246,.07);
    border: 1px solid rgba(59,130,246,.2);
    border-radius: 8px;
    padding: .75rem 1rem;
    font-size: .82rem;
    color: var(--rg-text-secondary);
    line-height: 1.5;
}

.ca-tip i[b-of43pxl1qc] {
    color: #3b82f6;
    font-size: .95rem;
    flex-shrink: 0;
    margin-top: .1rem;
}

.ca-tip code[b-of43pxl1qc] {
    background: rgba(59,130,246,.12);
    border-radius: 4px;
    padding: .1rem .35rem;
    font-size: .8rem;
    color: #1d4ed8;
}
[data-mode="dark"] .ca-tip code[b-of43pxl1qc] { color: #93c5fd; }

/* ── Footer ─────────────────────────────────────────────────── */
.ca-footer[b-of43pxl1qc] {
    display: flex;
    justify-content: flex-end;
    padding: .85rem 1.25rem;
    border-top: 1px solid var(--rg-border);
}
/* _content/Rgclouds.Web/Components/Shared/ConHelpModal.razor.rz.scp.css */
/* ============================================================
   ConHelpModal.razor.css — Guía visual módulo Construcción
   Dark-mode ready — solo tokens --rg-*
   ============================================================ */

/* ── Backdrop y contenedor ── */

.ch-backdrop[b-ap8cbn5q29] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: ch-fade-in-b-ap8cbn5q29 0.18s ease;
}

@keyframes ch-fade-in-b-ap8cbn5q29 {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.ch-modal[b-ap8cbn5q29] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 1rem;
    width: 100%;
    max-width: 820px;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 60px rgba(0,0,0,0.28);
    animation: ch-slide-up-b-ap8cbn5q29 0.22s ease;
}

@keyframes ch-slide-up-b-ap8cbn5q29 {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Header ── */

.ch-header[b-ap8cbn5q29] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    border-radius: 1rem 1rem 0 0;
}

.ch-header-left[b-ap8cbn5q29] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    flex: 1;
}

.ch-header-icon[b-ap8cbn5q29] {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(37,99,235,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: var(--rg-accent);
    flex-shrink: 0;
}

.ch-title[b-ap8cbn5q29] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0 0 0.2rem;
}

.ch-subtitle[b-ap8cbn5q29] {
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    margin: 0;
}

.ch-close[b-ap8cbn5q29] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid var(--rg-border);
    background: transparent;
    color: var(--rg-text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    flex-shrink: 0;
}

.ch-close:hover[b-ap8cbn5q29] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}

/* ── Progress bar de pasos ── */

.ch-progress-bar[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    padding: 1rem 1.5rem;
    background: var(--rg-bg-card);
    border-bottom: 1px solid var(--rg-border);
    overflow-x: auto;
    gap: 0;
}

.ch-prog-step[b-ap8cbn5q29] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid var(--rg-border);
    background: var(--rg-bg-input);
    color: var(--rg-text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s;
}

.ch-prog-step:hover[b-ap8cbn5q29] {
    border-color: var(--rg-primary);
    color: var(--rg-primary);
}

.ch-prog-step.active[b-ap8cbn5q29] {
    background: var(--rg-primary);
    border-color: var(--rg-primary);
    color: #fff;
    transform: scale(1.15);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.2);
}

.ch-prog-step.done[b-ap8cbn5q29] {
    background: var(--rg-success);
    border-color: var(--rg-success);
    color: #fff;
}

.ch-prog-line[b-ap8cbn5q29] {
    flex: 1;
    height: 2px;
    background: var(--rg-border);
    min-width: 12px;
    transition: background 0.2s;
}

.ch-prog-line.done[b-ap8cbn5q29] {
    background: var(--rg-success);
}

/* ── Body del modal ── */

.ch-body[b-ap8cbn5q29] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ── Cabecera del paso ── */

.ch-step-header[b-ap8cbn5q29] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--rg-bg-subtle);
    border-radius: 0.75rem;
    border: 1px solid var(--rg-border);
    position: relative;
}

.ch-step-badge[b-ap8cbn5q29] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--step-color, var(--rg-primary));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #fff;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.ch-step-info[b-ap8cbn5q29] {
    flex: 1;
}

.ch-step-num[b-ap8cbn5q29] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rg-text-muted);
}

.ch-step-title[b-ap8cbn5q29] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    margin: 0.15rem 0 0.3rem;
}

.ch-step-desc[b-ap8cbn5q29] {
    font-size: 0.82rem;
    color: var(--rg-text-secondary);
    margin: 0;
    line-height: 1.5;
}

.ch-go-btn[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.85rem;
    border-radius: 8px;
    border: 1px solid var(--step-color, var(--rg-primary));
    background: transparent;
    color: var(--step-color, var(--rg-primary));
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
    align-self: flex-start;
    flex-shrink: 0;
}

.ch-go-btn:hover[b-ap8cbn5q29] {
    background: var(--step-color, var(--rg-primary));
    color: #fff;
}

/* ── Preview de pantalla ── */

.ch-screen-preview[b-ap8cbn5q29] {
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    overflow: hidden;
    background: var(--rg-bg-card);
}

.ch-screen-bar[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}

.ch-bar-dots[b-ap8cbn5q29] {
    display: flex;
    gap: 4px;
}

.ch-dot[b-ap8cbn5q29] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.ch-dot-r[b-ap8cbn5q29] { background: #ef4444; }
.ch-dot-y[b-ap8cbn5q29] { background: #f59e0b; }
.ch-dot-g[b-ap8cbn5q29] { background: #22c55e; }

.ch-bar-url[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 4px;
    padding: 0.15rem 0.5rem;
    flex: 1;
    max-width: 380px;
}

.ch-screen-body[b-ap8cbn5q29] {
    padding: 0.85rem 1rem;
}

/* Header mockeado */

.ch-mock-header[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--rg-border);
}

.ch-mock-icon[b-ap8cbn5q29] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ch-mock-title[b-ap8cbn5q29] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--rg-text-primary);
}

.ch-mock-subtitle[b-ap8cbn5q29] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
}

.ch-mock-btn[b-ap8cbn5q29] {
    margin-left: auto;
    padding: 0.3rem 0.75rem;
    border-radius: 7px;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

/* Formulario mockeado */

.ch-mock-form[b-ap8cbn5q29] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.5rem;
}

.ch-mock-field[b-ap8cbn5q29] {
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    background: var(--rg-bg-input);
    transition: border-color 0.15s;
}

.ch-mock-field.destacado[b-ap8cbn5q29] {
    border-color: var(--rg-primary);
    background: rgba(26,58,92,0.06);
}

[data-mode="dark"] .ch-mock-field.destacado[b-ap8cbn5q29] {
    background: rgba(37,99,235,0.12);
}

.ch-mock-label[b-ap8cbn5q29] {
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    margin-bottom: 0.15rem;
}

.ch-mock-value[b-ap8cbn5q29] {
    font-size: 0.78rem;
    color: var(--rg-text-primary);
    font-weight: 500;
}

.ch-mock-note[b-ap8cbn5q29] {
    font-size: 0.62rem;
    color: var(--rg-text-muted);
    margin-top: 0.15rem;
    display: flex;
    align-items: center;
    gap: 0.2rem;
}

/* Tabla mockeada */

.ch-mock-table[b-ap8cbn5q29] {
    font-size: 0.75rem;
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    overflow: hidden;
}

.ch-mock-thead[b-ap8cbn5q29] {
    display: flex;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    padding: 0.35rem 0.5rem;
    gap: 0;
}

.ch-mock-th[b-ap8cbn5q29] {
    flex: 1;
    font-size: 0.63rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0 0.25rem;
}

.ch-mock-tr[b-ap8cbn5q29] {
    display: flex;
    padding: 0.3rem 0.5rem;
    border-bottom: 1px solid var(--rg-border);
    gap: 0;
    transition: background 0.1s;
}

.ch-mock-tr:last-child[b-ap8cbn5q29] {
    border-bottom: none;
}

.ch-mock-tr:hover[b-ap8cbn5q29] {
    background: var(--rg-bg-hover);
}

.ch-mock-td[b-ap8cbn5q29] {
    flex: 1;
    color: var(--rg-text-primary);
    font-size: 0.73rem;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0 0.25rem;
}

/* ── Lista de acciones ── */

.ch-actions-list[b-ap8cbn5q29] {
    padding: 0.85rem 1rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.65rem;
}

.ch-actions-title[b-ap8cbn5q29] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.6rem;
}

.ch-steps-ol[b-ap8cbn5q29] {
    padding-left: 1.2rem;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.ch-action-item[b-ap8cbn5q29] {
    font-size: 0.82rem;
    color: var(--rg-text-primary);
    line-height: 1.45;
}

/* ── Tips ── */

.ch-tips[b-ap8cbn5q29] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.ch-tip[b-ap8cbn5q29] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.55rem 0.8rem;
    border-radius: 8px;
    font-size: 0.8rem;
    line-height: 1.45;
    border-left: 3px solid;
}

.ch-tip i[b-ap8cbn5q29] { flex-shrink: 0; margin-top: 0.05rem; }

.ch-tip.info[b-ap8cbn5q29] {
    background: rgba(37,99,235,0.07);
    border-color: var(--rg-accent);
    color: var(--rg-text-primary);
}

.ch-tip.info i[b-ap8cbn5q29] { color: var(--rg-accent); }

.ch-tip.warning[b-ap8cbn5q29] {
    background: rgba(217,119,6,0.08);
    border-color: var(--rg-warning);
    color: var(--rg-text-primary);
}

.ch-tip.warning i[b-ap8cbn5q29] { color: var(--rg-warning); }

.ch-tip.success[b-ap8cbn5q29] {
    background: rgba(22,163,74,0.08);
    border-color: var(--rg-success);
    color: var(--rg-text-primary);
}

.ch-tip.success i[b-ap8cbn5q29] { color: var(--rg-success); }

/* ── Requiere ── */

.ch-requires[b-ap8cbn5q29] {
    padding: 0.65rem 0.85rem;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.65rem;
}

.ch-requires-title[b-ap8cbn5q29] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.ch-req-chips[b-ap8cbn5q29] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ch-req-chip[b-ap8cbn5q29] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.6rem;
    background: rgba(22,163,74,0.1);
    border: 1px solid rgba(22,163,74,0.3);
    color: var(--rg-success);
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
}

[data-mode="dark"] .ch-req-chip[b-ap8cbn5q29] {
    color: #86efac;
}

/* ── Footer ── */

.ch-footer[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.5rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    border-radius: 0 0 1rem 1rem;
    gap: 1rem;
}

.ch-paso-label[b-ap8cbn5q29] {
    font-size: 0.75rem;
    color: var(--rg-text-muted);
    font-weight: 600;
}

.ch-footer-nav[b-ap8cbn5q29] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.ch-nav-btn[b-ap8cbn5q29] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 1rem;
    border-radius: 8px;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
    color: var(--rg-text-primary);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.ch-nav-btn:hover:not(:disabled)[b-ap8cbn5q29] {
    background: var(--rg-bg-hover);
    border-color: var(--rg-primary);
    color: var(--rg-primary);
}

.ch-nav-btn:disabled[b-ap8cbn5q29] {
    opacity: 0.4;
    cursor: not-allowed;
}

.ch-nav-next[b-ap8cbn5q29] {
    background: var(--rg-primary);
    color: #fff;
    border-color: var(--rg-primary);
}

.ch-nav-next:hover:not(:disabled)[b-ap8cbn5q29] {
    opacity: 0.88;
    color: #fff;
    border-color: var(--rg-primary);
}

.ch-nav-finish[b-ap8cbn5q29] {
    background: var(--rg-success);
    color: #fff;
    border-color: var(--rg-success);
}

.ch-nav-finish:hover:not(:disabled)[b-ap8cbn5q29] {
    opacity: 0.88;
    color: #fff;
}

/* ── Responsive ── */

@media (max-width: 640px) {
    .ch-modal[b-ap8cbn5q29] {
        max-height: 100vh;
        border-radius: 0;
        max-width: 100%;
    }

    .ch-backdrop[b-ap8cbn5q29] {
        padding: 0;
        align-items: flex-end;
    }

    .ch-step-header[b-ap8cbn5q29] {
        flex-wrap: wrap;
    }

    .ch-go-btn[b-ap8cbn5q29] {
        align-self: stretch;
        justify-content: center;
    }

    .ch-mock-form[b-ap8cbn5q29] {
        grid-template-columns: 1fr 1fr;
    }

    .ch-paso-label[b-ap8cbn5q29] {
        display: none;
    }
}
/* _content/Rgclouds.Web/Components/Shared/CuentaContablePickerModal.razor.rz.scp.css */
/* ============================================================
   CuentaContablePickerModal — estilos aislados
   ============================================================ */

.ctp-backdrop[b-5jeqcvyalo] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1200;
}
.ctp-container[b-5jeqcvyalo] {
    position: fixed; inset: 0;
    z-index: 1201;
    display: flex; align-items: center; justify-content: center;
    padding: 1rem;
}
.ctp-dialog[b-5jeqcvyalo] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 12px;
    width: 920px; max-width: 96vw;
    max-height: 88vh;
    display: flex; flex-direction: column;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    overflow: hidden;
}
.ctp-header[b-5jeqcvyalo] {
    padding: .9rem 1.1rem;
    border-bottom: 1px solid var(--rg-border);
    display: flex; justify-content: space-between; align-items: center;
    background: var(--rg-bg-subtle);
}
.ctp-header h2[b-5jeqcvyalo] {
    margin: 0; font-size: 1rem; color: var(--rg-text-primary);
    display: inline-flex; align-items: center; gap: .55rem;
}
.ctp-header h2 i[b-5jeqcvyalo] { color: var(--rg-primary); }
.ctp-close[b-5jeqcvyalo] {
    background: none; border: none; cursor: pointer;
    width: 32px; height: 32px; border-radius: 6px;
    color: var(--rg-text-muted);
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .12s;
}
.ctp-close:hover[b-5jeqcvyalo] { background: var(--rg-bg-hover); color: var(--rg-danger); }

.ctp-body[b-5jeqcvyalo] { padding: 1rem 1.1rem; overflow-y: auto; flex: 1; }
.ctp-footer[b-5jeqcvyalo] {
    padding: .75rem 1.1rem;
    border-top: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    display: flex; justify-content: flex-end; gap: .5rem;
}

/* búsqueda */
.ctp-search[b-5jeqcvyalo] {
    display: flex; align-items: center; gap: .4rem;
    margin-bottom: .75rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 8px; padding: .35rem .5rem;
}
.ctp-search input[b-5jeqcvyalo] {
    flex: 1; border: none; outline: none; background: transparent;
    color: var(--rg-text-primary); font-size: .87rem;
    padding: .25rem .35rem;
}
.ctp-search-btn[b-5jeqcvyalo], .ctp-search-clear[b-5jeqcvyalo] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted);
    width: 28px; height: 28px; border-radius: 6px;
    display: inline-flex; align-items: center; justify-content: center;
}
.ctp-search-btn:hover[b-5jeqcvyalo], .ctp-search-clear:hover[b-5jeqcvyalo] { background: var(--rg-bg-hover); color: var(--rg-accent); }
.ctp-count[b-5jeqcvyalo] { font-size: .72rem; color: var(--rg-text-muted); padding: 0 .5rem; font-weight: 600; }

/* grid */
.ctp-grid-wrap[b-5jeqcvyalo] { border: 1px solid var(--rg-border); border-radius: 8px; overflow: hidden; }
.ctp-table[b-5jeqcvyalo] { width: 100%; border-collapse: collapse; font-size: .85rem; }
.ctp-table thead th[b-5jeqcvyalo] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-size: .7rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em;
    padding: .6rem .65rem;
    border-bottom: 2px solid var(--rg-border);
    text-align: left; position: sticky; top: 0; z-index: 1;
}
.ctp-table thead th.center[b-5jeqcvyalo] { text-align: center; }
.ctp-table tbody tr[b-5jeqcvyalo] { cursor: pointer; transition: background .1s; }
.ctp-table tbody tr:hover[b-5jeqcvyalo] { background: var(--rg-bg-hover); }
.ctp-table tbody td[b-5jeqcvyalo] {
    padding: .5rem .65rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
}
.ctp-table td.center[b-5jeqcvyalo] { text-align: center; }
.ctp-table td.mono[b-5jeqcvyalo] { font-family: 'Cascadia Code','Fira Code',Consolas,monospace; font-size: .8rem; color: var(--rg-accent); font-weight: 600; }

/* badges */
.ctp-badge[b-5jeqcvyalo] {
    display: inline-block;
    padding: .15rem .55rem;
    border-radius: 1rem;
    font-size: .7rem;
    font-weight: 700;
}
.ctp-badge.debit[b-5jeqcvyalo] { background: rgba(8,145,178,.15); color: var(--rg-info); }
.ctp-badge.credit[b-5jeqcvyalo] { background: rgba(217,119,6,.15); color: var(--rg-warning); }
.ctp-badge.aplica[b-5jeqcvyalo] { background: rgba(37,99,235,.15); color: var(--rg-accent); }
.ctp-badge.control[b-5jeqcvyalo] { background: rgba(148,163,184,.18); color: var(--rg-text-secondary); }

[data-mode="dark"] .ctp-badge.debit[b-5jeqcvyalo] { color: #67e8f9; }
[data-mode="dark"] .ctp-badge.credit[b-5jeqcvyalo] { color: #fcd34d; }
[data-mode="dark"] .ctp-badge.aplica[b-5jeqcvyalo] { color: #93c5fd; }

/* estados */
.ctp-loading[b-5jeqcvyalo], .ctp-empty[b-5jeqcvyalo] {
    text-align: center; padding: 2rem; color: var(--rg-text-muted);
    display: flex; flex-direction: column; align-items: center; gap: .5rem;
}
.ctp-empty i[b-5jeqcvyalo] { font-size: 2rem; }
.spin[b-5jeqcvyalo] { animation: ctp-spin-b-5jeqcvyalo 1s linear infinite; }
@keyframes ctp-spin-b-5jeqcvyalo { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/CuentaContableSmartInput.razor.rz.scp.css */
/* ============================================================
   🧾 CuentaContableSmartInput.razor.css
   Tokens --rg-* (light/dark). Sin hex hardcoded fuera de rgba().
   ============================================================ */

.cci-wrap[b-is98jgg815] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.2rem;
}

.cci-input-row[b-is98jgg815] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
}

.cci-input[b-is98jgg815] {
    flex: 1;
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.45rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.cci-input[b-is98jgg815]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.cci-input:focus[b-is98jgg815] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.cci-input:disabled[b-is98jgg815] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    cursor: not-allowed;
}

.cci-icon[b-is98jgg815] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--rg-text-muted, #94a3b8);
    pointer-events: none;
}

.cci-spin i[b-is98jgg815] {
    display: inline-block;
    animation: cci-rotate-b-is98jgg815 0.9s linear infinite;
    color: var(--rg-primary, #2563eb);
}

@keyframes cci-rotate-b-is98jgg815 { to { transform: rotate(360deg); } }

.cci-clear[b-is98jgg815] {
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    border-radius: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    padding: 0;
}

.cci-clear:hover[b-is98jgg815] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
}

/* ── Dropdown ─────────────────────────────────────────────── */
.cci-drop[b-is98jgg815] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: cci-fade-b-is98jgg815 0.12s ease-out;
}

@keyframes cci-fade-b-is98jgg815 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.cci-item[b-is98jgg815] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-primary, #1e293b);
    transition: background-color 0.1s;
    font-size: 0.85rem;
}

.cci-item:last-child[b-is98jgg815] { border-bottom: none; }

.cci-item:hover[b-is98jgg815],
.cci-item.active[b-is98jgg815] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.cci-item-id[b-is98jgg815] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

[data-mode="dark"] .cci-item-id[b-is98jgg815] { color: #93c5fd; }

.cci-item-name[b-is98jgg815] {
    flex: 1;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Badges DEB / CRE / Control ───────────────────────────── */
.cci-badge[b-is98jgg815] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.08rem 0.4rem;
    border-radius: 0.6rem;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.cci-badge-deb[b-is98jgg815] {
    background: rgba(37, 99, 235, 0.12);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37, 99, 235, 0.30);
}

.cci-badge-cre[b-is98jgg815] {
    background: rgba(217, 119, 6, 0.12);
    color: var(--rg-warning, #d97706);
    border: 1px solid rgba(217, 119, 6, 0.30);
}

.cci-badge-ctrl[b-is98jgg815] {
    background: rgba(148, 163, 184, 0.18);
    color: var(--rg-text-secondary, #475569);
    border: 1px solid rgba(148, 163, 184, 0.35);
    text-transform: uppercase;
}

[data-mode="dark"] .cci-badge-deb[b-is98jgg815]  { color: #93c5fd; }
[data-mode="dark"] .cci-badge-cre[b-is98jgg815]  { color: #fcd34d; }
[data-mode="dark"] .cci-badge-ctrl[b-is98jgg815] { color: #cbd5e1; }

/* ── Hint ─────────────────────────────────────────────────── */
.cci-hint-row[b-is98jgg815] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.cci-hint[b-is98jgg815] {
    font-size: 0.78rem;
    font-weight: 600;
}

.cci-hint.ok[b-is98jgg815]   { color: var(--rg-success, #16a34a); }
.cci-hint.err[b-is98jgg815]  { color: var(--rg-danger, #dc2626); }
.cci-hint.warn[b-is98jgg815] { color: var(--rg-warning, #d97706); }

[data-mode="dark"] .cci-hint.ok[b-is98jgg815]   { color: #86efac; }
[data-mode="dark"] .cci-hint.err[b-is98jgg815]  { color: #fca5a5; }
[data-mode="dark"] .cci-hint.warn[b-is98jgg815] { color: #fcd34d; }
/* _content/Rgclouds.Web/Components/Shared/CursoSmartInput.razor.rz.scp.css */
/* ============================================================
   👤 UsuarioSmartInput — Estilos aislados
   Mismo patrón visual que CuentaContableSmartInput
   ============================================================ */

.csi-wrap[b-cuqg7ly3wh] { position: relative; display: flex; flex-direction: column; gap: .15rem; width: 100%; }
.csi-input-row[b-cuqg7ly3wh] { position: relative; display: flex; align-items: center; }

.csi-input[b-cuqg7ly3wh] {
    width: 100%;
    padding: .375rem .55rem;
    padding-right: 2rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .375rem;
    font-size: .8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.csi-input:focus[b-cuqg7ly3wh] {
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 2px rgba(37,99,235,.15);
}
.csi-input:disabled[b-cuqg7ly3wh] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

.csi-icon[b-cuqg7ly3wh], .csi-clear[b-cuqg7ly3wh] {
    position: absolute; right: .35rem; top: 50%; transform: translateY(-50%);
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: .85rem; padding: .25rem; line-height: 1;
}
.csi-clear:hover[b-cuqg7ly3wh] { color: var(--rg-text-primary, #1e293b); }
.csi-spin i[b-cuqg7ly3wh] { animation: csi-rot-b-cuqg7ly3wh 0.8s linear infinite; display: inline-block; }
@keyframes csi-rot-b-cuqg7ly3wh { to { transform: rotate(360deg); } }

.csi-drop[b-cuqg7ly3wh] {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    z-index: 50;
    margin-top: .25rem;
    max-height: 280px;
    overflow-y: auto;
}

.csi-item[b-cuqg7ly3wh] {
    display: flex; align-items: center; gap: .5rem;
    padding: .45rem .65rem;
    font-size: .78rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.csi-item:last-child[b-cuqg7ly3wh] { border-bottom: none; }
.csi-item:hover[b-cuqg7ly3wh], .csi-item.active[b-cuqg7ly3wh] {
    background: var(--rg-bg-hover, #f1f5f9);
}

.csi-item-id[b-cuqg7ly3wh] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: .72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    background: var(--rg-bg-subtle, #f8fafc);
    padding: .1rem .4rem;
    border-radius: .25rem;
    min-width: 90px;
    flex-shrink: 0;
}
.csi-item-name[b-cuqg7ly3wh] { flex: 1; }
.csi-badge[b-cuqg7ly3wh] {
    font-size: .65rem;
    font-weight: 700;
    color: var(--rg-accent, #2563eb);
    background: rgba(37,99,235,.1);
    padding: .1rem .4rem;
    border-radius: .25rem;
    flex-shrink: 0;
}

.csi-hint-row[b-cuqg7ly3wh] { min-height: 1.1rem; }
.csi-hint[b-cuqg7ly3wh] { font-size: .7rem; }
.csi-hint.ok[b-cuqg7ly3wh]  { color: var(--rg-success, #16a34a); }
.csi-hint.err[b-cuqg7ly3wh] { color: var(--rg-danger,  #dc2626); }

[data-mode="dark"] .csi-item-id[b-cuqg7ly3wh]   { background: rgba(255,255,255,.05); }
[data-mode="dark"] .csi-drop[b-cuqg7ly3wh]      { box-shadow: 0 8px 24px rgba(0,0,0,.4); }
/* _content/Rgclouds.Web/Components/Shared/EvidenciaPhotoSection.razor.rz.scp.css */
/* ── Sección Evidencia Fotográfica ──────────────────────────── */
.evid-section[b-bv19chtmba] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin: 0.75rem 0;
}

.evid-section-header[b-bv19chtmba] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border-bottom: 1px solid var(--rg-border);
    flex-wrap: wrap;
}

.evid-section-icon[b-bv19chtmba] { color: var(--rg-accent); font-size: 1rem; }
.evid-icon-danger[b-bv19chtmba]  { color: #ef4444 !important; }

.evid-section-title[b-bv19chtmba] {
    flex: 1;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.evid-badge-obligatorio[b-bv19chtmba] {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    border-radius: 1rem;
    font-size: 0.58rem;
    font-weight: 700;
    background: rgba(239,68,68,0.12);
    color: #991b1b;
    border: 1px solid rgba(239,68,68,0.35);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
[data-mode="dark"] .evid-badge-obligatorio[b-bv19chtmba] { color: #fca5a5; }

/* Badge verde de conteo de fotos */
.evid-count-badge[b-bv19chtmba] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.55rem;
    border-radius: 1rem;
    background: rgba(22,163,74,0.14);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.35);
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
    animation: evid-badge-pop-b-bv19chtmba 0.25s ease-out;
}
[data-mode="dark"] .evid-count-badge[b-bv19chtmba] { color: #86efac; }

@keyframes evid-badge-pop-b-bv19chtmba {
    from { transform: scale(0.7); opacity: 0; }
    to   { transform: scale(1);   opacity: 1; }
}

/* Botones de acción */
.evid-actions[b-bv19chtmba] { display: flex; gap: 0.4rem; align-items: center; }

/* Miniatura TEMP — borde discontinuo para indicar "aún no finalizada" */
.evid-thumb-temp[b-bv19chtmba] {
    border-style: dashed !important;
    border-color: var(--rg-accent) !important;
}

/* ── Lightbox — vista completa con auditoría ─────────────── */
.evid-lightbox-bd[b-bv19chtmba] { background: rgba(0,0,0,0.75) !important; }

.evid-lightbox-wrap[b-bv19chtmba] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    max-width: 92vw;
    max-height: 92vh;
}

.evid-lightbox-img[b-bv19chtmba] {
    max-width: 90vw;
    max-height: 78vh;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.5);
    object-fit: contain;
    background: #000;
}

.evid-lightbox-audit[b-bv19chtmba] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: rgba(15, 23, 42, 0.85);
    color: #f1f5f9;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 0.5rem;
    font-size: 0.82rem;
    font-weight: 500;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.35);
}

.evid-audit-item[b-bv19chtmba] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.evid-audit-item i[b-bv19chtmba] { color: #93c5fd; font-size: 0.95rem; }
.evid-audit-sep[b-bv19chtmba]   { color: rgba(255,255,255,0.4); font-weight: 700; }

.evid-btn[b-bv19chtmba] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.35rem 0.6rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.35rem;
    background: var(--rg-bg-card);
    color: var(--rg-text-secondary);
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.evid-btn:hover[b-bv19chtmba]        { background: var(--rg-bg-hover); color: var(--rg-text-primary); }
.evid-btn.uploading[b-bv19chtmba]    { opacity: 0.7; cursor: progress; }

.evid-hint[b-bv19chtmba] {
    padding: 0.5rem 0.85rem;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* ── Galería principal de miniaturas ───────────────────────── */
.evid-galeria[b-bv19chtmba] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(64px, 64px));
    gap: 0.4rem;
    padding: 0.5rem 0.8rem;
    justify-content: flex-start;
}

.evid-thumb-btn[b-bv19chtmba] {
    position: relative;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0;
    background: var(--rg-bg-card);
    overflow: hidden;
    cursor: zoom-in;
    width: 64px !important;     /* miniatura fija 64x64 */
    height: 64px !important;
    flex-shrink: 0;
    transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.evid-thumb-btn:hover[b-bv19chtmba] {
    border-color: var(--rg-accent);
    transform: scale(1.04);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.evid-thumb-btn img[b-bv19chtmba] {
    width: 100%;
    height: 100%;
    object-fit: cover;          /* recorta para llenar el cuadro sin deformar */
    display: block;
}

/* ── Modal QR ─────────────────────────────────────────────── */
.evid-modal-backdrop[b-bv19chtmba] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1050;
}
.evid-modal-container[b-bv19chtmba] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1051; padding: 1rem; pointer-events: none;
}
.evid-modal-dialog[b-bv19chtmba] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}
.evid-qr-modal[b-bv19chtmba] { max-width: 360px; }

.evid-modal-header[b-bv19chtmba] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1.25rem;
    border-bottom: 1px solid var(--rg-border);
}
.evid-modal-header h2[b-bv19chtmba] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.evid-modal-close[b-bv19chtmba] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted); font-size: 1rem;
    padding: 0.25rem 0.5rem; border-radius: 0.25rem;
}
.evid-modal-close:hover[b-bv19chtmba] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }

.evid-modal-body[b-bv19chtmba] {
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    text-align: center;
}
.evid-modal-footer[b-bv19chtmba] {
    display: flex;
    justify-content: flex-end;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--rg-border);
}

.evid-qr-desc[b-bv19chtmba] {
    font-size: 0.85rem;
    color: var(--rg-text-secondary);
    margin: 0;
}
.evid-qr-hint[b-bv19chtmba] {
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    margin: 0.5rem 0 0;
}

.evid-qr-img-wrap[b-bv19chtmba] {
    display: flex; justify-content: center; align-items: center;
    padding: 0.75rem;
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    margin-bottom: 0.25rem;
    width: 100%;
}

.evid-qr-fotos-ok[b-bv19chtmba] {
    display: flex; align-items: center; justify-content: center; gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    background: rgba(22,163,74,0.10);
    border: 1px solid rgba(22,163,74,0.30);
    border-radius: 0.4rem;
    color: #166534;
    font-size: 0.82rem;
    font-weight: 600;
    width: 100%;
}
[data-mode="dark"] .evid-qr-fotos-ok[b-bv19chtmba] { color: #86efac; }

.evid-qr-galeria[b-bv19chtmba] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
    margin-top: 0.25rem;
    max-height: 220px;
    overflow-y: auto;
    width: 100%;
}

.evid-qr-thumb-btn[b-bv19chtmba] {
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    padding: 0;
    background: var(--rg-bg-card);
    overflow: hidden;
    cursor: zoom-in;
    aspect-ratio: 1 / 1;
    transition: border-color 0.15s, transform 0.15s;
}
.evid-qr-thumb-btn:hover[b-bv19chtmba] { border-color: var(--rg-accent); transform: scale(1.03); }
.evid-qr-thumb-btn img[b-bv19chtmba]   { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Spin */
.spin[b-bv19chtmba] { animation: evid-spin-b-bv19chtmba 0.8s linear infinite; display: inline-block; }
@keyframes evid-spin-b-bv19chtmba { to { transform: rotate(360deg); } }

/* OCR resumen — banner debajo de la galería cuando OcrIdEsperado está activo */
.evid-ocr-resumen[b-bv19chtmba] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.85rem;
    border-radius: 0.45rem;
    margin-top: 0.6rem;
    font-size: 0.82rem;
    border: 1px solid;
}

.evid-ocr-resumen i[b-bv19chtmba] { font-size: 1.05rem; flex-shrink: 0; }
.evid-ocr-resumen code[b-bv19chtmba] {
    background: rgba(0,0,0,0.08);
    padding: 0.05rem 0.4rem;
    border-radius: 0.25rem;
    font-family: 'Cascadia Code', 'SFMono-Regular', Consolas, monospace;
    font-size: 0.78rem;
}

.evid-ocr-resumen.ok[b-bv19chtmba] {
    background: rgba(22,163,74,0.10);
    border-color: rgba(22,163,74,0.30);
    color: var(--rg-success, #16a34a);
}
.evid-ocr-resumen.warn[b-bv19chtmba] {
    background: rgba(217,119,6,0.10);
    border-color: rgba(217,119,6,0.30);
    color: var(--rg-warning, #d97706);
}
.evid-ocr-resumen.loading[b-bv19chtmba] {
    background: var(--rg-bg-subtle);
    border-color: var(--rg-border);
    color: var(--rg-text-secondary);
}

[data-mode="dark"] .evid-ocr-resumen.ok[b-bv19chtmba] { color: #86efac; }
[data-mode="dark"] .evid-ocr-resumen.warn[b-bv19chtmba] { color: #fcd34d; }
[data-mode="dark"] .evid-ocr-resumen code[b-bv19chtmba] { background: rgba(255,255,255,0.10); }
/* _content/Rgclouds.Web/Components/Shared/FormaPagoDrawer.razor.rz.scp.css */
/* ============================================================
   FormaPagoDrawer.razor.css
   Prefijo: fpd- (FormaPagoDrawer)
   Tokens: solo --rg-* — responde a cambio de tema sin glitches
   ============================================================ */

/* ── Animaciones ── */
@keyframes fpd-fade-b-jdn98bpi36  { from { opacity: 0; } to { opacity: 1; } }
@keyframes fpd-slide-b-jdn98bpi36 { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes fpd-spin-b-jdn98bpi36  { to { transform: rotate(360deg); } }

/* ════════════════════════════════════════════════════════════
   FAB — Botón flotante
   Misma base que .btn-crud del sistema; usa tokens --rg-*
   ════════════════════════════════════════════════════════════ */
.fpd-fab[b-jdn98bpi36] {
    position: fixed;
    bottom: 1.75rem;
    right: 1.75rem;
    z-index: 900;

    /* Base btn-crud */
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    letter-spacing: 0.01em;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
}
.fpd-fab:hover:not(:disabled)[b-jdn98bpi36] {
    filter: brightness(1.08);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.22);
}
.fpd-fab:active[b-jdn98bpi36] { transform: translateY(0); }

.fpd-fab-icon[b-jdn98bpi36]  { font-size: 0.95rem; }
.fpd-fab-label[b-jdn98bpi36] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }

/* Estado gray — sin forma de pago (igual a btn-outline) */
.fpd-fab-gray[b-jdn98bpi36] {
    background: transparent;
    color: var(--rg-text-secondary);
    border: 1px dashed var(--rg-border);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.fpd-fab-gray:hover[b-jdn98bpi36] {
    background: var(--rg-bg-hover);
    color: var(--rg-accent);
    border-color: var(--rg-accent);
    border-style: solid;
}

/* Estado warning — fondos ingresados, saldo libre */
.fpd-fab-orange[b-jdn98bpi36] {
    background: var(--rg-warning);
    color: #fff;
    border: none;
}

/* Estado success — distribución completa */
.fpd-fab-green[b-jdn98bpi36] {
    background: var(--rg-success);
    color: #fff;
    border: none;
}

/* ════════════════════════════════════════════════════════════
   DRAWER — Panel lateral
   ════════════════════════════════════════════════════════════ */
.fpd-backdrop[b-jdn98bpi36] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(2px);
    z-index: 950;
    animation: fpd-fade-b-jdn98bpi36 0.2s ease-out;
}

.fpd-drawer[b-jdn98bpi36] {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: 460px;
    max-width: 100vw;
    background: var(--rg-bg-card);
    border-left: 1px solid var(--rg-border);
    z-index: 951;
    display: flex;
    flex-direction: column;
    box-shadow: -8px 0 40px rgba(0,0,0,0.18);
    transform: translateX(100%);
    transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
}
.fpd-drawer-open[b-jdn98bpi36] { transform: translateX(0); }

/* Header */
.fpd-header[b-jdn98bpi36] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.1rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}
.fpd-header-left[b-jdn98bpi36] { display: flex; align-items: center; gap: 0.5rem; }
.fpd-header-icon[b-jdn98bpi36]  { font-size: 1.2rem; color: var(--rg-accent); }
.fpd-title[b-jdn98bpi36]        { font-size: 0.95rem; font-weight: 700; color: var(--rg-text-primary); }
.fpd-close[b-jdn98bpi36] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.3rem;
    border-radius: 0.375rem;
    line-height: 1;
    transition: background 0.15s;
}
.fpd-close:hover[b-jdn98bpi36] { background: var(--rg-bg-hover); color: var(--rg-text-primary); }

/* Chips resumen */
.fpd-chips[b-jdn98bpi36] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    flex-shrink: 0;
    background: var(--rg-bg-subtle);
}
.fpd-chip[b-jdn98bpi36] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.3rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    flex: 1;
    min-width: 90px;
}
.fpd-chip-label[b-jdn98bpi36] { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.fpd-chip-value[b-jdn98bpi36] { font-size: 0.9rem; font-weight: 700; font-family: 'Cascadia Code', monospace; }

.fpd-chip-total[b-jdn98bpi36]  { background: rgba(79,70,229,0.08);  color: var(--rg-accent);          border-color: rgba(79,70,229,0.2);  }
.fpd-chip-dist[b-jdn98bpi36]   { background: rgba(251,146,60,0.1);  color: var(--rg-warning);          border-color: rgba(251,146,60,0.25);}
.fpd-chip-libre[b-jdn98bpi36]  { background: rgba(34,197,94,0.1);   color: var(--rg-success);          border-color: rgba(34,197,94,0.25); }
.fpd-chip-danger[b-jdn98bpi36] { background: rgba(239,68,68,0.1);   color: var(--rg-danger);           border-color: rgba(239,68,68,0.25); }

/* Body scrollable */
.fpd-body[b-jdn98bpi36] {
    flex: 1;
    overflow-y: auto;
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

/* Barra de acciones */
.fpd-actions[b-jdn98bpi36] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    align-items: center;
}

/* Badge crédito a plazo — reemplaza el botón "Agregar método" */
.fpd-credito-badge[b-jdn98bpi36] {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .3rem .75rem; border-radius: 1rem;
    background: rgba(37,99,235,.1); color: var(--rg-primary);
    font-size: .75rem; font-weight: 700;
}

/* Indicador de monto bloqueado en el label */
.fpd-credito-lock[b-jdn98bpi36] {
    margin-left: .35rem; font-size: .68rem; font-weight: 600;
    color: var(--rg-text-muted); opacity: .8;
}

/* Input monto bloqueado */
.fpd-input-locked[b-jdn98bpi36] {
    background: var(--rg-bg-subtle) !important;
    color: var(--rg-text-secondary) !important;
    cursor: not-allowed !important;
    opacity: .85;
}

/* Botones — hereda del sistema global btn-crud */
.btn-crud[b-jdn98bpi36] { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem; border: none; border-radius: 0.5rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.btn-crud:disabled[b-jdn98bpi36] { opacity: 0.6; cursor: not-allowed; }
.btn-crud.btn-sm[b-jdn98bpi36]   { padding: 0.3rem 0.65rem; font-size: 0.75rem; }
.btn-primary[b-jdn98bpi36]       { background: var(--rg-accent); color: #fff; }
.btn-primary:hover:not(:disabled)[b-jdn98bpi36] { filter: brightness(1.1); }
.btn-outline[b-jdn98bpi36]       { background: transparent; color: var(--rg-text-secondary); border: 1px solid var(--rg-border); }
.btn-outline:hover:not(:disabled)[b-jdn98bpi36] { background: var(--rg-bg-hover); }
.btn-icon[b-jdn98bpi36]          { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: none; border-radius: 0.375rem; cursor: pointer; background: transparent; transition: all 0.15s; }
.btn-delete[b-jdn98bpi36]        { color: var(--rg-danger); }
.btn-delete:hover[b-jdn98bpi36]  { background: rgba(239,68,68,0.1); }

/* Tarjetas 2×2 */
.fpd-cards[b-jdn98bpi36] { display: flex; flex-direction: column; gap: 0.6rem; }

.fpd-card[b-jdn98bpi36] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 0.65rem 0.75rem;
    position: relative;
}

.fpd-card-grid[b-jdn98bpi36] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem 0.6rem;
}

.fpd-field[b-jdn98bpi36] { display: flex; flex-direction: column; gap: 0.15rem; }

.fpd-field label[b-jdn98bpi36] {
    font-size: 0.63rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rg-text-muted);
}

.fpd-field select[b-jdn98bpi36],
.fpd-field input[type="text"][b-jdn98bpi36],
.fpd-field input[type="number"][b-jdn98bpi36] {
    width: 100%;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.375rem;
    font-size: 0.78rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    transition: border-color 0.15s;
}
.fpd-field select:focus[b-jdn98bpi36],
.fpd-field input:focus[b-jdn98bpi36] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(79,70,229,0.12); }
.fpd-field input[type="number"][b-jdn98bpi36] { text-align: right; font-family: 'Cascadia Code', monospace; }
.fpd-readonly[b-jdn98bpi36] { background: var(--rg-bg-subtle) !important; color: var(--rg-text-muted) !important; }
.fpd-error[b-jdn98bpi36]    { background: rgba(239,68,68,0.08) !important; color: var(--rg-danger) !important; font-size: 0.7rem !important; cursor: help; }
.fpd-optional[b-jdn98bpi36] { color: var(--rg-text-muted); font-size: 0.72rem; font-weight: 400; }
.fpd-input-right[b-jdn98bpi36] { text-align: right; }

.fpd-card-del[b-jdn98bpi36] { position: absolute; top: 0.4rem; right: 0.4rem; width: 1.6rem; height: 1.6rem; }

/* Fila total */
.fpd-total-row[b-jdn98bpi36] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.25rem 0;
    border-top: 2px solid var(--rg-border);
    margin-top: 0.1rem;
}
.fpd-total-label[b-jdn98bpi36] { font-size: 0.72rem; font-weight: 700; color: var(--rg-text-secondary); text-transform: uppercase; letter-spacing: 0.03em; }
.fpd-total-value[b-jdn98bpi36] { font-size: 0.85rem; font-weight: 700; color: var(--rg-text-primary); font-family: 'Cascadia Code', monospace; }

/* Empty */
.fpd-empty[b-jdn98bpi36] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: var(--rg-text-muted);
    padding: 0.75rem 0;
}
.fpd-empty i[b-jdn98bpi36] { font-size: 1rem; }

/* Footer */
.fpd-footer[b-jdn98bpi36] {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--rg-border);
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    background: var(--rg-bg-subtle);
}

/* ════════════════════════════════════════════════════════════
   TARJETA — Detección de marca por primeros 4 dígitos
   ════════════════════════════════════════════════════════════ */
/* ── Input de Tarjeta: marco único con icono + dígitos + marca inline ──── */
.fpd-card-input[b-jdn98bpi36] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 8px;
    padding: 0.3rem 0.5rem;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.25s ease;
    max-width: 260px;
}
.fpd-card-input:focus-within[b-jdn98bpi36] {
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26,58,92,0.15);
}
.fpd-card-input.has-brand[b-jdn98bpi36] {
    background: linear-gradient(135deg,
        var(--rg-bg-input) 0%,
        var(--rg-bg-input) 55%,
        rgba(26,58,92,0.06) 100%);
}
[data-mode="dark"] .fpd-card-input.has-brand[b-jdn98bpi36] {
    background: linear-gradient(135deg,
        var(--rg-bg-input) 0%,
        var(--rg-bg-input) 55%,
        rgba(96,165,250,0.10) 100%);
}

.fpd-card-icon[b-jdn98bpi36] {
    color: var(--rg-text-muted);
    font-size: 1.05rem;
    flex-shrink: 0;
    transition: color 0.2s;
}
.fpd-card-input.has-brand .fpd-card-icon[b-jdn98bpi36] { color: var(--rg-primary); }

.fpd-card-digits[b-jdn98bpi36] {
    flex: 1;
    min-width: 70px;
    border: none !important;
    background: transparent !important;
    padding: 0.25rem 0 !important;
    margin: 0;
    font-family: 'Cascadia Code','Fira Code','Consolas',monospace;
    font-size: 1.0rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    color: var(--rg-text-primary);
    outline: none !important;
    box-shadow: none !important;
}
.fpd-card-digits[b-jdn98bpi36]::placeholder {
    letter-spacing: 0.32em;
    color: var(--rg-text-muted);
    font-weight: 400;
}

.fpd-card-brand[b-jdn98bpi36] {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.6rem;
    border-radius: 5px;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fff;
    background: linear-gradient(135deg, #1a3a5c, #2563eb);
    box-shadow: 0 1px 3px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.15);
    white-space: nowrap;
    animation: fpdBrandIn-b-jdn98bpi36 0.28s cubic-bezier(.18,.89,.32,1.28);
    flex-shrink: 0;
}

/* Colores por marca */
.fpd-card-input.brand-visa       .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#1a1f71,#3a47ad); }
.fpd-card-input.brand-mastercard .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#eb001b,#f79e1b); color:#fff; }
.fpd-card-input.brand-amex       .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#006fcf,#0a3a6e); }
.fpd-card-input.brand-discover   .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#ff6000,#ff9d3e); }
.fpd-card-input.brand-diners     .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#0079be,#005a9c); }
.fpd-card-input.brand-other      .fpd-card-brand[b-jdn98bpi36] { background: linear-gradient(135deg,#475569,#64748b); }

@keyframes fpdBrandIn-b-jdn98bpi36 {
    from { opacity: 0; transform: translateX(10px) scale(0.85); }
    to   { opacity: 1; transform: translateX(0)    scale(1); }
}

/* ── Alertas: excede deuda / falta distribuir ──────────────────── */
.fpd-warn[b-jdn98bpi36], .fpd-hint[b-jdn98bpi36] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0 1rem 0.6rem;
    padding: 0.55rem 0.75rem;
    border-radius: 6px;
    font-size: 0.78rem;
    line-height: 1.4;
    border: 1px solid;
    animation: fpdBrandIn-b-jdn98bpi36 0.22s ease-out;
}
.fpd-warn[b-jdn98bpi36] {
    background: rgba(220,38,38,0.10);
    color: var(--rg-danger);
    border-color: rgba(220,38,38,0.30);
}
.fpd-hint[b-jdn98bpi36] {
    background: rgba(37,99,235,0.08);
    color: var(--rg-accent);
    border-color: rgba(37,99,235,0.25);
}
[data-mode="dark"] .fpd-warn[b-jdn98bpi36] { color: #fca5a5; }
[data-mode="dark"] .fpd-hint[b-jdn98bpi36] { color: #93c5fd; }
.fpd-warn i[b-jdn98bpi36], .fpd-hint i[b-jdn98bpi36] { font-size: 0.95rem; margin-top: 1px; flex-shrink: 0; }

.fpd-required[b-jdn98bpi36] {
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--rg-danger);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-left: 0.25rem;
}

.fpd-warn-list[b-jdn98bpi36] { flex: 1; }
.fpd-warn-list ul[b-jdn98bpi36] {
    margin: 0.35rem 0 0.1rem 0;
    padding-left: 1.1rem;
    list-style: disc;
}
.fpd-warn-list li[b-jdn98bpi36] {
    margin: 0.15rem 0;
    font-weight: 500;
}

/* Marco rojo en input de 4 dígitos cuando es inválido (validación tarjeta) */
.fpd-card-input.invalid[b-jdn98bpi36] {
    border-color: var(--rg-danger) !important;
    box-shadow: 0 0 0 3px rgba(220,38,38,0.15) !important;
    background: linear-gradient(135deg,
        var(--rg-bg-input) 0%,
        var(--rg-bg-input) 50%,
        rgba(220,38,38,0.08) 100%);
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — Mobile: drawer → bottom-sheet
   ════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    .fpd-fab[b-jdn98bpi36] { bottom: 1.25rem; right: 1rem; font-size: 0.78rem; padding: 0.45rem 0.85rem; }
    .fpd-fab-label[b-jdn98bpi36] { max-width: 150px; }

    .fpd-drawer[b-jdn98bpi36] {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 90vh;
        max-width: 100vw;
        border-left: none;
        border-top: 1px solid var(--rg-border);
        border-radius: 1rem 1rem 0 0;
        transform: translateY(100%);
    }
    .fpd-drawer-open[b-jdn98bpi36] { transform: translateY(0); }

    .fpd-body[b-jdn98bpi36]    { padding: 0.65rem 0.75rem; }
    .fpd-header[b-jdn98bpi36]  { padding: 0.75rem; }
    .fpd-footer[b-jdn98bpi36]  { padding: 0.6rem 0.75rem; }
    .fpd-chips[b-jdn98bpi36]   { padding: 0.5rem 0.75rem; }
}
/* _content/Rgclouds.Web/Components/Shared/FormSection.razor.rz.scp.css */
.rg-form-section[b-83qz1k7yf0] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}
.rg-form-section-head[b-83qz1k7yf0] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.85rem;
}
.rg-form-num[b-83qz1k7yf0] {
    width: 26px; height: 26px;
    background: rgba(99,102,241,0.12);
    color: var(--rg-accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    font-family: 'Cascadia Code','Fira Code',monospace;
    flex-shrink: 0;
}
.rg-form-title[b-83qz1k7yf0] {
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--rg-text-primary);
    flex: 1;
}
.rg-form-section-actions[b-83qz1k7yf0] { display: flex; gap: 0.4rem; }
.rg-form-section-body[b-83qz1k7yf0] { display: flex; flex-direction: column; gap: 0.65rem; }

[data-mode="dark"] .rg-form-num[b-83qz1k7yf0] { color: #a5b4fc; }
/* _content/Rgclouds.Web/Components/Shared/HelpModal.razor.rz.scp.css */
/* ════════════════════════════════════════════════════════════════════════════
   HelpModal.razor.css  —  Modal de ayuda contextual — Diseño profesional
   Tokens: var(--rg-*)  |  Soporte claro + oscuro
   ════════════════════════════════════════════════════════════════════════════ */

/* ── Overlay ────────────────────────────────────────────────────────────── */
.hm-backdrop[b-3mlj0bo3f1] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.52);
    backdrop-filter: blur(6px);
    z-index: 1050;
    animation: hm-fade-b-3mlj0bo3f1 0.18s ease;
}
.hm-container[b-3mlj0bo3f1] {
    position: fixed; inset: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 1051;
    pointer-events: none;
    padding: 1rem;
}
@keyframes hm-fade-b-3mlj0bo3f1    { from { opacity: 0; } to { opacity: 1; } }
@keyframes hm-slide-b-3mlj0bo3f1   {
    from { transform: translateY(18px) scale(0.97); opacity: 0; }
    to   { transform: translateY(0)    scale(1);    opacity: 1; }
}

/* ── Diálogo ────────────────────────────────────────────────────────────── */
.hm-dialog[b-3mlj0bo3f1] {
    pointer-events: auto;
    background: var(--rg-bg-card, #ffffff);
    border-radius: 1rem;
    width: 100%;
    max-width: 740px;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 32px 80px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.06);
    animation: hm-slide-b-3mlj0bo3f1 0.22s cubic-bezier(0.34, 1.3, 0.64, 1);
}

/* ── Header — gradiente navy → azul ────────────────────────────────────── */
.hm-header[b-3mlj0bo3f1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.375rem;
    background: linear-gradient(135deg, #1a3a5c 0%, #1d4ed8 100%);
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}
/* Decoración geométrica sutil en el header */
.hm-header[b-3mlj0bo3f1]::after {
    content: '';
    position: absolute;
    right: -30px; top: -30px;
    width: 120px; height: 120px;
    background: rgba(255,255,255,0.06);
    border-radius: 50%;
    pointer-events: none;
}
.hm-header-left[b-3mlj0bo3f1] {
    display: flex; align-items: center; gap: 0.8rem;
    position: relative; z-index: 1;
}
.hm-icon-wrap[b-3mlj0bo3f1] {
    width: 2.4rem; height: 2.4rem;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    backdrop-filter: blur(4px);
}
.hm-icon[b-3mlj0bo3f1] { color: #fff; font-size: 1.1rem; }
.hm-header-text[b-3mlj0bo3f1] {
    display: flex; flex-direction: column; gap: 0.1rem;
}
.hm-header-label[b-3mlj0bo3f1] {
    font-size: 0.65rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.09em;
    color: rgba(255,255,255,0.6);
    line-height: 1;
}
.hm-header-title[b-3mlj0bo3f1] {
    font-size: 0.95rem; font-weight: 700;
    color: #ffffff;
    line-height: 1.3;
}
.hm-close[b-3mlj0bo3f1] {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.2);
    cursor: pointer;
    color: rgba(255,255,255,0.85);
    font-size: 0.9rem;
    padding: 0.4rem 0.5rem;
    border-radius: 0.45rem;
    line-height: 1;
    transition: background 0.15s, color 0.15s;
    flex-shrink: 0;
    position: relative; z-index: 1;
}
.hm-close:hover[b-3mlj0bo3f1] {
    background: rgba(255,255,255,0.28);
    color: #fff;
}

/* ── Body / Footer ──────────────────────────────────────────────────────── */
.hm-body[b-3mlj0bo3f1]   { overflow-y: auto; flex: 1; padding: 0; }
.hm-footer[b-3mlj0bo3f1] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.7rem 1.375rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-subtle, #f8fafc);
    flex-shrink: 0;
}

/* ── Estados: loading / error ───────────────────────────────────────────── */
.hm-loading[b-3mlj0bo3f1] {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 0.75rem; padding: 3.5rem;
    color: var(--rg-text-secondary);
    font-size: 0.875rem;
}
.hm-spinner[b-3mlj0bo3f1] {
    width: 2rem; height: 2rem;
    border: 3px solid var(--rg-border, #e2e8f0);
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: hm-spin-b-3mlj0bo3f1 0.8s linear infinite;
}
@keyframes hm-spin-b-3mlj0bo3f1 { to { transform: rotate(360deg); } }

.hm-error[b-3mlj0bo3f1] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 1.25rem 1.5rem; margin: 1.25rem;
    background: rgba(220,38,38,0.08);
    border: 1px solid rgba(220,38,38,0.25);
    border-radius: 0.5rem;
    color: var(--rg-danger, #dc2626);
    font-size: 0.875rem;
}

/* ── Contenido principal ────────────────────────────────────────────────── */
.hm-content[b-3mlj0bo3f1] {
    padding: 1rem 1.125rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

/* ── Tarjetas de sección (cada ## genera una) ───────────────────────────── */
.hm-section[b-3mlj0bo3f1] {
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-left: 4px solid #2563eb;
    border-radius: 0 0.65rem 0.65rem 0;
    padding: 0.9rem 1.1rem 0.85rem;
}
.hm-section-success[b-3mlj0bo3f1] { border-left-color: #16a34a; }
.hm-section-warn[b-3mlj0bo3f1]    { border-left-color: #d97706; }
.hm-section-danger[b-3mlj0bo3f1]  { border-left-color: #dc2626; }
.hm-section-new[b-3mlj0bo3f1]     { border-left-color: #0891b2; }
.hm-section-steps[b-3mlj0bo3f1]   { border-left-color: #7c3aed; }
.hm-section-tip[b-3mlj0bo3f1]     { border-left-color: #f59e0b; }

/* ── H2 dentro de sección ───────────────────────────────────────────────── */
.hm-h2[b-3mlj0bo3f1] {
    font-size: 0.88rem; font-weight: 700;
    color: #1a3a5c;
    margin: 0 0 0.6rem;
    display: flex; align-items: center; gap: 0.4rem;
    line-height: 1.3;
}
.hm-section-success .hm-h2[b-3mlj0bo3f1] { color: #15803d; }
.hm-section-warn    .hm-h2[b-3mlj0bo3f1] { color: #b45309; }
.hm-section-danger  .hm-h2[b-3mlj0bo3f1] { color: #b91c1c; }
.hm-section-new     .hm-h2[b-3mlj0bo3f1] { color: #0e7490; }
.hm-section-steps   .hm-h2[b-3mlj0bo3f1] { color: #6d28d9; }
.hm-section-tip     .hm-h2[b-3mlj0bo3f1] { color: #d97706; }

/* ── H3 — subtítulo con línea izquierda ─────────────────────────────────── */
.hm-h3[b-3mlj0bo3f1] {
    font-size: 0.83rem; font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0.7rem 0 0.3rem;
    padding-left: 0.6rem;
    border-left: 3px solid rgba(37,99,235,0.4);
    display: flex; align-items: center; gap: 0.35rem;
    line-height: 1.4;
}

/* ── H4 — etiqueta pequeña ─────────────────────────────────────────────── */
.hm-h4[b-3mlj0bo3f1] {
    font-size: 0.72rem; font-weight: 700;
    color: var(--rg-text-muted, #64748b);
    margin: 0.55rem 0 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ── Párrafo ────────────────────────────────────────────────────────────── */
.hm-p[b-3mlj0bo3f1] {
    font-size: 0.875rem;
    color: var(--rg-text-secondary, #475569);
    line-height: 1.65;
    margin: 0.1rem 0;
}

/* ── Lista no ordenada — marcadores personalizados ──────────────────────── */
.hm-ul[b-3mlj0bo3f1] {
    list-style: none;
    padding-left: 0;
    margin: 0.2rem 0;
}
.hm-ul li[b-3mlj0bo3f1] {
    font-size: 0.875rem;
    color: var(--rg-text-secondary, #475569);
    line-height: 1.6;
    margin-bottom: 0.2rem;
    padding-left: 1.25rem;
    position: relative;
}
.hm-ul li[b-3mlj0bo3f1]::before {
    content: '›';
    position: absolute; left: 0.1rem;
    color: #2563eb;
    font-weight: 900;
    font-size: 1.1rem;
    line-height: 1.35;
}

/* ── Lista ordenada — números con círculo azul ─────────────────────────── */
.hm-ol[b-3mlj0bo3f1] {
    list-style: none;
    padding-left: 0;
    margin: 0.2rem 0;
    counter-reset: hm-ol;
}
.hm-ol li[b-3mlj0bo3f1] {
    font-size: 0.875rem;
    color: var(--rg-text-secondary, #475569);
    line-height: 1.6;
    margin-bottom: 0.3rem;
    counter-increment: hm-ol;
    display: flex; align-items: flex-start; gap: 0.55rem;
}
.hm-ol li[b-3mlj0bo3f1]::before {
    content: counter(hm-ol);
    background: linear-gradient(135deg, #1a3a5c, #2563eb);
    color: #fff;
    border-radius: 50%;
    min-width: 1.35rem; height: 1.35rem;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 0.68rem; font-weight: 700;
    flex-shrink: 0;
    margin-top: 0.12rem;
    box-shadow: 0 1px 3px rgba(37,99,235,0.35);
}
.hm-ol li span[b-3mlj0bo3f1] { padding-top: 0.05rem; }

/* ── Callout / Tip boxes ────────────────────────────────────────────────── */
.hm-tip[b-3mlj0bo3f1] {
    display: flex; align-items: flex-start; gap: 0.6rem;
    background: rgba(245,158,11,0.09);
    border-left: 4px solid #f59e0b;
    border-radius: 0 0.5rem 0.5rem 0;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: var(--rg-text-secondary, #475569);
    margin: 0.25rem 0;
    line-height: 1.55;
}
.hm-tip i[b-3mlj0bo3f1]       { color: #d97706; flex-shrink: 0; margin-top: 0.12rem; font-size: 1rem; }
.hm-tip span[b-3mlj0bo3f1]    { flex: 1; }

.hm-tip-warn[b-3mlj0bo3f1]    { background: rgba(234,88,12,0.09);  border-left-color: #ea580c; }
.hm-tip-warn i[b-3mlj0bo3f1]  { color: #c2410c; }

.hm-tip-info[b-3mlj0bo3f1]    { background: rgba(37,99,235,0.08);  border-left-color: #2563eb; }
.hm-tip-info i[b-3mlj0bo3f1]  { color: #2563eb; }

.hm-tip-danger[b-3mlj0bo3f1]  { background: rgba(220,38,38,0.07);  border-left-color: #dc2626; }
.hm-tip-danger i[b-3mlj0bo3f1]{ color: #dc2626; }

.hm-tip-success[b-3mlj0bo3f1] { background: rgba(22,163,74,0.08);  border-left-color: #16a34a; }
.hm-tip-success i[b-3mlj0bo3f1]{ color: #15803d; }

/* ── Código inline ──────────────────────────────────────────────────────── */
.hm-code[b-3mlj0bo3f1] {
    background: rgba(109,40,217,0.08);
    border: 1px solid rgba(109,40,217,0.22);
    border-radius: 4px;
    padding: 0.1em 0.42em;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.8em;
    color: #6d28d9;
    white-space: nowrap;
}

/* ── Separador ──────────────────────────────────────────────────────────── */
.hm-hr[b-3mlj0bo3f1] {
    border: none;
    border-top: 1px solid var(--rg-border, #e2e8f0);
    margin: 0.4rem 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   TEMA OSCURO
   ═══════════════════════════════════════════════════════════════════════════ */
[data-mode="dark"] .hm-header[b-3mlj0bo3f1] {
    background: linear-gradient(135deg, #0f2240 0%, #1e40af 100%);
}
[data-mode="dark"] .hm-section[b-3mlj0bo3f1] {
    background: rgba(255,255,255,0.03);
    border-color: rgba(255,255,255,0.1);
}
[data-mode="dark"] .hm-h2[b-3mlj0bo3f1] { color: #bfdbfe; }
[data-mode="dark"] .hm-section-success .hm-h2[b-3mlj0bo3f1] { color: #86efac; }
[data-mode="dark"] .hm-section-warn    .hm-h2[b-3mlj0bo3f1] { color: #fcd34d; }
[data-mode="dark"] .hm-section-danger  .hm-h2[b-3mlj0bo3f1] { color: #fca5a5; }
[data-mode="dark"] .hm-section-new     .hm-h2[b-3mlj0bo3f1] { color: #67e8f9; }
[data-mode="dark"] .hm-section-steps   .hm-h2[b-3mlj0bo3f1] { color: #c4b5fd; }
[data-mode="dark"] .hm-section-tip     .hm-h2[b-3mlj0bo3f1] { color: #fde68a; }

[data-mode="dark"] .hm-h3[b-3mlj0bo3f1] { border-left-color: rgba(147,197,253,0.4); }
[data-mode="dark"] .hm-ul li[b-3mlj0bo3f1]::before { color: #93c5fd; }
[data-mode="dark"] .hm-ol li[b-3mlj0bo3f1]::before { background: linear-gradient(135deg, #1e3a5f, #1d4ed8); }

[data-mode="dark"] .hm-tip[b-3mlj0bo3f1]         { background: rgba(245,158,11,0.1);  }
[data-mode="dark"] .hm-tip-warn[b-3mlj0bo3f1]    { background: rgba(234,88,12,0.1);   }
[data-mode="dark"] .hm-tip-info[b-3mlj0bo3f1]    { background: rgba(37,99,235,0.12);  }
[data-mode="dark"] .hm-tip-danger[b-3mlj0bo3f1]  { background: rgba(220,38,38,0.1);   }
[data-mode="dark"] .hm-tip-success[b-3mlj0bo3f1] { background: rgba(22,163,74,0.1);   }

[data-mode="dark"] .hm-code[b-3mlj0bo3f1] {
    background: rgba(167,139,250,0.12);
    border-color: rgba(167,139,250,0.28);
    color: #c4b5fd;
}
[data-mode="dark"] .hm-footer[b-3mlj0bo3f1] { background: rgba(255,255,255,0.03); }
/* _content/Rgclouds.Web/Components/Shared/HitLookupModal.razor.rz.scp.css */
/* HitLookupModal.razor.css — Modal de búsqueda lookup (ButonHit) */

/* ── Backdrop ── */
.hit-backdrop[b-zcjinbmpfl] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: hitFadeIn-b-zcjinbmpfl 0.15s ease;
}

@keyframes hitFadeIn-b-zcjinbmpfl {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Modal contenedor ── */
.hit-modal[b-zcjinbmpfl] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    width: min(680px, 95vw);
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    animation: hitSlideUp-b-zcjinbmpfl 0.18s ease;
}

@keyframes hitSlideUp-b-zcjinbmpfl {
    from { transform: translateY(16px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

/* ── Header ── */
.hit-header[b-zcjinbmpfl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--rg-border);
}

.hit-header-left[b-zcjinbmpfl] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--rg-text-primary);
}

.hit-header-left i[b-zcjinbmpfl] {
    color: var(--rg-primary);
    font-size: 1rem;
}

.hit-close[b-zcjinbmpfl] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}
.hit-close:hover[b-zcjinbmpfl] { color: var(--rg-text-primary); background: var(--rg-bg-hover); }

/* ── Barra de búsqueda ── */
.hit-search-bar[b-zcjinbmpfl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
}

.hit-search-icon[b-zcjinbmpfl] { color: var(--rg-text-muted); font-size: 0.85rem; }

.hit-search-input[b-zcjinbmpfl] {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--rg-text-primary);
    font-size: 0.88rem;
}
.hit-search-input[b-zcjinbmpfl]::placeholder { color: var(--rg-text-muted); }

.hit-search-clear[b-zcjinbmpfl] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted);
    padding: 0;
    font-size: 0.8rem;
}
.hit-search-clear:hover[b-zcjinbmpfl] { color: var(--rg-text-primary); }

/* ── Contador ── */
.hit-count[b-zcjinbmpfl] {
    padding: 0.3rem 1rem;
    font-size: 0.72rem;
    color: var(--rg-text-muted);
    border-bottom: 1px solid var(--rg-border);
}

/* ── Grid de resultados ── */
.hit-grid-wrap[b-zcjinbmpfl] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

.hit-grid[b-zcjinbmpfl] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
}

.hit-grid thead th[b-zcjinbmpfl] {
    position: sticky;
    top: 0;
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.45rem 0.85rem;
    border-bottom: 1px solid var(--rg-border);
    text-align: left;
}

.hit-grid tbody td[b-zcjinbmpfl] {
    padding: 0.45rem 0.85rem;
    border-bottom: 1px solid var(--rg-border);
    color: var(--rg-text-primary);
    vertical-align: middle;
}

.hit-row[b-zcjinbmpfl] {
    cursor: pointer;
    transition: background 0.1s;
}
.hit-row:hover[b-zcjinbmpfl] { background: var(--rg-bg-hover); }
.hit-row-selected td[b-zcjinbmpfl] { background: rgba(26, 58, 92, 0.12) !important; }

[data-mode="dark"] .hit-row-selected td[b-zcjinbmpfl] {
    background: rgba(96, 165, 250, 0.15) !important;
}

.hit-empty[b-zcjinbmpfl] {
    text-align: center;
    padding: 2rem 1rem !important;
    color: var(--rg-text-muted);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
}
.hit-empty i[b-zcjinbmpfl] { font-size: 1.5rem; }

/* ── Estados loading / error ── */
.hit-loading[b-zcjinbmpfl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 2rem;
    color: var(--rg-text-secondary);
    font-size: 0.85rem;
}

.hit-spinner[b-zcjinbmpfl] {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: hitSpin-b-zcjinbmpfl 0.7s linear infinite;
}

@keyframes hitSpin-b-zcjinbmpfl {
    to { transform: rotate(360deg); }
}

.hit-error[b-zcjinbmpfl] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0.75rem 1rem;
    padding: 0.6rem 0.85rem;
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 6px;
    color: #991b1b;
    font-size: 0.8rem;
    white-space: pre-line;
}
.hit-error i[b-zcjinbmpfl] { margin-top: 2px; flex-shrink: 0; }
[data-mode="dark"] .hit-error[b-zcjinbmpfl] { color: #fca5a5; }

/* ── Footer ── */
.hit-footer[b-zcjinbmpfl] {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--rg-border);
}

/* ── Botones ── */
.btn-hit[b-zcjinbmpfl] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 1rem;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s;
}

.btn-hit-outline[b-zcjinbmpfl] {
    background: transparent;
    border-color: var(--rg-border);
    color: var(--rg-text-secondary);
}
.btn-hit-outline:hover[b-zcjinbmpfl] {
    background: var(--rg-bg-hover);
    color: var(--rg-text-primary);
}

.btn-hit-primary[b-zcjinbmpfl] {
    background: var(--rg-primary);
    border-color: var(--rg-primary);
    color: #fff;
}
.btn-hit-primary:hover[b-zcjinbmpfl] { opacity: 0.88; }
.btn-hit-primary:disabled[b-zcjinbmpfl] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* font-mono helper */
.font-mono[b-zcjinbmpfl] { font-family: 'Cascadia Code', 'Fira Code', monospace; font-size: 0.78rem; }
/* _content/Rgclouds.Web/Components/Shared/IncidenciaButton.razor.rz.scp.css */
/* ============================================================
   IncidenciaButton — botón de header (NO flotante).
   Vive dentro de .header-section, al lado del toggle de modo
   claro/oscuro. Mismo tamaño y estilo que header-dark-toggle.
   ============================================================ */
.ma-header-btn[b-3dxpxovdfl] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid var(--rg-border, #e2e8f0);
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #475569);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    transition: all 0.15s ease;
    margin-left: 0.4rem;
}

.ma-header-btn:hover[b-3dxpxovdfl] {
    background: var(--rg-bg-hover, #f1f5f9);
    color: var(--rg-accent, #2563eb);
    border-color: var(--rg-accent, #2563eb);
    transform: scale(1.05);
}

.ma-header-btn:active[b-3dxpxovdfl] { transform: scale(0.96); }

[data-mode="dark"] .ma-header-btn[b-3dxpxovdfl] {
    background: rgba(255,255,255,0.04);
    border-color: rgba(255,255,255,0.1);
    color: #cbd5e1;
}

[data-mode="dark"] .ma-header-btn:hover[b-3dxpxovdfl] {
    background: rgba(37,99,235,0.18);
    color: #93c5fd;
    border-color: rgba(37,99,235,0.4);
}
/* _content/Rgclouds.Web/Components/Shared/InformeExportButtons.razor.rz.scp.css */
.iex-actions[b-fb5je0ctdk] { display:inline-flex; gap:.5rem; align-items:center; }

.iex-btn[b-fb5je0ctdk] { display:inline-flex; align-items:center; gap:.4rem; border-radius:8px; padding:.45rem .8rem; font-size:.82rem; font-weight:600; border:1px solid var(--rg-border); background:var(--rg-bg-card); color:var(--rg-text-primary); cursor:pointer; }
.iex-btn:hover:not(:disabled)[b-fb5je0ctdk] { background:var(--rg-bg-hover); }
.iex-btn:disabled[b-fb5je0ctdk] { opacity:.55; cursor:not-allowed; }
.iex-primary[b-fb5je0ctdk] { background:var(--rg-primary); border-color:var(--rg-primary); color:#fff; }
.iex-excel[b-fb5je0ctdk]  { background:rgba(21,128,61,0.09); color:#15803d; border-color:rgba(21,128,61,0.3); }
.iex-excel:hover:not(:disabled)[b-fb5je0ctdk] { background:rgba(21,128,61,0.17); border-color:rgba(21,128,61,0.55); }
[data-mode="dark"] .iex-excel[b-fb5je0ctdk]  { background:rgba(34,197,94,0.12); color:#86efac; border-color:rgba(34,197,94,0.3); }
[data-mode="dark"] .iex-excel:hover:not(:disabled)[b-fb5je0ctdk] { background:rgba(34,197,94,0.22); }

/* Modal auto-contenido (no depende de clases globales — CSS isolation) */
.iex-overlay[b-fb5je0ctdk] { position:fixed; inset:0; z-index:3000; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; padding:1rem; }
.iex-modal[b-fb5je0ctdk] { background:var(--rg-bg-card); border:1px solid var(--rg-border); border-radius:14px; width:400px; max-width:94vw; box-shadow:0 24px 70px rgba(0,0,0,.45); animation:iex-pop-b-fb5je0ctdk .18s ease; }
@keyframes iex-pop-b-fb5je0ctdk { from { opacity:0; transform:translateY(8px) scale(.98); } to { opacity:1; transform:none; } }
.iex-mhead[b-fb5je0ctdk] { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.2rem; border-bottom:1px solid var(--rg-border); }
.iex-mhead h2[b-fb5je0ctdk] { margin:0; font-size:1.05rem; font-weight:700; color:var(--rg-text-primary); display:flex; align-items:center; gap:.5rem; }
.iex-close[b-fb5je0ctdk] { background:none; border:none; color:var(--rg-text-secondary); cursor:pointer; font-size:1.05rem; padding:.2rem .4rem; border-radius:6px; }
.iex-close:hover[b-fb5je0ctdk] { background:var(--rg-bg-hover); color:var(--rg-text-primary); }
.iex-mbody[b-fb5je0ctdk] { padding:1.2rem; }
.iex-mfoot[b-fb5je0ctdk] { display:flex; justify-content:flex-end; gap:.5rem; padding:.9rem 1.2rem; border-top:1px solid var(--rg-border); }

.iex-fg[b-fb5je0ctdk] { margin-bottom:.7rem; }
.iex-fg label[b-fb5je0ctdk] { display:block; font-size:.78rem; font-weight:600; color:var(--rg-text-secondary); margin-bottom:.25rem; }
.iex-fg input[b-fb5je0ctdk] { width:100%; background:var(--rg-bg-input); color:var(--rg-text-primary); border:1px solid var(--rg-border); border-radius:7px; padding:.45rem .65rem; font-size:.85rem; }
.iex-fg input:focus[b-fb5je0ctdk] { border-color:var(--rg-primary); box-shadow:0 0 0 3px rgba(26,58,92,.15); outline:none; }

.iex-alert[b-fb5je0ctdk] { display:flex; align-items:center; gap:.4rem; padding:.55rem .75rem; border-radius:8px; font-size:.82rem; margin-top:.5rem; }
.iex-alert.ok[b-fb5je0ctdk] { background:rgba(34,197,94,.12); color:#16a34a; }
.iex-alert.err[b-fb5je0ctdk] { background:rgba(220,38,38,.1); color:#dc2626; }
[data-mode="dark"] .iex-alert.ok[b-fb5je0ctdk] { color:#86efac; }
[data-mode="dark"] .iex-alert.err[b-fb5je0ctdk] { color:#fca5a5; }

.spin[b-fb5je0ctdk] { animation:iex-spin-b-fb5je0ctdk .7s linear infinite; display:inline-block; }
@keyframes iex-spin-b-fb5je0ctdk { to { transform:rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/InvoiceScanner.razor.rz.scp.css */
/* ============================================================
   InvoiceScanner - Modal scoped styles
   Replica el patrón usado por Frmcentrocosto.razor.css (tal cual)
   ============================================================ */

.modal-backdrop[b-p0oo5fikhi] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 1000;
    animation: fadeIn-b-p0oo5fikhi 0.15s ease-out;
    opacity: 1 !important;
}

.modal-container[b-p0oo5fikhi] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1001;
    pointer-events: none;
}

.modal-dialog[b-p0oo5fikhi] {
    pointer-events: auto;
    background: var(--rg-bg-card, #fff);
    border-radius: 0.75rem;
    width: 95%;
    max-width: 640px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
    animation: scaleIn-b-p0oo5fikhi 0.2s ease-out;
    position: static;
    margin: 0;
}

.modal-sm[b-p0oo5fikhi] {
    max-width: 420px;
}

@keyframes fadeIn-b-p0oo5fikhi {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes scaleIn-b-p0oo5fikhi {
    from { opacity: 0; transform: scale(0.95); }
    to   { opacity: 1; transform: scale(1); }
}

.modal-header[b-p0oo5fikhi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
}

.modal-header h2[b-p0oo5fikhi] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.modal-close[b-p0oo5fikhi] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: 1rem;
    padding: 0.25rem;
    border-radius: 0.25rem;
    width: 32px;
    height: 32px;
}

.modal-close:hover[b-p0oo5fikhi] {
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-hover, #f1f5f9);
}

.modal-body[b-p0oo5fikhi] {
    padding: 1.25rem;
}

.modal-footer[b-p0oo5fikhi] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--rg-border, #e2e8f0);
}

.form-group[b-p0oo5fikhi] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.form-group label[b-p0oo5fikhi] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.form-group input[b-p0oo5fikhi],
.form-group select[b-p0oo5fikhi] {
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color 0.15s;
}

.form-group input:focus[b-p0oo5fikhi],
.form-group select:focus[b-p0oo5fikhi] {
    border-color: var(--rg-accent, #4f46e5);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}

.form-group input.readonly[b-p0oo5fikhi] {
    background: var(--rg-bg-sidebar, #f8fafc);
    color: var(--rg-text-muted, #94a3b8);
}

/* ---- Botones (replica de .btn-crud / .btn-primary / .btn-outline) ---- */
.btn-crud[b-p0oo5fikhi] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.btn-crud:disabled[b-p0oo5fikhi] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary[b-p0oo5fikhi] {
    background: var(--rg-accent, #4f46e5);
    color: #fff;
}

.btn-primary:hover:not(:disabled)[b-p0oo5fikhi] {
    filter: brightness(1.1);
}

.btn-outline[b-p0oo5fikhi] {
    background: transparent;
    color: var(--rg-text-secondary, #475569);
    border: 1px solid var(--rg-border, #e2e8f0);
}

.btn-outline:hover:not(:disabled)[b-p0oo5fikhi] {
    background: var(--rg-bg-hover, #f1f5f9);
}

/* ---- Spinner ---- */
.crud-spinner-sm[b-p0oo5fikhi] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-p0oo5fikhi 0.6s linear infinite;
}

@keyframes spin-b-p0oo5fikhi {
    to { transform: rotate(360deg); }
}

/* ---- Alertas ---- */
.crud-alert[b-p0oo5fikhi] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
}

.crud-alert.success[b-p0oo5fikhi] {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.crud-alert.error[b-p0oo5fikhi] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* ---- Selector de tipo (Bienes / Servicios / Ambos) ---- */
.kind-group[b-p0oo5fikhi] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.kind-option[b-p0oo5fikhi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.75rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    background: var(--rg-bg-card, #fff);
    color: var(--rg-text-secondary, #475569);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    text-align: center;
}

.kind-option:hover[b-p0oo5fikhi] {
    background: var(--rg-bg-hover, #f1f5f9);
}

.kind-option.active[b-p0oo5fikhi] {
    border-color: var(--rg-accent, #4f46e5);
    background: rgba(79, 70, 229, 0.08);
    color: var(--rg-accent, #4f46e5);
}

.kind-option i[b-p0oo5fikhi] {
    font-size: 1.4rem;
}

/* ---- Data preview (resumen de datos extraídos) ---- */
.preview-grid[b-p0oo5fikhi] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem 1rem;
}

.preview-item[b-p0oo5fikhi] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.375rem;
    background: var(--rg-bg-sidebar, #f8fafc);
}

.preview-item .lbl[b-p0oo5fikhi] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--rg-text-muted, #94a3b8);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.preview-item .val[b-p0oo5fikhi] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
}

/* ---- Upload area ---- */
.upload-box[b-p0oo5fikhi] {
    border: 2px dashed var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
    color: var(--rg-text-muted, #94a3b8);
    background: var(--rg-bg-sidebar, #f8fafc);
    transition: all 0.15s;
}

.upload-box:hover[b-p0oo5fikhi] {
    border-color: var(--rg-accent, #4f46e5);
    color: var(--rg-text-secondary, #475569);
}

.upload-box i[b-p0oo5fikhi] {
    font-size: 2rem;
    margin-bottom: 0.5rem;
    display: block;
}

@media (max-width: 768px) {
    .modal-dialog[b-p0oo5fikhi] {
        width: 98%;
        max-height: 95vh;
    }

    .preview-grid[b-p0oo5fikhi] {
        grid-template-columns: 1fr;
    }

    .kind-group[b-p0oo5fikhi] {
        grid-template-columns: 1fr;
    }
}
/* _content/Rgclouds.Web/Components/Shared/KpiCard.razor.rz.scp.css */
/* ============================================================
   KpiCard — Celda KPI
   ============================================================ */
.rg-kpi[b-q59yo8kuhf] {
    padding: 0.6rem 1rem;
    border-right: 1px solid var(--rg-border);
    background: var(--rg-bg-card);
}
.rg-kpi:last-child[b-q59yo8kuhf] { border-right: none; }

.rg-kpi-clickable[b-q59yo8kuhf] {
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
    position: relative;
}
.rg-kpi-clickable:hover[b-q59yo8kuhf] {
    background: var(--rg-bg-hover);
}
.rg-kpi-clickable:active[b-q59yo8kuhf] { transform: scale(0.99); }
.rg-kpi-clickable:focus-visible[b-q59yo8kuhf] {
    outline: 2px solid var(--rg-primary);
    outline-offset: -2px;
}
.rg-kpi-zoom[b-q59yo8kuhf] {
    font-size: 0.7rem;
    margin-left: 0.35rem;
    color: var(--rg-text-muted);
    opacity: 0;
    transition: opacity 0.15s;
}
.rg-kpi-clickable:hover .rg-kpi-zoom[b-q59yo8kuhf] { opacity: 1; }

.rg-kpi-label[b-q59yo8kuhf] {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--rg-text-muted);
    margin-bottom: 0.2rem;
    font-weight: 600;
}

.rg-kpi-value[b-q59yo8kuhf] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--rg-text-primary);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rg-kpi-currency[b-q59yo8kuhf] {
    font-size: 0.7rem;
    color: var(--rg-text-muted);
    margin-right: 0.25rem;
    font-weight: 500;
}

.rg-kpi-trend[b-q59yo8kuhf] {
    font-size: 0.65rem;
    margin-top: 0.15rem;
    color: var(--rg-text-muted);
    font-variant-numeric: tabular-nums;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}
.rg-kpi-trend.trend-up[b-q59yo8kuhf]      { color: #16a34a; }
.rg-kpi-trend.trend-down[b-q59yo8kuhf]    { color: #dc2626; }
.rg-kpi-trend.trend-warning[b-q59yo8kuhf] { color: #d97706; }

[data-mode="dark"] .rg-kpi-trend.trend-up[b-q59yo8kuhf]      { color: #86efac; }
[data-mode="dark"] .rg-kpi-trend.trend-down[b-q59yo8kuhf]    { color: #fca5a5; }
[data-mode="dark"] .rg-kpi-trend.trend-warning[b-q59yo8kuhf] { color: #fcd34d; }

@media (max-width: 480px) {
    .rg-kpi[b-q59yo8kuhf] { border-right: none; border-bottom: 1px solid var(--rg-border); }
    .rg-kpi:last-child[b-q59yo8kuhf] { border-bottom: none; }
}
/* _content/Rgclouds.Web/Components/Shared/KpiGrid.razor.rz.scp.css */
/* ============================================================
   KpiGrid — Grid adaptable (4, 5 o más celdas en una sola línea)
   auto-fit con minmax garantiza que cualquier número de KpiCards
   quede en una sola fila en pantallas anchas sin fijar columnas.
   ============================================================ */
.rg-kpi-grid[b-x5trtcoy93] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0;
    border: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 1rem;
}

@media (max-width: 768px) {
    .rg-kpi-grid[b-x5trtcoy93] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .rg-kpi-grid[b-x5trtcoy93] { grid-template-columns: 1fr; }
}
/* _content/Rgclouds.Web/Components/Shared/MovimientoContableCaptura.razor.rz.scp.css */
/* ============================================================
   MovimientoContableCaptura — diseño sobrio, baja saturación
   ============================================================ */

.mcc-wrapper[b-qhzs8tgw79] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    overflow: hidden;
}

/* ── Header del documento — sutil, sin gradiente ─────────── */
.mcc-header[b-qhzs8tgw79] {
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
    padding: .75rem 1rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1.4fr 1fr;
    gap: .9rem;
    align-items: end;
}
.mcc-field[b-qhzs8tgw79] { display: flex; flex-direction: column; gap: .2rem; }
.mcc-field-lbl[b-qhzs8tgw79] {
    font-size: .65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 600;
}
.mcc-field-val[b-qhzs8tgw79] {
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    padding: .35rem .55rem;
    font-size: .82rem;
    font-weight: 500;
}

/* ── Descripción global ─────────────────────────────────── */
.mcc-desc[b-qhzs8tgw79] {
    padding: .6rem 1rem;
    background: var(--rg-bg-card);
    border-bottom: 1px solid var(--rg-border);
    display: flex; align-items: center; gap: .55rem;
}
.mcc-desc i[b-qhzs8tgw79] {
    color: var(--rg-text-muted);
    font-size: .9rem;
    flex-shrink: 0;
}
.mcc-desc input[b-qhzs8tgw79] {
    flex: 1;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 5px;
    padding: .4rem .55rem;
    color: var(--rg-text-primary);
    font-size: .85rem;
}
.mcc-desc input:hover[b-qhzs8tgw79] { background: var(--rg-bg-subtle); }
.mcc-desc input:focus[b-qhzs8tgw79] {
    outline: none;
    background: var(--rg-bg-input);
    border-color: var(--rg-border);
}

/* ── Fila de captura ────────────────────────────────────── */
.mcc-quick-row[b-qhzs8tgw79] {
    display: grid;
    grid-template-columns: 2.2fr 1.4fr 1.9fr 1.05fr 1.05fr auto;
    gap: .6rem;
    padding: .85rem 1rem 1.05rem 1rem;
    background: var(--rg-bg-card);
    border-bottom: 1px solid var(--rg-border);
    align-items: end;
}
.mcc-cell[b-qhzs8tgw79] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    position: relative;
    padding-bottom: 18px;       /* reserva espacio para el hint absoluto */
}
.mcc-cell.btn-cell[b-qhzs8tgw79] {
    justify-content: flex-end;
    padding-bottom: 18px;
}
.mcc-cell-lbl[b-qhzs8tgw79] {
    font-size: .68rem;
    font-weight: 600;
    color: var(--rg-text-secondary);
    text-transform: uppercase;
    letter-spacing: .04em;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}
.mcc-cell-lbl i[b-qhzs8tgw79] { color: var(--rg-text-muted); font-size: .8rem; }
.mcc-cell-lbl .req[b-qhzs8tgw79] { color: var(--rg-danger); font-weight: 700; }
.mcc-cell-input-wrap[b-qhzs8tgw79] { position: relative; }
.mcc-cell-input[b-qhzs8tgw79] {
    width: 100%;
    background: var(--rg-bg-input);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    padding: .45rem .55rem;
    font-size: .85rem;
    color: var(--rg-text-primary);
    transition: border-color .12s, box-shadow .12s;
}
.mcc-cell-input:focus[b-qhzs8tgw79] {
    outline: none;
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 2px rgba(26,58,92,.12);
}
[data-mode="dark"] .mcc-cell-input:focus[b-qhzs8tgw79] { box-shadow: 0 0 0 2px rgba(147,197,253,.18); }
.mcc-cell-input.with-picker[b-qhzs8tgw79] { padding-right: 1.8rem; }
.mcc-cell-input.ok[b-qhzs8tgw79] {
    border-color: rgba(22,163,74,.4);
    background: rgba(22,163,74,.03);
}
.mcc-cell-input.err[b-qhzs8tgw79] {
    border-color: rgba(220,38,38,.5);
    background: rgba(220,38,38,.03);
}
.mcc-cell-input.money[b-qhzs8tgw79] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.mcc-picker-btn[b-qhzs8tgw79] {
    position: absolute;
    right: 3px; top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    width: 24px; height: 24px;
    border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    color: var(--rg-text-muted);
    font-size: .85rem;
    transition: all .1s;
}
.mcc-picker-btn:hover[b-qhzs8tgw79] {
    background: var(--rg-bg-hover);
    color: var(--rg-primary);
}
[data-mode="dark"] .mcc-picker-btn:hover[b-qhzs8tgw79] { color: #93c5fd; }

.mcc-cell-hint[b-qhzs8tgw79] {
    position: absolute;
    left: 0; right: 0;
    bottom: 0;
    font-size: .67rem;
    color: var(--rg-text-secondary);
    padding: 2px 2px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mcc-cell-hint.error[b-qhzs8tgw79] { color: var(--rg-danger); font-weight: 500; }

/* ── Spinner de búsqueda (reemplaza lupa mientras carga) ──── */
.mcc-suggest-spin[b-qhzs8tgw79] {
    position: absolute;
    right: 3px; top: 50%;
    transform: translateY(-50%);
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    color: var(--rg-text-muted);
    font-size: .8rem;
    pointer-events: none;
}

/* ── Dropdown de sugerencias ──────────────────────────────── */
.mcc-suggest-drop[b-qhzs8tgw79] {
    position: absolute;
    top: calc(100% + 3px);
    left: 0; right: 0;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0,0,0,.12);
    z-index: 900;
    overflow: hidden;
    max-height: 280px;
    overflow-y: auto;
}
[data-mode="dark"] .mcc-suggest-drop[b-qhzs8tgw79] { box-shadow: 0 6px 18px rgba(0,0,0,.4); }

.mcc-suggest-item[b-qhzs8tgw79] {
    display: grid;
    grid-template-columns: 72px 1fr 38px;
    align-items: center;
    gap: .5rem;
    padding: .42rem .65rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border);
    transition: background .08s;
}
.mcc-suggest-item:last-child[b-qhzs8tgw79] { border-bottom: none; }
.mcc-suggest-item:hover[b-qhzs8tgw79],
.mcc-suggest-item.active[b-qhzs8tgw79] {
    background: var(--rg-bg-hover);
}
.mcc-suggest-item.active[b-qhzs8tgw79] { background: rgba(37,99,235,.08); }
[data-mode="dark"] .mcc-suggest-item.active[b-qhzs8tgw79] { background: rgba(147,197,253,.1); }

.mcc-suggest-code[b-qhzs8tgw79] {
    font-family: 'Cascadia Code','Fira Code',Consolas,monospace;
    font-size: .78rem;
    font-weight: 600;
    color: var(--rg-primary);
}
[data-mode="dark"] .mcc-suggest-code[b-qhzs8tgw79] { color: #93c5fd; }

.mcc-suggest-desc[b-qhzs8tgw79] {
    font-size: .8rem;
    color: var(--rg-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mcc-suggest-origen[b-qhzs8tgw79] {
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 1px 5px;
    border-radius: 3px;
    text-align: center;
}
.mcc-suggest-origen.deb[b-qhzs8tgw79] {
    background: rgba(37,99,235,.1);
    color: var(--rg-accent);
}
.mcc-suggest-origen.cre[b-qhzs8tgw79] {
    background: rgba(22,163,74,.1);
    color: var(--rg-success);
}
[data-mode="dark"] .mcc-suggest-origen.deb[b-qhzs8tgw79] { color: #93c5fd; background: rgba(147,197,253,.15); }
[data-mode="dark"] .mcc-suggest-origen.cre[b-qhzs8tgw79] { color: #86efac; background: rgba(134,239,172,.1); }

/* Cliente: 2 columnas (sin badge origen) */
.mcc-suggest-item.mcc-suggest-cli[b-qhzs8tgw79] {
    grid-template-columns: 100px 1fr;
}

/* ── Botón Aplicar (en captura) ─────────────────────────── */
.mcc-apply-btn[b-qhzs8tgw79] {
    height: 32px;
    background: transparent;
    color: var(--rg-primary);
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    padding: 0 .7rem;
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: .3rem;
    transition: all .12s;
    white-space: nowrap;
}
.mcc-apply-btn:hover[b-qhzs8tgw79] {
    background: var(--rg-bg-hover);
    border-color: var(--rg-primary);
}
.mcc-apply-btn.applied[b-qhzs8tgw79] {
    background: rgba(37,99,235,.1);
    color: var(--rg-accent);
    border-color: rgba(37,99,235,.4);
}
.mcc-apply-btn.required[b-qhzs8tgw79] {
    background: rgba(220,38,38,.06);
    color: var(--rg-danger);
    border-color: rgba(220,38,38,.4);
    animation: mcc-pulse-b-qhzs8tgw79 1.6s ease-in-out infinite;
}
@keyframes mcc-pulse-b-qhzs8tgw79 {
    0%, 100% { box-shadow: 0 0 0 0 rgba(220,38,38,0); }
    50%      { box-shadow: 0 0 0 3px rgba(220,38,38,.15); }
}
[data-mode="dark"] .mcc-apply-btn[b-qhzs8tgw79] { color: #93c5fd; }
[data-mode="dark"] .mcc-apply-btn.applied[b-qhzs8tgw79] { background: rgba(37,99,235,.2); color: #93c5fd; }

/* ── Botón Agregar — sobrio, no chillón ────────────────── */
.mcc-add-btn[b-qhzs8tgw79] {
    height: 32px;
    background: var(--rg-primary);
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 0 .9rem;
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex; align-items: center; gap: .35rem;
    transition: opacity .12s, background .12s;
    white-space: nowrap;
}
.mcc-add-btn:hover:not(:disabled)[b-qhzs8tgw79] { background: #142d49; }
[data-mode="dark"] .mcc-add-btn[b-qhzs8tgw79] { background: var(--rg-accent); }
[data-mode="dark"] .mcc-add-btn:hover:not(:disabled)[b-qhzs8tgw79] { background: #1d4ed8; }
.mcc-add-btn:disabled[b-qhzs8tgw79] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
    cursor: not-allowed;
}

/* ── Grid de líneas ─────────────────────────────────────── */
.mcc-grid-wrap[b-qhzs8tgw79] {
    padding: 0;
    max-height: calc(100vh - 480px);
    min-height: 220px;
    overflow-y: auto;
}
/* En modo resumido el grid crece para aprovechar el espacio liberado */
.mcc-grid-wrap.mcc-grid-expanded[b-qhzs8tgw79] {
    max-height: calc(100vh - 160px);
    min-height: 320px;
}
.mcc-grid[b-qhzs8tgw79] {
    width: 100%;
    border-collapse: collapse;
    font-size: .82rem;
}
.mcc-grid thead th[b-qhzs8tgw79] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-secondary);
    font-size: .67rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: .5rem .65rem;
    border-bottom: 1px solid var(--rg-border);
    text-align: left;
    position: sticky; top: 0; z-index: 1;
}
.mcc-grid thead th.num[b-qhzs8tgw79] { text-align: right; }
.mcc-grid thead th.center[b-qhzs8tgw79] { text-align: center; }
.mcc-grid tbody tr[b-qhzs8tgw79] {
    background: var(--rg-bg-card);
    transition: background .1s;
}
.mcc-grid tbody tr:hover[b-qhzs8tgw79] { background: var(--rg-bg-hover); }
.mcc-grid tbody td[b-qhzs8tgw79] {
    padding: .42rem .65rem;
    border-bottom: 1px solid var(--rg-border);
    vertical-align: middle;
    color: var(--rg-text-primary);
}
.mcc-grid td.num[b-qhzs8tgw79] { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }
.mcc-grid td.center[b-qhzs8tgw79] { text-align: center; }
.mcc-grid td.muted[b-qhzs8tgw79] { color: var(--rg-text-muted); }
.mcc-grid td.mono[b-qhzs8tgw79] { font-family: 'Cascadia Code','Fira Code',Consolas,monospace; font-size: .78rem; }

.mcc-icon-btn[b-qhzs8tgw79] {
    border: none;
    background: transparent;
    color: var(--rg-text-muted);
    cursor: pointer;
    width: 26px; height: 26px;
    border-radius: 4px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .1s;
}
.mcc-icon-btn:hover[b-qhzs8tgw79] { background: var(--rg-bg-hover); }
.mcc-icon-btn.apply[b-qhzs8tgw79] { color: var(--rg-primary); }
[data-mode="dark"] .mcc-icon-btn.apply[b-qhzs8tgw79] { color: #93c5fd; }
.mcc-icon-btn.del[b-qhzs8tgw79] { color: var(--rg-danger); }
.mcc-icon-btn.del:hover[b-qhzs8tgw79] { background: rgba(220,38,38,.08); }

.mcc-doc-aplica[b-qhzs8tgw79] {
    display: inline-flex; align-items: center; gap: .3rem;
    font-size: .78rem;
    color: var(--rg-primary);
    font-weight: 500;
}
[data-mode="dark"] .mcc-doc-aplica[b-qhzs8tgw79] { color: #93c5fd; }

/* ── Empty state ───────────────────────────────────────── */
.mcc-empty[b-qhzs8tgw79] {
    padding: 3rem 2rem;
    text-align: center;
    color: var(--rg-text-muted);
    display: flex; flex-direction: column; align-items: center; gap: .35rem;
}
.mcc-empty i[b-qhzs8tgw79] { font-size: 2rem; color: var(--rg-text-muted); opacity: .35; margin-bottom: .25rem; }
.mcc-empty strong[b-qhzs8tgw79] { color: var(--rg-text-secondary); font-size: .95rem; font-weight: 600; }
.mcc-empty span[b-qhzs8tgw79] { font-size: .8rem; }

/* ── Footer totales ─────────────────────────────────────── */
.mcc-footer[b-qhzs8tgw79] {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: 1.5rem;
    padding: .7rem 1rem;
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
    align-items: center;
}
.mcc-totals-info[b-qhzs8tgw79] {
    color: var(--rg-text-secondary);
    font-size: .8rem;
    display: inline-flex; align-items: center; gap: .35rem;
}
.mcc-totals-info i[b-qhzs8tgw79] { color: var(--rg-text-muted); }
.mcc-total[b-qhzs8tgw79] {
    display: flex; flex-direction: column; align-items: flex-end; gap: 1px;
    min-width: 100px;
}
.mcc-total-lbl[b-qhzs8tgw79] {
    font-size: .65rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 600;
}
.mcc-total-val[b-qhzs8tgw79] {
    font-size: 1rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--rg-text-primary);
}
.mcc-total.diff.err .mcc-total-val[b-qhzs8tgw79] { color: var(--rg-danger); }

/* ── Status bar ─────────────────────────────────────────── */
.mcc-status-bar[b-qhzs8tgw79] {
    padding: .45rem 1rem .6rem 1rem;
    display: flex; justify-content: space-between; align-items: center;
    gap: 1rem; flex-wrap: wrap;
    background: var(--rg-bg-card);
}
.mcc-status-right[b-qhzs8tgw79] {
    display: inline-flex; align-items: center; gap: .75rem;
}
.mcc-toggle-btn[b-qhzs8tgw79] {
    display: inline-flex; align-items: center; gap: .3rem;
    background: transparent;
    border: 1px solid var(--rg-border);
    border-radius: 5px;
    padding: .25rem .6rem;
    font-size: .72rem; font-weight: 600;
    color: var(--rg-text-secondary);
    cursor: pointer;
    transition: all .12s;
    white-space: nowrap;
}
.mcc-toggle-btn:hover[b-qhzs8tgw79] {
    background: var(--rg-bg-hover);
    color: var(--rg-primary);
    border-color: var(--rg-primary);
}
[data-mode="dark"] .mcc-toggle-btn:hover[b-qhzs8tgw79] { color: #93c5fd; border-color: #93c5fd; }
.mcc-balance-badge[b-qhzs8tgw79] {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .25rem .65rem;
    border-radius: 4px;
    font-size: .72rem; font-weight: 600;
    background: rgba(22,163,74,.1);
    color: var(--rg-success);
    border: 1px solid rgba(22,163,74,.25);
}
.mcc-balance-badge.err[b-qhzs8tgw79] {
    background: rgba(220,38,38,.08);
    color: var(--rg-danger);
    border-color: rgba(220,38,38,.25);
}
[data-mode="dark"] .mcc-balance-badge[b-qhzs8tgw79] { color: #86efac; background: rgba(22,163,74,.15); }
[data-mode="dark"] .mcc-balance-badge.err[b-qhzs8tgw79] { color: #fca5a5; background: rgba(220,38,38,.12); }

.mcc-tips[b-qhzs8tgw79] {
    font-size: .7rem;
    color: var(--rg-text-muted);
}
.mcc-tips kbd[b-qhzs8tgw79] {
    background: var(--rg-bg-subtle);
    border: 1px solid var(--rg-border);
    border-radius: 3px;
    padding: 1px 5px;
    font-size: .68rem;
    font-family: 'Cascadia Code',monospace;
    color: var(--rg-text-secondary);
    margin: 0 1px;
}
/* _content/Rgclouds.Web/Components/Shared/NotFoundPage.razor.rz.scp.css */
/* ============================================================
   🚫 NotFoundPage.razor.css — Pagina 404 elegante
   ============================================================ */

.nf-container[b-en5ofnjha9] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 120px);
    padding: 2rem;
}

.nf-card[b-en5ofnjha9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 440px;
    width: 100%;
    padding: 3rem 2.5rem;
    background: var(--rg-bg-card, #ffffff);
    border-radius: 20px;
    border: 1px solid var(--rg-border, #eef0f4);
    box-shadow: var(--rg-shadow-md, 0 4px 24px rgba(0, 0, 0, 0.06));
}

/* ============================================================
   🧭 ICONO — Brujula animada
   ============================================================ */

.nf-icon-area[b-en5ofnjha9] {
    position: relative;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.nf-circle[b-en5ofnjha9] {
    position: absolute;
    border-radius: 50%;
    border: 2px solid rgba(245, 158, 11, 0.15);
}

.nf-circle.c1[b-en5ofnjha9] {
    width: 90px;
    height: 90px;
    animation: nfPulse-b-en5ofnjha9 3s ease-in-out infinite;
}

.nf-circle.c2[b-en5ofnjha9] {
    width: 60px;
    height: 60px;
    background: rgba(245, 158, 11, 0.06);
    border-color: rgba(245, 158, 11, 0.2);
    animation: nfPulse-b-en5ofnjha9 3s ease-in-out 0.5s infinite;
}

.nf-compass[b-en5ofnjha9] {
    font-size: 1.75rem;
    color: #f59e0b;
    z-index: 2;
    position: relative;
    animation: nfSpin-b-en5ofnjha9 4s ease-in-out infinite alternate;
}

@keyframes nfPulse-b-en5ofnjha9 {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.06); opacity: 0.6; }
}

@keyframes nfSpin-b-en5ofnjha9 {
    0% { transform: rotate(-15deg); }
    100% { transform: rotate(15deg); }
}

/* ============================================================
   📝 TEXTO
   ============================================================ */

.nf-text-area[b-en5ofnjha9] {
    margin-bottom: 1.5rem;
}

.nf-code[b-en5ofnjha9] {
    font-size: 3rem;
    font-weight: 800;
    color: rgba(245, 158, 11, 0.2);
    line-height: 1;
    letter-spacing: -0.02em;
}

.nf-title[b-en5ofnjha9] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0.5rem 0 0.5rem 0;
    line-height: 1.3;
}

.nf-subtitle[b-en5ofnjha9] {
    font-size: 0.875rem;
    color: var(--rg-text-muted, #64748b);
    margin: 0;
    line-height: 1.6;
}

/* ============================================================
   🔗 RUTA ACTUAL
   ============================================================ */

.nf-route-info[b-en5ofnjha9] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-radius: 8px;
    border: 1px solid var(--rg-border, #eef0f4);
    font-size: 0.75rem;
    color: var(--rg-text-faint, #94a3b8);
    font-family: 'Consolas', 'Courier New', monospace;
    margin-bottom: 2rem;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nf-route-info i[b-en5ofnjha9] {
    font-size: 0.875rem;
    color: var(--rg-text-faint, #94a3b8);
    flex-shrink: 0;
}

/* ============================================================
   🔘 BOTONES
   ============================================================ */

.nf-actions[b-en5ofnjha9] {
    display: flex;
    gap: 0.75rem;
    width: 100%;
}

.nf-btn-primary[b-en5ofnjha9] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: var(--rg-primary, #3b82f6);
    border: 2px solid var(--rg-primary, #3b82f6);
    color: #ffffff;
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.nf-btn-primary:hover[b-en5ofnjha9] {
    background: var(--rg-primary-hover, #2563eb);
    border-color: var(--rg-primary-hover, #2563eb);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(var(--rg-primary-rgb, 59, 130, 246), 0.3);
}

.nf-btn-secondary[b-en5ofnjha9] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: transparent;
    border: 2px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-secondary, #475569);
    border-radius: 10px;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.nf-btn-secondary:hover[b-en5ofnjha9] {
    border-color: var(--rg-text-faint, #94a3b8);
    background: var(--rg-bg-hover, #f8fafc);
}

/* ============================================================
   📱 RESPONSIVE
   ============================================================ */

@media (max-width: 480px) {
    .nf-card[b-en5ofnjha9] {
        padding: 2rem 1.5rem;
    }

    .nf-actions[b-en5ofnjha9] {
        flex-direction: column;
    }

    .nf-code[b-en5ofnjha9] {
        font-size: 2.5rem;
    }
}
/* _content/Rgclouds.Web/Components/Shared/OperadorPinGate.razor.rz.scp.css */
/* ── Gate de identificación por PIN ── */
.opg-shell[b-cbznplp7uk] { min-height: calc(100vh - 160px); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem 1rem; outline:none; }
.opg-header[b-cbznplp7uk] { text-align:center; margin-bottom:1.6rem; }
.opg-brand[b-cbznplp7uk] { width:44px; height:44px; border-radius:12px; background:var(--rg-primary,#1a3a5c); color:#fff; font-weight:700; font-size:22px; display:inline-flex; align-items:center; justify-content:center; margin-bottom:.6rem; }
.opg-title[b-cbznplp7uk] { font-size:1.4rem; font-weight:700; color:var(--rg-text-primary,#1e293b); }
.opg-sub[b-cbznplp7uk] { font-size:.82rem; color:var(--rg-text-muted,#94a3b8); margin-top:.25rem; }
.opg-pill[b-cbznplp7uk] { display:inline-flex; align-items:center; gap:.4rem; background:var(--rg-bg-subtle,#f1f5f9); border:1px solid var(--rg-border,#e2e8f0); padding:.3rem .8rem; border-radius:100px; font-size:.74rem; color:var(--rg-text-secondary,#475569); margin-top:.7rem; }
.opg-dot[b-cbznplp7uk] { opacity:.5; }
.opg-on[b-cbznplp7uk] { font-size:7px; color:#16a34a; }

.opg-card[b-cbznplp7uk] { background:var(--rg-bg-card,#fff); border:1px solid var(--rg-border,#e2e8f0); border-radius:16px; box-shadow:0 24px 64px rgba(0,0,0,.18); width:100%; max-width:860px; overflow:hidden; display:grid; grid-template-columns:1fr 320px; }
@media (max-width:760px){ .opg-card[b-cbznplp7uk] { grid-template-columns:1fr; } }

/* usuarios */
.opg-users[b-cbznplp7uk] { padding:1.4rem; }
.opg-users-title[b-cbznplp7uk] { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--rg-text-muted,#94a3b8); font-weight:700; margin-bottom:1rem; }
.opg-empty[b-cbznplp7uk] { color:var(--rg-text-muted,#94a3b8); font-size:.85rem; padding:1.5rem 0; text-align:center; }
.opg-grid[b-cbznplp7uk] { display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
@media (max-width:760px){ .opg-grid[b-cbznplp7uk] { grid-template-columns:repeat(2,1fr); } }
.opg-tile[b-cbznplp7uk] { border:1px solid var(--rg-border,#e2e8f0); border-radius:.7rem; padding:1rem .6rem; text-align:center; cursor:pointer; background:var(--rg-bg-card,#fff); transition:all .12s; display:flex; flex-direction:column; align-items:center; gap:.1rem; }
.opg-tile:hover:not(:disabled)[b-cbznplp7uk] { border-color:var(--rg-primary,#1a3a5c); background:var(--rg-bg-hover,#f8fafc); }
.opg-tile.sel[b-cbznplp7uk] { border-color:var(--rg-primary,#1a3a5c); background:rgba(26,58,92,.06); box-shadow:0 0 0 3px rgba(26,58,92,.12); }
.opg-tile.lock[b-cbznplp7uk] { opacity:.55; cursor:not-allowed; border-style:dashed; }
.opg-tile:disabled[b-cbznplp7uk] { cursor:not-allowed; }
.opg-avatar[b-cbznplp7uk] { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1rem; margin-bottom:.4rem; }
.opg-avatar-lg[b-cbznplp7uk] { width:56px; height:56px; margin:0 auto .5rem; }
.opg-name[b-cbznplp7uk] { font-weight:600; font-size:.82rem; color:var(--rg-text-primary,#1e293b); }
.opg-role[b-cbznplp7uk] { font-size:.7rem; color:var(--rg-text-muted,#94a3b8); }
.opg-badge[b-cbznplp7uk] { margin-top:.4rem; font-size:.66rem; font-weight:700; padding:.1rem .5rem; border-radius:1rem; }
.opg-badge.lock[b-cbznplp7uk] { background:rgba(220,38,38,.12); color:#dc2626; }
.opg-badge.nopin[b-cbznplp7uk] { background:rgba(148,163,184,.18); color:var(--rg-text-muted,#94a3b8); }

/* pin */
.opg-pin[b-cbznplp7uk] { background:var(--rg-bg-page,#f8fafc); border-left:1px solid var(--rg-border,#e2e8f0); padding:1.4rem 1.2rem; display:flex; flex-direction:column; }
@media (max-width:760px){ .opg-pin[b-cbznplp7uk] { border-left:none; border-top:1px solid var(--rg-border,#e2e8f0); } }
.opg-pin-empty[b-cbznplp7uk] { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6rem; color:var(--rg-text-muted,#94a3b8); text-align:center; font-size:.82rem; padding:2rem 0; }
.opg-pin-empty i[b-cbznplp7uk] { font-size:2rem; }
.opg-pin-user[b-cbznplp7uk] { text-align:center; margin-bottom:1rem; }
.opg-pin-name[b-cbznplp7uk] { font-weight:700; font-size:.9rem; color:var(--rg-text-primary,#1e293b); }
.opg-pin-hint2[b-cbznplp7uk] { font-size:.72rem; color:var(--rg-text-muted,#94a3b8); }
.opg-display[b-cbznplp7uk] { display:flex; justify-content:center; gap:.75rem; margin-bottom:1.2rem; }
.opg-digit[b-cbznplp7uk] { width:16px; height:16px; border-radius:50%; border:2px solid var(--rg-border,#cbd5e1); }
.opg-digit.on[b-cbznplp7uk] { background:var(--rg-primary,#1a3a5c); border-color:var(--rg-primary,#1a3a5c); }
.opg-pad[b-cbznplp7uk] { display:grid; grid-template-columns:repeat(3,1fr); gap:.55rem; }
.opg-key[b-cbznplp7uk] { aspect-ratio:1.5; border:1px solid var(--rg-border,#e2e8f0); border-radius:.6rem; background:var(--rg-bg-card,#fff); font-family:'Cascadia Code',monospace; font-size:1.25rem; font-weight:700; cursor:pointer; color:var(--rg-text-primary,#1e293b); transition:all .1s; }
.opg-key:hover:not(:disabled)[b-cbznplp7uk] { background:var(--rg-bg-hover,#f1f5f9); border-color:var(--rg-primary,#1a3a5c); }
.opg-key:disabled[b-cbznplp7uk] { opacity:.5; cursor:not-allowed; }
.opg-key.act[b-cbznplp7uk] { font-size:1rem; color:var(--rg-text-secondary,#475569); }
.opg-key.ok[b-cbznplp7uk] { background:var(--rg-primary,#1a3a5c); color:#fff; border-color:var(--rg-primary,#1a3a5c); }
.opg-error[b-cbznplp7uk] { background:rgba(220,38,38,.1); color:#dc2626; border-radius:.4rem; padding:.5rem .75rem; font-size:.76rem; text-align:center; margin-top:.75rem; display:flex; align-items:center; justify-content:center; gap:.4rem; }
.opg-foot[b-cbznplp7uk] { text-align:center; font-size:.7rem; color:var(--rg-text-muted,#94a3b8); margin-top:1rem; }
.spin[b-cbznplp7uk] { animation: opgspin-b-cbznplp7uk .8s linear infinite; } @keyframes opgspin-b-cbznplp7uk { to { transform:rotate(360deg);} }
/* _content/Rgclouds.Web/Components/Shared/PdfViewerModal.razor.rz.scp.css */
/* PdfViewerModal.razor.css — Visor de PDF reutilizable para todo el sistema */

.pvm-backdrop[b-wp8kziccue] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 3000;  /* siempre encima de modales anidados (2000/2001) */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: pvm-fade-in-b-wp8kziccue 0.15s ease;
}

@keyframes pvm-fade-in-b-wp8kziccue {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.pvm-dialog[b-wp8kziccue] {
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 10px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
    display: flex;
    flex-direction: column;
    width: min(960px, 95vw);
    height: min(90vh, 860px);
    overflow: hidden;
    animation: pvm-slide-in-b-wp8kziccue 0.18s ease;
}

@keyframes pvm-slide-in-b-wp8kziccue {
    from { transform: translateY(-20px); opacity: 0; }
    to   { transform: translateY(0);     opacity: 1; }
}

/* ── Header ─────────────────────────────────────────── */
.pvm-header[b-wp8kziccue] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--rg-border);
    background: var(--rg-bg-subtle);
    flex-shrink: 0;
}

.pvm-header-left[b-wp8kziccue] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.pvm-icon[b-wp8kziccue] {
    font-size: 1.25rem;
    color: #e53e3e;
    flex-shrink: 0;
}

.pvm-title[b-wp8kziccue] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--rg-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pvm-header-actions[b-wp8kziccue] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.pvm-btn-download[b-wp8kziccue] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    background: var(--rg-primary);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: opacity 0.15s;
}

.pvm-btn-download:hover:not(:disabled)[b-wp8kziccue] {
    opacity: 0.88;
}

.pvm-btn-download:disabled[b-wp8kziccue] {
    opacity: 0.45;
    cursor: not-allowed;
}

.pvm-close[b-wp8kziccue] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    color: var(--rg-text-secondary);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.pvm-close:hover[b-wp8kziccue] {
    background: var(--rg-danger);
    color: #fff;
    border-color: var(--rg-danger);
}

/* ── Body ────────────────────────────────────────────── */
.pvm-body[b-wp8kziccue] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--rg-bg-page);
}

.pvm-iframe[b-wp8kziccue] {
    flex: 1;
    width: 100%;
    border: none;
    background: var(--rg-bg-page);
}

/* Canvas container — PDF.js renderiza aquí en Android/iOS */
.pvm-canvas-container[b-wp8kziccue] {
    flex: 1;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.5rem;
    background: var(--rg-bg-subtle);
    box-sizing: border-box;
}

/* ── Estado (loading / error) ───────────────────────── */
.pvm-state[b-wp8kziccue] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    color: var(--rg-text-secondary);
    font-size: 0.9rem;
}

.pvm-error[b-wp8kziccue] {
    color: var(--rg-danger);
}

.pvm-error i[b-wp8kziccue] {
    font-size: 2rem;
}

.pvm-spinner[b-wp8kziccue] {
    width: 32px;
    height: 32px;
    border: 3px solid var(--rg-border);
    border-top-color: var(--rg-primary);
    border-radius: 50%;
    animation: pvm-spin-b-wp8kziccue 0.7s linear infinite;
}

@keyframes pvm-spin-b-wp8kziccue {
    to { transform: rotate(360deg); }
}

/* ── Responsive ─────────────────────────────────────── */
@media (max-width: 600px) {
    .pvm-dialog[b-wp8kziccue] {
        width: 100vw;
        height: 100dvh;
        border-radius: 0;
    }

    .pvm-btn-download span[b-wp8kziccue] {
        display: none;
    }
}
/* _content/Rgclouds.Web/Components/Shared/ProductoAhorroSmartInput.razor.rz.scp.css */
/* ============================================================
   🏦 ProductoAhorroSmartInput.razor.css
   ============================================================ */

.pai-wrap[b-841i4cr590] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.2rem;
}

.pai-input-row[b-841i4cr590] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
}

.pai-input[b-841i4cr590] {
    flex: 1;
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.45rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.pai-input[b-841i4cr590]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.pai-input:focus[b-841i4cr590] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.pai-input:disabled[b-841i4cr590] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    cursor: not-allowed;
}

.pai-icon[b-841i4cr590] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--rg-text-muted, #94a3b8);
    pointer-events: none;
}

.pai-spin i[b-841i4cr590] {
    display: inline-block;
    animation: pai-rotate-b-841i4cr590 0.9s linear infinite;
    color: var(--rg-primary, #2563eb);
}

@keyframes pai-rotate-b-841i4cr590 { to { transform: rotate(360deg); } }

.pai-clear[b-841i4cr590] {
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    border-radius: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    padding: 0;
}

.pai-clear:hover[b-841i4cr590] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
}

.pai-drop[b-841i4cr590] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: pai-fade-b-841i4cr590 0.12s ease-out;
}

@keyframes pai-fade-b-841i4cr590 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.pai-item[b-841i4cr590] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-primary, #1e293b);
    transition: background-color 0.1s;
    font-size: 0.85rem;
}

.pai-item:last-child[b-841i4cr590] { border-bottom: none; }

.pai-item:hover[b-841i4cr590],
.pai-item.active[b-841i4cr590] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.pai-item-id[b-841i4cr590] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

[data-mode="dark"] .pai-item-id[b-841i4cr590] { color: #93c5fd; }

.pai-item-name[b-841i4cr590] {
    flex: 1;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Badges por tipo ──────────────────────────────────────── */
.pai-badge[b-841i4cr590] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.08rem 0.45rem;
    border-radius: 0.6rem;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.pai-badge-san[b-841i4cr590] {
    background: rgba(147, 51, 234, 0.14);
    color: #7c3aed;
    border: 1px solid rgba(147, 51, 234, 0.32);
}

.pai-badge-cap[b-841i4cr590] {
    background: rgba(22, 163, 74, 0.14);
    color: var(--rg-success, #16a34a);
    border: 1px solid rgba(22, 163, 74, 0.32);
}

.pai-badge-pf[b-841i4cr590] {
    background: rgba(37, 99, 235, 0.14);
    color: var(--rg-accent, #2563eb);
    border: 1px solid rgba(37, 99, 235, 0.32);
}

.pai-badge-vista[b-841i4cr590] {
    background: rgba(148, 163, 184, 0.18);
    color: var(--rg-text-secondary, #475569);
    border: 1px solid rgba(148, 163, 184, 0.32);
}

[data-mode="dark"] .pai-badge-san[b-841i4cr590]   { color: #c4b5fd; }
[data-mode="dark"] .pai-badge-cap[b-841i4cr590]   { color: #86efac; }
[data-mode="dark"] .pai-badge-pf[b-841i4cr590]    { color: #93c5fd; }
[data-mode="dark"] .pai-badge-vista[b-841i4cr590] { color: #cbd5e1; }

.pai-hint-row[b-841i4cr590] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.pai-hint[b-841i4cr590] {
    font-size: 0.78rem;
    font-weight: 600;
}

.pai-hint.ok[b-841i4cr590]   { color: var(--rg-success, #16a34a); }
.pai-hint.err[b-841i4cr590]  { color: var(--rg-danger, #dc2626); }
.pai-hint.warn[b-841i4cr590] { color: var(--rg-warning, #d97706); }

[data-mode="dark"] .pai-hint.ok[b-841i4cr590]   { color: #86efac; }
[data-mode="dark"] .pai-hint.err[b-841i4cr590]  { color: #fca5a5; }
[data-mode="dark"] .pai-hint.warn[b-841i4cr590] { color: #fcd34d; }
/* _content/Rgclouds.Web/Components/Shared/ProductoPrestamoSmartInput.razor.rz.scp.css */
/* ============================================================
   💰 ProductoPrestamoSmartInput.razor.css
   ============================================================ */

.ppi-wrap[b-8h9lo7eqxt] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.2rem;
}

.ppi-input-row[b-8h9lo7eqxt] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    width: 100%;
}

.ppi-input[b-8h9lo7eqxt] {
    flex: 1;
    width: 100%;
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.45rem;
    background: var(--rg-bg-input, #ffffff);
    color: var(--rg-text-primary, #1e293b);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.ppi-input[b-8h9lo7eqxt]::placeholder { color: var(--rg-text-muted, #94a3b8); }

.ppi-input:focus[b-8h9lo7eqxt] {
    border-color: var(--rg-primary, #1a3a5c);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}

.ppi-input:disabled[b-8h9lo7eqxt] {
    background: var(--rg-bg-subtle, #f1f5f9);
    color: var(--rg-text-muted, #94a3b8);
    cursor: not-allowed;
}

.ppi-icon[b-8h9lo7eqxt] {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.95rem;
    color: var(--rg-text-muted, #94a3b8);
    pointer-events: none;
}

.ppi-spin i[b-8h9lo7eqxt] {
    display: inline-block;
    animation: ppi-rotate-b-8h9lo7eqxt 0.9s linear infinite;
    color: var(--rg-primary, #2563eb);
}

@keyframes ppi-rotate-b-8h9lo7eqxt { to { transform: rotate(360deg); } }

.ppi-clear[b-8h9lo7eqxt] {
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    color: var(--rg-danger, #dc2626);
    border-radius: 0.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.7rem;
    transition: all 0.15s ease;
    padding: 0;
}

.ppi-clear:hover[b-8h9lo7eqxt] {
    background: var(--rg-danger, #dc2626);
    color: #ffffff;
}

.ppi-drop[b-8h9lo7eqxt] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--rg-bg-card, #ffffff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: 0.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
    max-height: 340px;
    overflow-y: auto;
    z-index: 1200;
    animation: ppi-fade-b-8h9lo7eqxt 0.12s ease-out;
}

@keyframes ppi-fade-b-8h9lo7eqxt {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.ppi-item[b-8h9lo7eqxt] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border, #e2e8f0);
    color: var(--rg-text-primary, #1e293b);
    transition: background-color 0.1s;
    font-size: 0.85rem;
}

.ppi-item:last-child[b-8h9lo7eqxt] { border-bottom: none; }

.ppi-item:hover[b-8h9lo7eqxt],
.ppi-item.active[b-8h9lo7eqxt] {
    background: var(--rg-bg-hover, rgba(37, 99, 235, 0.08));
}

.ppi-item-id[b-8h9lo7eqxt] {
    font-family: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    background: rgba(37, 99, 235, 0.10);
    color: var(--rg-accent, #2563eb);
    padding: 0.05rem 0.4rem;
    border-radius: 0.3rem;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

[data-mode="dark"] .ppi-item-id[b-8h9lo7eqxt] { color: #93c5fd; }

.ppi-item-name[b-8h9lo7eqxt] {
    flex: 1;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ppi-hint-row[b-8h9lo7eqxt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.2rem;
}

.ppi-hint[b-8h9lo7eqxt] {
    font-size: 0.78rem;
    font-weight: 600;
}

.ppi-hint.ok[b-8h9lo7eqxt]  { color: var(--rg-success, #16a34a); }
.ppi-hint.err[b-8h9lo7eqxt] { color: var(--rg-danger, #dc2626); }

[data-mode="dark"] .ppi-hint.ok[b-8h9lo7eqxt]  { color: #86efac; }
[data-mode="dark"] .ppi-hint.err[b-8h9lo7eqxt] { color: #fca5a5; }
/* _content/Rgclouds.Web/Components/Shared/ProfesorSmartInput.razor.rz.scp.css */
/* ============================================================
   👤 UsuarioSmartInput — Estilos aislados
   Mismo patrón visual que CuentaContableSmartInput
   ============================================================ */

.psi-wrap[b-i4ppzi9paw] { position: relative; display: flex; flex-direction: column; gap: .15rem; width: 100%; }
.psi-input-row[b-i4ppzi9paw] { position: relative; display: flex; align-items: center; }

.psi-input[b-i4ppzi9paw] {
    width: 100%;
    padding: .375rem .55rem;
    padding-right: 2rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .375rem;
    font-size: .8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.psi-input:focus[b-i4ppzi9paw] {
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 2px rgba(37,99,235,.15);
}
.psi-input:disabled[b-i4ppzi9paw] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

.psi-icon[b-i4ppzi9paw], .psi-clear[b-i4ppzi9paw] {
    position: absolute; right: .35rem; top: 50%; transform: translateY(-50%);
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: .85rem; padding: .25rem; line-height: 1;
}
.psi-clear:hover[b-i4ppzi9paw] { color: var(--rg-text-primary, #1e293b); }
.psi-spin i[b-i4ppzi9paw] { animation: psi-rot-b-i4ppzi9paw 0.8s linear infinite; display: inline-block; }
@keyframes psi-rot-b-i4ppzi9paw { to { transform: rotate(360deg); } }

.psi-drop[b-i4ppzi9paw] {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    z-index: 50;
    margin-top: .25rem;
    max-height: 280px;
    overflow-y: auto;
}

.psi-item[b-i4ppzi9paw] {
    display: flex; align-items: center; gap: .5rem;
    padding: .45rem .65rem;
    font-size: .78rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.psi-item:last-child[b-i4ppzi9paw] { border-bottom: none; }
.psi-item:hover[b-i4ppzi9paw], .psi-item.active[b-i4ppzi9paw] {
    background: var(--rg-bg-hover, #f1f5f9);
}

.psi-item-id[b-i4ppzi9paw] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: .72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    background: var(--rg-bg-subtle, #f8fafc);
    padding: .1rem .4rem;
    border-radius: .25rem;
    min-width: 90px;
    flex-shrink: 0;
}
.psi-item-name[b-i4ppzi9paw] { flex: 1; }
.psi-badge[b-i4ppzi9paw] {
    font-size: .65rem;
    font-weight: 700;
    color: var(--rg-accent, #2563eb);
    background: rgba(37,99,235,.1);
    padding: .1rem .4rem;
    border-radius: .25rem;
    flex-shrink: 0;
}

.psi-hint-row[b-i4ppzi9paw] { min-height: 1.1rem; }
.psi-hint[b-i4ppzi9paw] { font-size: .7rem; }
.psi-hint.ok[b-i4ppzi9paw]  { color: var(--rg-success, #16a34a); }
.psi-hint.err[b-i4ppzi9paw] { color: var(--rg-danger,  #dc2626); }

[data-mode="dark"] .psi-item-id[b-i4ppzi9paw]   { background: rgba(255,255,255,.05); }
[data-mode="dark"] .psi-drop[b-i4ppzi9paw]      { box-shadow: 0 8px 24px rgba(0,0,0,.4); }
/* _content/Rgclouds.Web/Components/Shared/QuickActionsModal.razor.rz.scp.css */
/* ============================================================
   🎯 QuickActionsModal.razor.css — Estilos del modal de config
   ============================================================ */

.qa-modal-backdrop[b-uy2h0coulb] {
    position: fixed;
    inset: 0;
    background: rgba(10, 22, 40, 0.72);
    backdrop-filter: blur(4px);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    padding-top: max(1rem, env(safe-area-inset-top));
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
    animation: qa-fade-in-b-uy2h0coulb 0.2s ease-out;
}

@keyframes qa-fade-in-b-uy2h0coulb {
    from { opacity: 0; }
    to { opacity: 1; }
}

.qa-modal[b-uy2h0coulb] {
    background: var(--bs-body-bg, #ffffff);
    color: var(--bs-body-color, #1a1a1a);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    width: 100%;
    max-width: 560px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: qa-slide-up-b-uy2h0coulb 0.25s ease-out;
}

@keyframes qa-slide-up-b-uy2h0coulb {
    from { transform: translateY(16px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* ---------- Header ---------- */
.qa-modal-header[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    background: linear-gradient(135deg, #1a3a5c 0%, #2c5282 100%);
    color: #ffffff;
}

.qa-modal-title[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.qa-modal-title i[b-uy2h0coulb] {
    font-size: 1.25rem;
    color: #ffd93d;
}

.qa-modal-close[b-uy2h0coulb] {
    background: rgba(255, 255, 255, 0.12);
    border: none;
    color: #ffffff;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.18s;
}

.qa-modal-close:hover[b-uy2h0coulb] {
    background: rgba(255, 255, 255, 0.24);
}

/* ---------- Toolbar ---------- */
.qa-modal-toolbar[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: rgba(0, 0, 0, 0.02);
    flex-wrap: wrap;
}

.qa-counter[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background: #e8f4f8;
    color: #1a3a5c;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.qa-counter.full[b-uy2h0coulb] {
    background: #fff3cd;
    color: #8a6d3b;
}

.qa-search[b-uy2h0coulb] {
    flex: 1;
    min-width: 180px;
    position: relative;
    display: flex;
    align-items: center;
}

.qa-search i[b-uy2h0coulb] {
    position: absolute;
    left: 0.75rem;
    color: rgba(0, 0, 0, 0.45);
    pointer-events: none;
}

.qa-search input[b-uy2h0coulb] {
    width: 100%;
    padding: 0.55rem 0.75rem 0.55rem 2.25rem;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
    font-size: 0.9rem;
    background: #ffffff;
    outline: none;
    transition: border-color 0.18s, box-shadow 0.18s;
}

.qa-search input:focus[b-uy2h0coulb] {
    border-color: #1a3a5c;
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.12);
}

/* ---------- Body ---------- */
.qa-modal-body[b-uy2h0coulb] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem 1rem;
    -webkit-overflow-scrolling: touch;
}

.qa-loading[b-uy2h0coulb],
.qa-empty[b-uy2h0coulb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 1rem;
    color: rgba(0, 0, 0, 0.5);
}

.qa-empty i[b-uy2h0coulb] {
    font-size: 2.5rem;
    opacity: 0.5;
}

.qa-spinner[b-uy2h0coulb] {
    width: 32px;
    height: 32px;
    border: 3px solid rgba(26, 58, 92, 0.12);
    border-top-color: #1a3a5c;
    border-radius: 50%;
    animation: qa-spin-b-uy2h0coulb 0.9s linear infinite;
}

@keyframes qa-spin-b-uy2h0coulb {
    to { transform: rotate(360deg); }
}

/* ---------- Options list ---------- */
.qa-options-list[b-uy2h0coulb] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.qa-option[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
    background: #ffffff;
    position: relative;
}

.qa-option:hover:not(.disabled)[b-uy2h0coulb] {
    border-color: #1a3a5c;
    background: #f4f8fc;
}

.qa-option.selected[b-uy2h0coulb] {
    border-color: #1a3a5c;
    background: linear-gradient(135deg, #e8f1f9 0%, #f4f8fc 100%);
    box-shadow: 0 2px 8px rgba(26, 58, 92, 0.08);
}

.qa-option.disabled[b-uy2h0coulb] {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.3);
}

.qa-option input[type="checkbox"][b-uy2h0coulb] {
    width: 18px;
    height: 18px;
    accent-color: #1a3a5c;
    cursor: inherit;
    flex-shrink: 0;
}

.qa-option-icon[b-uy2h0coulb] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 58, 92, 0.08);
    border-radius: 8px;
    color: #1a3a5c;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.qa-option.selected .qa-option-icon[b-uy2h0coulb] {
    background: #1a3a5c;
    color: #ffffff;
}

.qa-option-text[b-uy2h0coulb] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.qa-option-title[b-uy2h0coulb] {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--bs-body-color, #1a1a1a);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.qa-option-route[b-uy2h0coulb] {
    font-size: 0.72rem;
    color: rgba(0, 0, 0, 0.45);
    font-family: "SFMono-Regular", Consolas, monospace;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.qa-option-order[b-uy2h0coulb] {
    position: absolute;
    top: 0.35rem;
    right: 0.5rem;
    min-width: 22px;
    height: 22px;
    padding: 0 0.45rem;
    background: #1a3a5c;
    color: #ffffff;
    border-radius: 11px;
    font-size: 0.72rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---------- Footer ---------- */
.qa-modal-footer[b-uy2h0coulb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    background: rgba(0, 0, 0, 0.02);
    flex-wrap: wrap;
}

.qa-error[b-uy2h0coulb] {
    flex: 1 1 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
    background: #fde8e8;
    color: #8b1a1a;
    border-radius: 8px;
    font-size: 0.85rem;
}

.qa-btn[b-uy2h0coulb] {
    padding: 0.6rem 1.1rem;
    border: none;
    border-radius: 9px;
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.18s;
    min-height: 40px;
}

.qa-btn:disabled[b-uy2h0coulb] {
    opacity: 0.6;
    cursor: not-allowed;
}

.qa-btn-secondary[b-uy2h0coulb] {
    background: rgba(0, 0, 0, 0.06);
    color: var(--bs-body-color, #1a1a1a);
}

.qa-btn-secondary:hover:not(:disabled)[b-uy2h0coulb] {
    background: rgba(0, 0, 0, 0.1);
}

.qa-btn-primary[b-uy2h0coulb] {
    background: linear-gradient(135deg, #1a3a5c 0%, #2c5282 100%);
    color: #ffffff;
    margin-left: auto;
}

.qa-btn-primary:hover:not(:disabled)[b-uy2h0coulb] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(26, 58, 92, 0.35);
}

/* ---------- Dark mode ---------- */
:root[data-bs-theme="dark"] .qa-modal[b-uy2h0coulb],
.dark-mode .qa-modal[b-uy2h0coulb] {
    background: #1a2332;
    color: #e8eaed;
}

:root[data-bs-theme="dark"] .qa-option[b-uy2h0coulb],
.dark-mode .qa-option[b-uy2h0coulb] {
    background: #243247;
    border-color: rgba(255, 255, 255, 0.08);
}

:root[data-bs-theme="dark"] .qa-option:hover:not(.disabled)[b-uy2h0coulb],
.dark-mode .qa-option:hover:not(.disabled)[b-uy2h0coulb] {
    background: #2d3e58;
}

:root[data-bs-theme="dark"] .qa-option.selected[b-uy2h0coulb],
.dark-mode .qa-option.selected[b-uy2h0coulb] {
    background: linear-gradient(135deg, #2d3e58 0%, #243247 100%);
    border-color: #4a7bb0;
}

:root[data-bs-theme="dark"] .qa-search input[b-uy2h0coulb],
.dark-mode .qa-search input[b-uy2h0coulb] {
    background: #243247;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e8eaed;
}

/* ---------- Responsive mobile ---------- */
@media (max-width: 640px) {
    .qa-modal[b-uy2h0coulb] {
        max-height: 100vh;
        max-height: 100dvh;
        height: 100%;
        border-radius: 0;
        max-width: 100%;
    }

    .qa-modal-backdrop[b-uy2h0coulb] {
        padding: 0;
    }

    .qa-modal-toolbar[b-uy2h0coulb] {
        flex-direction: column;
        align-items: stretch;
    }

    .qa-counter[b-uy2h0coulb] {
        justify-content: center;
    }
}
/* _content/Rgclouds.Web/Components/Shared/RichTextEditor.razor.rz.scp.css */
/* ============================================================
   RichTextEditor — Estilos del wrapper Quill con dark mode
   Los selectores ql-* son globales (no scoped) porque Quill
   inyecta su propio DOM al lado de Blazor — para estilarlos
   se usa /deep/ via clases auxiliares y overrides en el host.
   ============================================================ */

.rg-rte-wrapper[b-wjvs1m0rdf] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    overflow: hidden;
    background: var(--rg-bg-card);
}

.rg-rte-host[b-wjvs1m0rdf] {
    flex: 1;
    min-height: 220px;
    background: var(--rg-bg-input);
}

/* Placeholders bar */
.rg-rte-placeholders[b-wjvs1m0rdf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    padding: 0.5rem 0.65rem;
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
    align-items: center;
}
.rg-rte-ph-label[b-wjvs1m0rdf] {
    font-size: 0.66rem;
    color: var(--rg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    margin-right: 0.25rem;
}
.rg-rte-ph-btn[b-wjvs1m0rdf] {
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.7rem;
    padding: 0.2rem 0.5rem;
    background: var(--rg-bg-card);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 0.3rem;
    cursor: pointer;
    transition: all 0.15s;
}
.rg-rte-ph-btn:hover[b-wjvs1m0rdf] {
    background: var(--rg-accent);
    color: #fff;
    border-color: var(--rg-accent);
}
/* _content/Rgclouds.Web/Components/Shared/RncManualEntryModal.razor.rz.scp.css */
/* ── Modal Backdrop / Container — siempre por encima de modales padres ── */
.modal-backdrop-rnc[b-oo4x3ko3yn]  { z-index: 2200 !important; background: rgba(0,0,0,0.5) !important;
                       position: fixed; inset: 0; backdrop-filter: blur(3px); }
.modal-container-rnc[b-oo4x3ko3yn] { z-index: 2201 !important;
                       position: fixed; inset: 0; display: flex; align-items: center;
                       justify-content: center; padding: 1rem; pointer-events: none; }

.rnc-manual-dialog[b-oo4x3ko3yn] {
    pointer-events: auto;
    background: var(--rg-bg-card);
    border: 1px solid var(--rg-border);
    border-radius: 0.75rem;
    width: 100%;
    max-width: 480px;
    max-height: 92vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}

.rnc-manual-dialog .modal-header[b-oo4x3ko3yn] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.85rem 1.25rem;
    background: var(--rg-bg-subtle);
    border-bottom: 1px solid var(--rg-border);
}

.rnc-manual-dialog .modal-header h2[b-oo4x3ko3yn] {
    margin: 0; font-size: 1rem; font-weight: 700;
    color: var(--rg-text-primary);
    display: flex; align-items: center; gap: 0.5rem;
}

.rnc-manual-dialog .modal-close[b-oo4x3ko3yn] {
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted);
    font-size: 1rem; padding: 0.25rem 0.5rem; border-radius: 0.25rem;
}

.rnc-manual-dialog .modal-close:hover[b-oo4x3ko3yn] {
    color: var(--rg-text-primary);
    background: var(--rg-bg-hover);
}

.rnc-manual-dialog .modal-body[b-oo4x3ko3yn] {
    padding: 1.25rem;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.rnc-manual-dialog .modal-footer[b-oo4x3ko3yn] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    background: var(--rg-bg-subtle);
    border-top: 1px solid var(--rg-border);
}

.rnc-info-box[b-oo4x3ko3yn] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.65rem 0.85rem;
    background: rgba(37,99,235,0.07);
    border: 1px solid rgba(37,99,235,0.25);
    border-radius: 0.45rem;
    font-size: 0.78rem;
    color: var(--rg-text-secondary);
    line-height: 1.45;
}

.rnc-info-box i[b-oo4x3ko3yn] { color: var(--rg-accent); font-size: 1rem; margin-top: 0.1rem; flex-shrink: 0; }
.rnc-info-box code[b-oo4x3ko3yn] {
    background: var(--rg-bg-subtle);
    padding: 0.05em 0.35em;
    border-radius: 3px;
    font-family: 'Cascadia Code','Fira Code',monospace;
    font-size: 0.75em;
    color: var(--rg-text-primary);
}

.form-row[b-oo4x3ko3yn] { display: flex; flex-direction: column; gap: 0.3rem; }
.form-row label[b-oo4x3ko3yn] {
    font-size: 0.7rem; color: var(--rg-text-secondary);
    text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600;
}
.form-row.form-row-h[b-oo4x3ko3yn] {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;
}
.form-input[b-oo4x3ko3yn], select.form-input[b-oo4x3ko3yn] {
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
}
.form-input:focus[b-oo4x3ko3yn] { border-color: var(--rg-accent); }

.rnc-mono[b-oo4x3ko3yn] { font-family: 'Cascadia Code','Fira Code',monospace; }

.rnc-alert[b-oo4x3ko3yn] { margin-top: 0.4rem; font-size: 0.78rem; padding: 0.55rem 0.8rem; border-radius: 0.4rem; display: flex; align-items: center; gap: 0.45rem; }
.crud-alert.success[b-oo4x3ko3yn] { background: rgba(22,163,74,0.1); color: #166534; border: 1px solid rgba(22,163,74,0.3); }
.crud-alert.error[b-oo4x3ko3yn]   { background: rgba(239,68,68,0.1); color: #991b1b; border: 1px solid rgba(239,68,68,0.3); }
[data-mode="dark"] .crud-alert.success[b-oo4x3ko3yn] { color: #86efac; }
[data-mode="dark"] .crud-alert.error[b-oo4x3ko3yn]   { color: #fca5a5; }

.btn-crud[b-oo4x3ko3yn] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.5rem;
    font-size: 0.82rem; font-weight: 600;
    cursor: pointer; transition: all 0.15s;
    background: transparent; color: var(--rg-text-secondary);
}
.btn-crud:disabled[b-oo4x3ko3yn] { opacity: 0.6; cursor: not-allowed; }
.btn-primary[b-oo4x3ko3yn] { background: var(--rg-accent); color: #fff; border-color: var(--rg-accent); }
.btn-primary:hover:not(:disabled)[b-oo4x3ko3yn] { filter: brightness(1.1); }
.btn-outline:hover:not(:disabled)[b-oo4x3ko3yn] { background: var(--rg-bg-hover); }

.spin[b-oo4x3ko3yn] { animation: rnc-modal-spin-b-oo4x3ko3yn 0.8s linear infinite; display: inline-block; }
@keyframes rnc-modal-spin-b-oo4x3ko3yn { to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/RncValidatorInput.razor.rz.scp.css */
.rnc-validator[b-bbogmgh4p0] { display: flex; flex-direction: column; gap: 0.35rem; }

.rnc-input[b-bbogmgh4p0] {
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--rg-border);
    border-radius: 0.4rem;
    font-size: 0.85rem;
    color: var(--rg-text-primary);
    background: var(--rg-bg-input);
    outline: none;
    width: 100%;
    box-sizing: border-box;
    font-family: 'Cascadia Code','Fira Code',monospace;
}

.rnc-input:focus[b-bbogmgh4p0] { border-color: var(--rg-accent); box-shadow: 0 0 0 2px rgba(37,99,235,0.15); }

.rnc-status[b-bbogmgh4p0] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.55rem;
    border-radius: 0.35rem;
    font-size: 0.75rem;
    line-height: 1.35;
    flex-wrap: wrap;
}

.rnc-status-loading[b-bbogmgh4p0] {
    background: var(--rg-bg-subtle);
    color: var(--rg-text-muted);
}

.rnc-status-ok[b-bbogmgh4p0] {
    background: rgba(22,163,74,0.1);
    color: #166534;
    border: 1px solid rgba(22,163,74,0.25);
}

.rnc-status-warn[b-bbogmgh4p0] {
    background: rgba(217,119,6,0.1);
    color: #92400e;
    border: 1px solid rgba(217,119,6,0.3);
}

.rnc-status-info[b-bbogmgh4p0] {
    background: rgba(37,99,235,0.07);
    color: #1e40af;
    border: 1px solid rgba(37,99,235,0.25);
}

[data-mode="dark"] .rnc-status-ok[b-bbogmgh4p0]   { color: #86efac; }
[data-mode="dark"] .rnc-status-warn[b-bbogmgh4p0] { color: #fcd34d; }
[data-mode="dark"] .rnc-status-info[b-bbogmgh4p0] { color: #93c5fd; }

.rnc-found-name[b-bbogmgh4p0] {
    font-weight: 600;
    flex: 1;
}

.rnc-badge-oficial[b-bbogmgh4p0],
.rnc-badge-manual[b-bbogmgh4p0] {
    font-size: 0.6rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
}

.rnc-badge-oficial[b-bbogmgh4p0] {
    background: var(--rg-accent);
    color: #fff;
}

.rnc-badge-manual[b-bbogmgh4p0] {
    background: var(--rg-text-muted);
    color: #fff;
}

.rnc-action-add[b-bbogmgh4p0] {
    margin-left: auto;
    background: transparent;
    border: 1px solid currentColor;
    color: inherit;
    padding: 0.18rem 0.55rem;
    border-radius: 0.3rem;
    font-size: 0.7rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    transition: all 0.12s;
}

.rnc-action-add:hover[b-bbogmgh4p0] { background: rgba(0,0,0,0.06); }
[data-mode="dark"] .rnc-action-add:hover[b-bbogmgh4p0] { background: rgba(255,255,255,0.08); }

.spin[b-bbogmgh4p0] { animation: rnc-spin-b-bbogmgh4p0 0.8s linear infinite; display: inline-block; }
@keyframes rnc-spin-b-bbogmgh4p0 { to { transform: rotate(360deg); } }
/* _content/Rgclouds.Web/Components/Shared/SqlEditor.razor.rz.scp.css */
.sql-editor-fallback[b-b7m9j7n13v] {
    width: 100%;
    height: 100%;
    min-height: 180px;
    background: var(--rg-bg-input);
    color: var(--rg-text-primary);
    border: 1px solid var(--rg-border);
    border-radius: 6px;
    padding: 0.6rem 0.75rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.85rem;
    line-height: 1.5;
    resize: vertical;
    outline: none;
}

.sql-editor-fallback:focus[b-b7m9j7n13v] {
    border-color: var(--rg-primary);
    box-shadow: 0 0 0 3px rgba(26, 58, 92, 0.15);
}
/* _content/Rgclouds.Web/Components/Shared/UnderConstruction.razor.rz.scp.css */
/* ============================================================
   🚧 UnderConstruction.razor.css — Pagina "En construccion"
   🎯 Diseño premium con animaciones sutiles
   ============================================================ */

.uc-container[b-acrxu1snh1] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 120px);
    padding: 2rem;
}

.uc-card[b-acrxu1snh1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 480px;
    width: 100%;
    padding: 3rem 2.5rem;
    background: var(--rg-bg-card, #ffffff);
    border-radius: 20px;
    border: 1px solid var(--rg-border, #eef0f4);
    box-shadow: var(--rg-shadow-md, 0 4px 24px rgba(0, 0, 0, 0.06));
}

/* ============================================================
   🔧 ICONO ANIMADO — Engranaje con anillos pulsantes
   ============================================================ */

.uc-icon-area[b-acrxu1snh1] {
    position: relative;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.uc-icon-ring[b-acrxu1snh1] {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 2px solid rgba(var(--rg-primary-rgb, 59, 130, 246), 0.15);
    animation: ucPulse-b-acrxu1snh1 3s ease-in-out infinite;
}

.uc-icon-ring.r2[b-acrxu1snh1] {
    width: 76px;
    height: 76px;
    border-color: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.2);
    animation-delay: 0.4s;
}

.uc-icon-ring.r3[b-acrxu1snh1] {
    width: 52px;
    height: 52px;
    background: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.08);
    border-color: rgba(var(--rg-primary-rgb, 59, 130, 246), 0.25);
    animation-delay: 0.8s;
}

.uc-gear[b-acrxu1snh1] {
    font-size: 1.75rem;
    color: var(--rg-primary, #3b82f6);
    z-index: 2;
    position: relative;
    animation: ucSpin-b-acrxu1snh1 6s linear infinite;
}

@keyframes ucPulse-b-acrxu1snh1 {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.6; }
}

@keyframes ucSpin-b-acrxu1snh1 {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ============================================================
   📝 TEXTO
   ============================================================ */

.uc-text-area[b-acrxu1snh1] {
    margin-bottom: 1.75rem;
}

.uc-title[b-acrxu1snh1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--rg-text-primary, #1e293b);
    margin: 0 0 0.5rem 0;
    line-height: 1.3;
}

.uc-subtitle[b-acrxu1snh1] {
    font-size: 0.9rem;
    color: var(--rg-text-muted, #64748b);
    margin: 0;
    line-height: 1.6;
}

/* ============================================================
   📋 DETALLES — Aplicacion y formulario
   ============================================================ */

.uc-details[b-acrxu1snh1] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.75rem;
    padding: 1rem;
    background: var(--rg-bg-subtle, #f8fafc);
    border-radius: 12px;
    border: 1px solid var(--rg-border, #eef0f4);
}

.uc-detail-row[b-acrxu1snh1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.25rem;
}

.uc-detail-row + .uc-detail-row[b-acrxu1snh1] {
    border-top: 1px solid var(--rg-border, #eef0f4);
    padding-top: 0.625rem;
}

.uc-detail-label[b-acrxu1snh1] {
    font-size: 0.8125rem;
    color: var(--rg-text-muted, #64748b);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-weight: 500;
}

.uc-detail-label i[b-acrxu1snh1] {
    font-size: 0.875rem;
    color: var(--rg-text-faint, #94a3b8);
}

.uc-detail-value[b-acrxu1snh1] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--rg-text-primary, #1e293b);
    max-width: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
}

/* ============================================================
   📊 BARRA DE PROGRESO — Animacion infinita
   ============================================================ */

.uc-progress-area[b-acrxu1snh1] {
    width: 100%;
    margin-bottom: 2rem;
}

.uc-progress-bar[b-acrxu1snh1] {
    width: 100%;
    height: 4px;
    background: var(--rg-bg-subtle, #e2e8f0);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.uc-progress-fill[b-acrxu1snh1] {
    width: 40%;
    height: 100%;
    background: var(--rg-gradient, linear-gradient(90deg, #3b82f6, #60a5fa));
    border-radius: 4px;
    animation: ucProgress-b-acrxu1snh1 2s ease-in-out infinite;
}

@keyframes ucProgress-b-acrxu1snh1 {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(300%); }
}

.uc-progress-text[b-acrxu1snh1] {
    font-size: 0.75rem;
    color: var(--rg-text-faint, #94a3b8);
    font-weight: 500;
}

/* ============================================================
   🔙 BOTON VOLVER
   ============================================================ */

.uc-back-btn[b-acrxu1snh1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.5rem;
    background: transparent;
    border: 2px solid var(--rg-primary, #3b82f6);
    color: var(--rg-primary, #3b82f6);
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.uc-back-btn:hover[b-acrxu1snh1] {
    background: var(--rg-primary, #3b82f6);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(var(--rg-primary-rgb, 59, 130, 246), 0.3);
}

/* ============================================================
   📱 RESPONSIVE
   ============================================================ */

@media (max-width: 480px) {
    .uc-card[b-acrxu1snh1] {
        padding: 2rem 1.5rem;
    }

    .uc-title[b-acrxu1snh1] {
        font-size: 1.125rem;
    }

    .uc-detail-value[b-acrxu1snh1] {
        max-width: 50%;
        font-size: 0.75rem;
    }
}
/* _content/Rgclouds.Web/Components/Shared/UsuarioSmartInput.razor.rz.scp.css */
/* ============================================================
   👤 UsuarioSmartInput — Estilos aislados
   Mismo patrón visual que CuentaContableSmartInput
   ============================================================ */

.usi-wrap[b-p0qidk2c9z] { position: relative; display: flex; flex-direction: column; gap: .15rem; width: 100%; }
.usi-input-row[b-p0qidk2c9z] { position: relative; display: flex; align-items: center; }

.usi-input[b-p0qidk2c9z] {
    width: 100%;
    padding: .375rem .55rem;
    padding-right: 2rem;
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .375rem;
    font-size: .8rem;
    color: var(--rg-text-primary, #1e293b);
    background: var(--rg-bg-card, #fff);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.usi-input:focus[b-p0qidk2c9z] {
    border-color: var(--rg-accent, #2563eb);
    box-shadow: 0 0 0 2px rgba(37,99,235,.15);
}
.usi-input:disabled[b-p0qidk2c9z] { background: var(--rg-bg-subtle, #f8fafc); color: var(--rg-text-muted, #94a3b8); }

.usi-icon[b-p0qidk2c9z], .usi-clear[b-p0qidk2c9z] {
    position: absolute; right: .35rem; top: 50%; transform: translateY(-50%);
    background: none; border: none; cursor: pointer;
    color: var(--rg-text-muted, #94a3b8);
    font-size: .85rem; padding: .25rem; line-height: 1;
}
.usi-clear:hover[b-p0qidk2c9z] { color: var(--rg-text-primary, #1e293b); }
.usi-spin i[b-p0qidk2c9z] { animation: usi-rot-b-p0qidk2c9z 0.8s linear infinite; display: inline-block; }
@keyframes usi-rot-b-p0qidk2c9z { to { transform: rotate(360deg); } }

.usi-drop[b-p0qidk2c9z] {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--rg-bg-card, #fff);
    border: 1px solid var(--rg-border, #e2e8f0);
    border-radius: .5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    z-index: 50;
    margin-top: .25rem;
    max-height: 280px;
    overflow-y: auto;
}

.usi-item[b-p0qidk2c9z] {
    display: flex; align-items: center; gap: .5rem;
    padding: .45rem .65rem;
    font-size: .78rem;
    cursor: pointer;
    border-bottom: 1px solid var(--rg-border-light, #f1f5f9);
    color: var(--rg-text-primary, #1e293b);
}
.usi-item:last-child[b-p0qidk2c9z] { border-bottom: none; }
.usi-item:hover[b-p0qidk2c9z], .usi-item.active[b-p0qidk2c9z] {
    background: var(--rg-bg-hover, #f1f5f9);
}

.usi-item-id[b-p0qidk2c9z] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: .72rem;
    font-weight: 600;
    color: var(--rg-text-secondary, #475569);
    background: var(--rg-bg-subtle, #f8fafc);
    padding: .1rem .4rem;
    border-radius: .25rem;
    min-width: 90px;
    flex-shrink: 0;
}
.usi-item-name[b-p0qidk2c9z] { flex: 1; }
.usi-badge[b-p0qidk2c9z] {
    font-size: .65rem;
    font-weight: 700;
    color: var(--rg-accent, #2563eb);
    background: rgba(37,99,235,.1);
    padding: .1rem .4rem;
    border-radius: .25rem;
    flex-shrink: 0;
}

.usi-hint-row[b-p0qidk2c9z] { min-height: 1.1rem; }
.usi-hint[b-p0qidk2c9z] { font-size: .7rem; }
.usi-hint.ok[b-p0qidk2c9z]  { color: var(--rg-success, #16a34a); }
.usi-hint.err[b-p0qidk2c9z] { color: var(--rg-danger,  #dc2626); }

[data-mode="dark"] .usi-item-id[b-p0qidk2c9z]   { background: rgba(255,255,255,.05); }
[data-mode="dark"] .usi-drop[b-p0qidk2c9z]      { box-shadow: 0 8px 24px rgba(0,0,0,.4); }
